Enforce code style with ESlint
To help you to run static code analysis on your code, the spm-eslint-config package contains an ESLint configuration with predefined coding style rules and an EditorConfig configuration file.
The ESLint configuration is in the ./node_modules/@spm/eslint-config/index.js
file.
The .editorconfig EditorConfig setup file is in the root directory of the sample
application.
Running ESLint
To check the code for ESLint violations, run the following command in the starter application root directory. Errors are listed in the console.
npm run lintFixing ESLint violations
Run the following command for ESLint to fix syntactic problems automatically:
npm run lint -- --fixYou must manually fix any violations that can't be resolved automatically.
The first time that you run a static code analyzer on your code, particularly if coding style was not previously enforced, you might see numerous errors. Don't get discouraged, while it might take to fix all of the violations, ensuring that your team uses a consistent coding style has significant long-term benefits.
ESLint plug-ins for code editors
Most code editors support plug-ins for linting. ESLint plugin is a useful plug-in for Microsoft Visual Studio Code. ESLint plugins are also available for Atom.
If you use a plug-in, errors are highlighted in the code editor and can be seen and fixed during development. When all the developers use a plug-in, is easier to maintain a consistent code style.
Automation
If you have a CD/CI pipeline, you can include linting as part of the testing phase. It is a good idea to correct code with linting issues before you merge it into the codebase.
EditorConfig
The included editor config configuration file ensures consistent coding style when it comes to indentation, spacing, and quotation types.
EditorConfig works without a plug-in for Microsoft Visual Studio Code. If you use other editors, like Atom or Sublime Text, you need a plug-in. For more information about available plug-ins, see EditorConfig website.