Плагіни для Stylelint

Стилінт — CSS лінтер

Зміст

Конфігурація та інтеграція
Синтаксис і форматування
Продуктивність та оптимізація
Налаштування та розширюваність
Лінтери та форматери
Інтеграції з редакторами
Запуск завдань та інструменти для збірки

Стилінт

Stylelint (доступний тут) — потужний та гнучкий інструмент, який допомагає розробникам дотримуватись послідовних стилістичних правил і уникати помилок у CSS коді. З більш ніж 100 вбудованими правилами та підтримкою плагінів, кастомних синтаксисів та іншого, Stylelint гарантує, що стилі будуть чистими, підтримуваними та без помилок.

Як головний CSS лінтер, можливості Stylelint виходять далеко за межі базового виявлення помилок. Його потужна система плагінів дозволяє розробникам налаштовувати його функціональність під свої потреби, будь то застосування кастомних правил найменувань, інтеграція з інструментами для збірки або застосування просунутих правил лінтингу.

Зокрема, версія 16 Stylelint, випущена в грудні 2023 року, видалила 76 стилістичних правил, які тепер можуть оброблятись за допомогою Prettier. У цій статті ми розглянемо світ плагінів для Stylelint і покажемо, як покращити ваш процес лінтингу CSS.

Конфігурація та інтеграція

stylelint-config-recommended-vue: Рекомендувана налаштування для Vue для Stylelint.
stylelint-config-sass-guidelines: Налаштування для Sass.
stylelint-config-standard-scss: Стандартне налаштування для SCSS.
@primer/stylelint-config: Налаштування для GitHub.

Синтаксис і форматування

stylelint-selector-bem-pattern: Вимагати використання BEM патернів для селекторів.
stylelint-no-browser-hacks: Заборонити використання хаків для браузерів, які не мають відношення до тих, що ви підтримуєте.
stylelint-no-unsupported-browser-features: Заборонити CSS, який не підтримується вашими цільовими браузерами.
stylelint-gamut: Вимагати використання стандартних різних колірних просторів.
stylelint-no-indistinguishable-colors: Заборонити кольори, які підозріло схожі один на одного.

Продуктивність та оптимізація

stylelint-high-performance-animation: Заборонити використання низько продуктивних властивостей анімації та переходів.

Налаштування та розширюваність

stylelint-plugin-defensive-css: Вимагати використання найкращих практик захисту CSS.
stylelint-react-native: Вимагати дотримання правил для React Native.
stylelint-scss: Вимагати використання SCSS-специфічних конвенцій.
stylelint-stylus: Вимагати використання Stylus-специфічних конвенцій.

Лінтери та форматери

stylelint-actions-formatters: Виводити помилки та попередження для GitHub Actions.
stylelint-checkstyle-formatter: Виводити звіти у форматі Checkstyle XML.
stylelint-codeframe-formatter: Виводити помилки та попередження у вигляді codeframe.
stylelint-formatter-gitlab-code-quality-report: Виводить помилки та попередження у вигляді звіту про якість коду для GitLab.
stylelint-formatter-pretty: Красива форматувальник для терміналів.

Інтеграції з редакторами

coc-stylelint: Розширення для серверу мов Neovim.
vscode-stylelint: Розширення для VS Code.

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

broccoli-stylelint: Плагін для Broccoli.
ember-cli-stylelint: Плагін для Ember CLI.
grunt-stylelint: Плагін для Grunt.
gulp-stylelint: Плагін для Gulp.
jest-preset-stylelint: Спільні налаштування для Jest в середовищах Stylelint.
jest-runner-stylelint: Плагін для Jest.
nx-stylelint: Плагін для Nx.
stylelint-webpack-plugin: Плагін для Webpack.

Перекладено з: Stylelint Plugins

Leave a Reply

Your email address will not be published. Required fields are marked *