JetBrains Rider provides facilities to run CSS-specific code quality inspections through integration with the Stylelint code verification tool. The tool registers itself as a JetBrains Rider code inspection: it checks CSS code for most common mistakes and discrepancies without running the application. When a tool is activated, it launches automatically on the edited CSS file. Discrepancies are highlighted and reported in pop-up information windows, a pop-up window appears when you hover the mouse pointer over a stripe in the Validation sidebar. You can also press Alt+Enter to examine errors and apply suggested quick fixes.
Before you start
- Install Node.js and configure it as a local Node.js interpreter.
- Install and enable the ^plugin_name% repository plugin on the Plugins page as described in Installing, Updating and Uninstalling Repository Plugins and Enabling and Disabling Plugins.
Installing Stylelint globally
Open the embedded Terminal ( ) and type
npm install -g stylelint at the command prompt.
Activating and configuring Stylelint
- In the Settings/Preferences dialog (Ctrl+Alt+S), click Stylesheets under Languages and Frameworks, and then click Stylelint. The Stylelint page opens.
- Select the Enable checkbox to activate Stylelint. After that the controls in the dialog box become available.
- In the Node Interpreter field, specify the Node.js interpreter to use, see Configuring a local Node.js interpreter for details.
- In the Stylelint Package field, specify the location of the
stylelintpackage installed globally or in the current project.