SCSS linterEdit on GitHub
SCSS linter allows you to find and fix code style mistakes. It helps a team follow the same standards and make code more readable.
To analyze and fix existing SCSS files, Stylelint is used.
For details about how to install the SCSS Linter for your project, see the SCSS linter integration guide.
Using SCSS Linter
To execute the SCSS Linter, do the following:
- Install the Node modules:
- Execute the SCSS Linter in:
- validation mode:
npm run yves:stylelint
- fix mode:
npm run yves:stylelint:fix
SCSS Linter config
The config for Stylelint resides in the @spryker/frontend-config.stylelint module.
To redefine the path for the config file, adjust
/frontend/libs/stylelint.js and use other rules for the SCSS Linter.
The SCSS Linter also uses the ignore file
/.stylelintignore that includes directories and files where the SCSS linter shouldn’t be executed.
SCSS Linter rules related to formatting aren’t included in the stylelint config to avoid duplication with the Prettier rules.
CI checks and the pre-commit hook
The SCSS Linter is integrated into:
- Pre-commit hooks
The function that executes the SCSS Linter before the commit resides in
Command to run the SCSS Linter is integrated into
- node ./frontend/libs/stylelint
If you commit without the pre-commit hooks, you should run the SCSS Linter manually to avoid issues with Travis.
Pre-commit hooks are integrated only into the Shop Suite and are not integrated in the B2B and B2C Demo Shops.
For submitting the form