{"id":20583,"library":"stylelint-custom-processor-loader","title":"stylelint-custom-processor-loader","description":"A Webpack loader (v0.6.0) that integrates Stylelint with custom processors (e.g., styled-components, markdown, HTML) into the Webpack build pipeline. Unlike postcss-loader, which only handles CSS files, this loader enables linting of CSS-in-JS and other non-standard syntaxes directly from JavaScript/TypeScript files. It requires peer dependencies stylelint >=7.8 and webpack >=2, and is intended for Webpack 2+ only. The loader is stable but receives infrequent updates, designed specifically for custom processor workflows that postcss-loader cannot support.","status":"active","version":"0.6.0","language":"javascript","source_language":"en","source_url":"https://github.com/emilgoldsmith/stylelint-custom-processor-loader","tags":["javascript","lint","linter","stylelint","loader","webpack","webpack-loader","styled-components","custom-processor"],"install":[{"cmd":"npm install stylelint-custom-processor-loader","lang":"bash","label":"npm"},{"cmd":"yarn add stylelint-custom-processor-loader","lang":"bash","label":"yarn"},{"cmd":"pnpm add stylelint-custom-processor-loader","lang":"bash","label":"pnpm"}],"dependencies":[{"reason":"Peer dependency: core linting engine required at runtime","package":"stylelint","optional":false},{"reason":"Peer dependency: loader interface required; webpack >=2","package":"webpack","optional":false}],"imports":[{"note":"Loader is typically used in webpack config as string 'stylelint-custom-processor-loader', not imported directly. Node require works for runtime use, but ESM import is preferred for consistency.","wrong":"const loader = require('stylelint-custom-processor-loader')","symbol":"default","correct":"import stylelintCustomProcessorLoader from 'stylelint-custom-processor-loader'"},{"note":"Loader must come last (first executed) in the use array when combined with other loaders. Omitting 'exclude: /node_modules/' may cause errors. Common mistake: placing loader first in 'use' array.","wrong":"module.exports = { module: { rules: [ { test: /\\.jsx?$/, use: 'stylelint-custom-processor-loader' } ] } }","symbol":"default (config use)","correct":"module.exports = { module: { rules: [ { test: /\\.jsx?$/, loader: 'stylelint-custom-processor-loader', exclude: /node_modules/ } ] } }"},{"note":"Options are passed via webpack's 'options' object, not imported. The npm package exports a single function, but direct import for options is not needed.","wrong":"require('stylelint-custom-processor-loader').default","symbol":"options","correct":"import stylelintCustomProcessorLoader from 'stylelint-custom-processor-loader';\n// In webpack config:\n{ loader: 'stylelint-custom-processor-loader', options: { configPath: './.my-stylelintrc' } }"}],"quickstart":{"code":"// webpack.config.js\nconst path = require('path');\nmodule.exports = {\n  entry: './src/index.js',\n  output: { path: path.resolve(__dirname, 'dist'), filename: 'bundle.js' },\n  module: {\n    rules: [\n      {\n        test: /\\.jsx?$/,\n        use: ['babel-loader', 'stylelint-custom-processor-loader'],\n        exclude: /node_modules/,\n      },\n    ],\n  },\n};\n// .stylelintrc (in project root)\n{\n  \"processors\": [\"stylelint-processor-styled-components\"],\n  \"rules\": { \"declaration-colon-space-after\": \"always\" }\n}","lang":"javascript","description":"Shows webpack config integrating babel-loader and stylelint-custom-processor-loader, plus minimal .stylelintrc for styled-components."},"warnings":[{"fix":"Upgrade to webpack >=2 or use stylelint-loader instead.","message":"Webpack 1 is not supported; only Webpack 2+","severity":"breaking","affected_versions":">=0.0.0"},{"fix":"Ensure stylelint-custom-processor-loader is the last entry in the 'use' array (after other loaders).","message":"Loader order: must be the last loader in the 'use' array (executed first). Placing it before babel-loader causes syntax errors.","severity":"gotcha","affected_versions":">=0.0.0"},{"fix":"Create a .stylelintrc file and specify processors (e.g., stylelint-processor-styled-components).","message":"Without stylelint config file or processors, linting does nothing.","severity":"gotcha","affected_versions":">=0.0.0"},{"fix":"For non-custom-processor workflows, switch to postcss-loader with stylelint plugin.","message":"Loader is no longer actively maintained; author recommends postcss-loader for standard CSS.","severity":"deprecated","affected_versions":">=0.6.0"},{"fix":"Upgrade Node to version >=6 or pin to an older version of the loader if needed.","message":"Requires Node >=6; incompatible with older Node versions.","severity":"breaking","affected_versions":">=0.6.0"}],"env_vars":null,"last_verified":"2026-04-25T00:00:00.000Z","next_check":"2026-07-24T00:00:00.000Z","problems":[{"fix":"Run: npm install --save-dev stylelint","cause":"Missing peer dependency stylelint.","error":"Error: Cannot find module 'stylelint'"},{"fix":"Create a .stylelintrc file in project root or pass configPath option with valid path.","cause":"Missing .stylelintrc or configPath option pointing to invalid config.","error":"Module build failed: Error: No configuration provided for stylelint-custom-processor-loader"},{"fix":"Install processor: npm install --save-dev stylelint-processor-styled-components, and add processors array to .stylelintrc.","cause":"Processor not installed or not specified in stylelint config.","error":"Error: Cannot find module 'stylelint-processor-styled-components'"},{"fix":"Ensure stylelint-custom-processor-loader is the last loader in the 'use' array (first executed).","cause":"Loader order incorrect (babel-loader runs after this loader on non-JS output).","error":"Module parse failed: Unexpected token (1:0) You may need an appropriate loader to handle this file type."}],"ecosystem":"npm","meta_description":null,"install_score":null,"install_tag":null,"quickstart_score":null,"quickstart_tag":null}