Конфигурация Standard

JavaScript Standard Style (или просто Standard) — один из наиболее известных наборов правил оформления кода для JavaScript. Он определяет единый стиль написания программ, устраняет споры о форматировании и обеспечивает одинаковый внешний вид исходного кода во всех частях проекта.

В экосистеме ESLint конфигурация Standard представляет собой готовый набор правил, который можно подключить и использовать без самостоятельной настройки десятков параметров.

Основные особенности Standard:

  • отсутствие точек с запятой в конце инструкций;
  • использование двух пробелов для отступов;
  • обязательное использование одинарных кавычек;
  • строгое сравнение через === и !==;
  • запрет неиспользуемых переменных;
  • единое оформление пробелов и переносов строк;
  • контроль потенциально опасных конструкций JavaScript.

Standard особенно популярен в проектах с большим количеством разработчиков, поскольку позволяет быстро привести кодовую базу к единому стилю.

Установка Standard для ESLint

Для использования конфигурации требуется установить сам ESLint и набор пакетов Standard.

Для npm:

npm install --save-dev eslint eslint-config-standard
npm install --save-dev eslint-plugin-import
npm install --save-dev eslint-plugin-n
npm install --save-dev eslint-plugin-promise

Для Yarn:

yarn add -D eslint eslint-config-standard
yarn add -D eslint-plugin-import
yarn add -D eslint-plugin-n
yarn add -D eslint-plugin-promise

После установки конфигурация может быть подключена в настройках ESLint.

Подключение Standard в классической конфигурации

Файл .eslintrc.json:

{
  "extends": ["standard"]
}

Файл .eslintrc.js:

module.exports = {
  extends: ['standard']
}

После подключения все правила Standard автоматически становятся активными.

Подключение Standard в Flat Config

Начиная с ESLint 9, основной системой конфигурирования считается Flat Config.

Пример файла eslint.config.js:

const standard = require('eslint-config-standard')

module.exports = [
  {
    ...standard
  }
]

Во многих современных проектах Flat Config постепенно вытесняет старый формат .eslintrc.

Основные принципы Standard

Отказ от точек с запятой

Одной из самых известных особенностей Standard является отказ от точек с запятой.

Допустимо:

const name = 'Alex'

console.log(name)

Нарушение правила:

const name = 'Alex';
console.log(name);

Правило основано на механизме Automatic Semicolon Insertion (ASI), встроенном в JavaScript.

Использование одинарных кавычек

Standard требует использовать одинарные кавычки для строк.

Правильно:

const city = 'London'

Неправильно:

const city = "London"

Исключение возникает тогда, когда внутри строки уже содержится одинарная кавычка.

const text = "It's a test"

Два пробела для отступов

Все уровни вложенности оформляются двумя пробелами.

Правильно:

function calculate () {
  if (true) {
    console.log('Hello')
  }
}

Неправильно:

function calculate () {
        if (true) {
                console.log('Hello')
        }
}

Единый размер отступов значительно улучшает читаемость больших файлов.

Пробел перед круглыми скобками функции

Standard требует ставить пробел между именем функции и открывающей скобкой.

Правильно:

function test () {
  return true
}

Неправильно:

function test() {
  return true
}

То же правило применяется к методам и стрелочным функциям.

const run = () => {
  console.log('Run')
}

Контроль качества кода

Standard отвечает не только за внешний вид программы, но и за предотвращение ошибок.

Неиспользуемые переменные

Ошибка:

const userName = 'Alex'

Если переменная нигде не используется, ESLint сообщит о нарушении.

Правильно:

const userName = 'Alex'

console.log(userName)

Такие проверки помогают обнаруживать забытый код после рефакторинга.

Использование строгого сравнения

Standard требует применять операторы строгого сравнения.

Правильно:

if (value === 10) {
  console.log('OK')
}

Неправильно:

if (value == 10) {
  console.log('OK')
}

Строгое сравнение исключает неявные преобразования типов.

Пример:

0 == false

Результат:

true

При строгом сравнении:

0 === false

Результат:

false

Запрет повторного объявления переменных

Ошибка:

let count = 10
let count = 20

Правильно:

let count = 10
count = 20

Подобные проверки предотвращают логические ошибки и путаницу в коде.

Контроль недостижимого кода

Ошибка:

function test () {
  return true

  console.log('Never executed')
}

Код после return никогда не выполнится.

Standard сообщает о таких ситуациях автоматически.

Работа с объектами

Пробелы внутри фигурных скобок

Правильно:

const user = { name: 'Alex', age: 25 }

Неправильно:

const user = {name: 'Alex', age: 25}

Такой стиль делает структуру объекта более читаемой.

Запятые в объектах

Правильно:

const config = {
  host: 'localhost',
  port: 3000
}

Неправильно:

const config = {
  host: 'localhost',
  port: 3000,
}

Standard запрещает завершающие запятые в большинстве случаев.

Работа с массивами

Правильно:

const numbers = [1, 2, 3]

Неправильно:

const numbers = [ 1, 2, 3 ]

Пробелы внутри квадратных скобок не используются.

Для многострочных массивов:

const users = [
  'Alex',
  'John',
  'Kate'
]

Работа с функциями

Именованные функции

function createUser (name) {
  return {
    name
  }
}

Стрелочные функции

const sum = (a, b) => {
  return a + b
}

Для одного параметра скобки сохраняются:

const square = (x) => {
  return x * x
}

Такой подход обеспечивает единообразие во всех функциях проекта.

Работа с условиями

Правильно:

if (isAdmin) {
  console.log('Access granted')
}

Неправильно:

if(isAdmin){
console.log('Access granted')
}

Все конструкции управления должны иметь корректные отступы и пробелы.

Блоки else

Правильно:

if (age >= 18) {
  console.log('Adult')
} else {
  console.log('Minor')
}

Неправильно:

if (age >= 18) {
  console.log('Adult')
}
else {
  console.log('Minor')
}

Работа с циклами

Циклы оформляются по тем же правилам.

for (let i = 0; i < 10; i++) {
  console.log(i)
}
while (condition) {
  process()
}
for (const user of users) {
  console.log(user)
}

Работа с импортами

Standard использует плагин eslint-plugin-import, который проверяет корректность импортов.

Пример:

import fs from 'node:fs'
import path from 'node:path'

Плагин способен обнаруживать:

  • несуществующие модули;
  • циклические зависимости;
  • дублирующиеся импорты;
  • ошибочные пути.

Использование Standard совместно с собственными правилами

Конфигурация Standard может выступать базой для дальнейшей настройки ESLint.

Пример:

module.exports = {
  extends: ['standard'],
  rules: {
    'no-console': 'warn',
    'no-debugger': 'error'
  }
}

В этом случае сохраняются все правила Standard, а отдельные проверки переопределяются.

Отключение отдельных правил

Иногда проект требует исключений.

Отключение правила для всего проекта:

module.exports = {
  extends: ['standard'],
  rules: {
    'no-unused-vars': 'off'
  }
}

Отключение для конкретной строки:

// eslint-disable-next-line no-unused-vars
const temp = 100

Отключение блока кода:

/* eslint-disable no-console */

console.log('Debug')
console.log('Debug')

/* eslint-enable no-console */

Проверка проекта

Запуск анализа:

npx eslint .

Проверка отдельного файла:

npx eslint app.js

Проверка каталога:

npx eslint src

После выполнения ESLint выводит список найденных нарушений.

Пример:

5:10  error  'data' is assigned a value but never used
8:15  error  Strings must use singlequote

Автоматическое исправление ошибок

Большая часть замечаний Standard исправляется автоматически.

Запуск:

npx eslint . --fix

ESLint способен автоматически:

  • заменить двойные кавычки на одинарные;
  • скорректировать отступы;
  • удалить лишние пробелы;
  • исправить переносы строк;
  • привести оформление к требованиям Standard.

Однако логические ошибки, например неиспользуемые переменные или неверные условия, требуют ручного исправления.

Преимущества использования Standard

Единый стиль кода

Все файлы оформляются одинаково независимо от автора.

Минимальное количество настроек

Конфигурация практически не требует дополнительной подготовки.

Снижение количества ошибок

Многие потенциальные проблемы обнаруживаются ещё до запуска программы.

Быстрое подключение к проекту

Достаточно установить пакет и указать его в extends.

Широкое распространение

Большое количество открытых проектов использует Standard как основной стиль кодирования.

Упрощение код-ревью

Разработчики обсуждают архитектуру и логику программы, а не расположение пробелов или выбор кавычек.

Ограничения конфигурации Standard

Несмотря на популярность, Standard подходит не для всех проектов.

Некоторые команды предпочитают:

  • обязательные точки с запятой;
  • двойные кавычки;
  • четыре пробела вместо двух;
  • собственные соглашения по оформлению функций и импортов.

В подобных случаях Standard обычно используется как отправная точка и дополняется пользовательскими правилами ESLint.

Совместимость с другими инструментами

Standard часто применяется совместно с:

  • ESLint;
  • TypeScript;
  • Babel;
  • Webpack;
  • Vite;
  • Node.js;
  • React;
  • Vue;
  • Express.

Во многих проектах конфигурация выступает центральным механизмом контроля качества исходного кода и единообразия стиля программирования, объединяя проверки форматирования и анализа потенциальных ошибок в единую систему.

Оглавление