Skip to main content

Documentation Index

Fetch the complete documentation index at: https://extension.js.org/llms.txt

Use this file to discover all available pages before exploring further.

Keep stylesheet quality consistent across extension surfaces and catch CSS issues early. Stylelint runs through scripts or continuous integration (CI), not through the Extension.js dev/build pipeline.

​
When Stylelint is a good fit

  • You maintain shared CSS/Sass/Less across multiple extension surfaces.
  • You want style-quality checks before pull requests merge.
  • You need consistent stylesheet conventions in team workflows.

​
Stylelint capabilities

CapabilityWhat it gives you
CSS quality checksCatch invalid patterns and enforce style conventions
Preprocessor supportLint CSS, Sass, and Less in one workflow
Script and CI integrationRun style checks before merge and release
Formatter alignmentCombine with Prettier to reduce style-tool conflicts

​
Template examples

​
Stylelint configuration template

Preconfigured setup for style linting. new-config-stylelint screenshot 
npx extension@latest create my-extension --template=new-config-stylelint
Repository: examples/new-config-stylelint

​
Usage with an existing extension

Install Stylelint dependencies:

​
Stylelint configuration

Create a Stylelint configuration file at the project root (for example, .stylelintrc.json): 
{
  "extends": "stylelint-config-standard-scss",
  "rules": {
    "color-no-invalid-hex": true,
    "block-no-empty": true
  }
}

​
Run Stylelint

npm run lint:styles
If you do not have a script yet:

​
Integration with Prettier

Integrate Stylelint with Prettier to format and lint your styles together. Install the following dependencies: Then, update your .stylelintrc.json file to include Prettier: 
{
  "extends": [
    "stylelint-config-standard-scss",
    "stylelint-prettier/recommended"
  ]
}
This keeps style formatting and linting concerns aligned.

​
Best practices

  • Keep a dedicated lint:styles command and run it in CI.
  • Use one shared configuration across extension packages in monorepos.
  • Pair Stylelint and Prettier so style formatting stays deterministic.

​
Detection notes

Extension.js can detect Stylelint configuration files for diagnostics/reporting, but it does not inject Stylelint into the build pipeline.

​
Next steps

  • Learn how to integrate Prettier into your formatting workflow.
  • Configure PostCSS for stylesheet transforms.