stylelint-config
MOXY stylelint configuration to be used across projects.
Installation
$ npm install stylelint @moxy/stylelint-config --save-dev
Usage
Create a .stylelintrc.json
file with:
{
"extends": "@moxy/stylelint-config"
}
.css
files to avoid unexpected errors. You can do this by adding the tweaking ignoreFiles
:
{
"extends": "@moxy/stylelint-config",
"ignoreFiles": [
"!**/*.css"
]
}
File naming convention
File names should be hyphenated (lower case with hyphens).
If a CSS file is strictly associated with a JS file, it should follow the name of the JS file, e.g.: if we need to style a Button.js
react component, then the css file should be named Button.css
.
Comments convention
/* ==========================================================================
Main comment block
========================================================================== */
.title {}
/* Secondary comment block
============================================= */
.description {}
/* Tertiary comment block & line/inline comments */
.tags {
/* Line comment */
background: red;
transition: color 0.2s ease-out; /* Inline comment */
}
/*
Multi
line
comment
*/
Tests
$ npm test
$ npm test -- --watch # during development