Я использую VSCode для повседневной работы, и мне нравится, когда IDE помогает мне писать более качественный код. Поэтому я использую 2 замечательные утилиты StandardJS и Prettier.
StandardJS — это полное руководство по стилю со встроенным хорошо настроенным линтером и форматтером. Это руководство по стилю нельзя перенастроить, так что вам не стоит об этом беспокоиться. Для простых случаев вы можете просто установить плагин для вашей IDE и наслаждаться. Чтобы сделать его более настраиваемым и хорошо работать с Prettier, я использую предустановку StandardJS для ESLint (eslint-config-standard).
Есть некоторые сложные случаи, когда он не может идеально форматировать код. Даже мне сложно решить, как это оформить. Вот почему я использую Prettier. Это просто средство форматирования кода, но поддерживает не только JS, но и некоторые другие языки: JSX, TypeScript, JSON, CSS, SCSS, GraphQL. Его команда и сообщество также работают над плагинами для Ruby, PHP, Python и т. д.
Для начала на вашем компьютере должен быть установлен NodeJS с NPM. Сначала вам нужно установить некоторые пакеты узлов для этого:
npm i -g eslint babel-eslint eslint-config-standard eslint-config-standard-react eslint-plugin-react eslint-plugin-standard eslint-plugin-promise eslint-plugin-import eslint-plugin-node eslint-plugin-react prettier eslint-config-prettier eslint-plugin-prettier
Затем поместите файл .eslintrc
в каталог, где находятся все наши проекты.
Теперь вы можете форматировать файлы через терминал:
eslint --fix --ext js,jsx src
или вы можете добавить это в раздел scripts внутри вашего package.json:
"format": "eslint --fix --ext js,jsx src"
Для работы с VSCode необходимо установить расширение vscode-eslint.
Я также рекомендую установить это, потому что они тоже помогают:
- скобка-пара-раскрашиватель
- vscodeintellicode
- wix.glean
- уайтвиз
- "программа проверки орфографии"
- vscode-css-заглянуть
- гитленс
- материал-иконка-тема
- путь-разум
FireCode — мой любимый бесплатный шрифт с лигатурами.
А это мой VSCode User Settings
(Code › Preferences › Settings):
Теперь каждый раз, когда вы сохраняете файл, он будет форматировать его.
КОНЕЦ