{"id":26091,"library":"postcss-selector-lint","title":"PostCSS Selector Lint","description":"PostCSS Selector Lint is a v1.0.2 PostCSS plugin that warns about disallowed CSS selector types (type, class, id, universal, attribute, pseudo) in global vs local (nested) scope. It helps prevent scope pollution by flagging non-nested type/tag selectors. The configuration is fully customizable per scope. Release cadence is low; latest version is stable. Key differentiator: scope-aware linting (global vs local) rather than simple selector blacklisting. Alternatives like stylelint offer broader linting but require more configuration.","status":"active","version":"1.0.2","language":"javascript","source_language":"en","source_url":"https://github.com/maykinmedia/postcss-selector-lint","tags":["javascript","postcss","postcss-plugin","css","selector","lint"],"install":[{"cmd":"npm install postcss-selector-lint","lang":"bash","label":"npm"},{"cmd":"yarn add postcss-selector-lint","lang":"bash","label":"yarn"},{"cmd":"pnpm add postcss-selector-lint","lang":"bash","label":"pnpm"}],"dependencies":[{"reason":"PostCSS plugin architecture requires PostCSS as peer","package":"postcss","optional":false}],"imports":[{"note":"ESM default import; CommonJS require works as this package ships both CJS and ESM.","wrong":"const selectorLint = require('postcss-selector-lint')","symbol":"default","correct":"import selectorLint from 'postcss-selector-lint'"},{"note":"Package exports a single function as default, not a named export.","wrong":"import { selectorLint } from 'postcss-selector-lint'","symbol":"selectorLint","correct":"import selectorLint from 'postcss-selector-lint'"},{"note":"The config property for pseudo-class is misspelled as 'psuedo' (p-s-u-e-d-o). This is a known gotcha.","wrong":"Using incorrect property name 'pseudo' instead of 'psuedo' (typo in package)","symbol":"config","correct":"import selectorLint from 'postcss-selector-lint'; const config = { global: { type: false, class: true, id: false, universal: false, attribute: false, psuedo: false }, local: { type: true, class: true, id: false, universal: true, attribute: true, psuedo: true }, options: { excludedFiles: [] } }; postcss([selectorLint(config)])"}],"quickstart":{"code":"// Install: npm install --save-dev postcss postcss-selector-lint\n\nimport postcss from 'postcss';\nimport selectorLint from 'postcss-selector-lint';\n\nconst config = {\n    global: {\n        type: false,\n        class: true,\n        id: false,\n        universal: false,\n        attribute: false,\n        psuedo: false,\n    },\n    local: {\n        type: true,\n        class: true,\n        id: false,\n        universal: true,\n        attribute: true,\n        psuedo: true,\n    },\n    options: {\n        excludedFiles: ['reset.css'],\n    },\n};\n\npostcss([selectorLint(config)])\n    .process('h1 { color: red; }', { from: 'style.css' })\n    .then(result => {\n        result.warnings().forEach(warn => console.log(warn.toString()));\n    });","lang":"javascript","description":"Sets up PostCSS Selector Lint with a configuration that restricts global selectors to class only, but allows type, universal, and attribute selectors in local scope."},"warnings":[{"fix":"Use property name 'psuedo' in config object.","message":"Configuration property for pseudo-class selectors is misspelled as 'psuedo' (p-s-u-e-d-o) instead of 'pseudo'.","severity":"gotcha","affected_versions":">=1.0.0"},{"fix":"Ensure PostCSS version 7 or lower, or verify compatibility. If using PostCSS 8, consider using an alternative like stylelint-scoped-selector.","message":"Package version 1.0.2 is the latest but there may be no updates since 2020; check for compatibility with PostCSS 8+.","severity":"gotcha","affected_versions":">=1.0.0"},{"fix":"Use with PostCSS 7, or upgrade to a maintained fork/alternative.","message":"The package does not support PostCSS 8 natively; it returns warnings but may not work correctly in PostCSS 8+ environments.","severity":"breaking","affected_versions":">=1.0.0"},{"fix":"Provide exact filenames like 'reset.css' not '*.css'.","message":"The 'excludedFiles' option expects an array of strings matching the filename exactly (not glob patterns).","severity":"gotcha","affected_versions":">=1.0.0"},{"fix":"If you encounter issues, consider migrating to a stylelint plugin for selector linting.","message":"Package uses deprecated PostCSS plugin API (postcss.plugin).","severity":"deprecated","affected_versions":">=1.0.0"}],"env_vars":null,"last_verified":"2026-05-01T00:00:00.000Z","next_check":"2026-07-30T00:00:00.000Z","problems":[{"fix":"Run 'npm install --save-dev postcss-selector-lint' and ensure import path is correct.","cause":"Package not installed or not in node_modules.","error":"Cannot find module 'postcss-selector-lint'"},{"fix":"Use 'import selectorLint from 'postcss-selector-lint'' (default import) and call as 'postcss([selectorLint(config)])'.","cause":"Incorrect import or variable name mismatch.","error":"ReferenceError: selectorLint is not defined"},{"fix":"Use default import: 'import selectorLint from 'postcss-selector-lint'.","cause":"Importing named export instead of default export.","error":"TypeError: selectorLint is not a function"},{"fix":"Change 'pseudo' to 'psuedo' in the configuration object.","cause":"The property name is misspelled in the package; it expects 'psuedo' instead of 'pseudo'.","error":"Unknown property 'pseudo' encountered in configuration"}],"ecosystem":"npm","meta_description":null,"install_score":null,"install_tag":null,"quickstart_score":null,"quickstart_tag":null}