PhpStorm provides facilities to run CSS-specific code quality inspections through integration with the Stylelint code verification tool. The tool registers itself as a PhpStorm 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. Learn more about inspections and intention actions at Code Inspection and Intention Actions.
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.