{"id":13017,"library":"css-parse","title":"CSS Parsing Utility (Legacy)","description":"css-parse is a JavaScript CSS parser originally designed for Node.js, primarily serving as a thin wrapper that exposes the `parse` method from the `css` (reworkcss/css) package. Published over a decade ago (June 2014) at its 2.0.0 version, it has not seen further updates. The underlying `reworkcss/css` library, while slightly more recent (last updated July 2020), is also largely part of an inactive ecosystem of CSS preprocessing tools (`reworkcss`). This package does not support modern CSS syntax out-of-the-box and is exclusively CommonJS. For contemporary CSS parsing, developers typically use actively maintained libraries like PostCSS, which offer broader features, plugin ecosystems, and support for the latest CSS specifications and module systems.","status":"abandoned","version":"2.0.0","language":"javascript","source_language":"en","source_url":"https://github.com/reworkcss/css-parse","tags":["javascript","css","parser","stylesheet"],"install":[{"cmd":"npm install css-parse","lang":"bash","label":"npm"},{"cmd":"yarn add css-parse","lang":"bash","label":"yarn"},{"cmd":"pnpm add css-parse","lang":"bash","label":"pnpm"}],"dependencies":[{"reason":"This package exports the `parse` method from the 'css' package.","package":"css","optional":false}],"imports":[{"note":"This package is CommonJS-only. ES module imports are not supported.","wrong":"import { parse } from 'css-parse'","symbol":"parse","correct":"const parse = require('css-parse')"},{"note":"While 'css-parse' re-exports `parse`, it's often more direct to import from 'css' directly, which is also CJS-only.","wrong":"import { parse } from 'css'","symbol":"parse (from css)","correct":"const { parse } = require('css')"}],"quickstart":{"code":"const parse = require('css-parse');\n\nconst cssString = `\n  /* Example CSS */\n  body {\n    font-family: Arial, sans-serif;\n    color: #333;\n  }\n\n  .container {\n    margin: 0 auto;\n    max-width: 960px;\n  }\n\n  @media (max-width: 600px) {\n    .container {\n      padding: 10px;\n    }\n  }\n`;\n\ntry {\n  const ast = parse(cssString, { source: 'example.css' });\n  console.log('Parsed AST:', JSON.stringify(ast, null, 2));\n  // To access rules, e.g.:\n  // console.log(ast.stylesheet.rules[0].selectors);\n  // console.log(ast.stylesheet.rules[0].declarations);\n} catch (error) {\n  console.error('Parsing error:', error.message);\n}","lang":"javascript","description":"Demonstrates parsing a CSS string into an Abstract Syntax Tree (AST) using the `parse` method."},"warnings":[{"fix":"Consider migrating to an actively maintained CSS parser like PostCSS or a CSS-in-JS solution for robust and up-to-date CSS processing.","message":"This package and its underlying 'css' dependency are part of the 'reworkcss' ecosystem, which is largely unmaintained. It may not correctly parse or handle modern CSS features and syntax (e.g., CSS Custom Properties, newer pseudo-classes/elements, nesting, 'gap' for flexbox/grid).","severity":"breaking","affected_versions":">=1.0.0"},{"fix":"Use `require()` for importing. If you must use it in an ESM project, consider dynamic `import()` or a CJS wrapper, but re-evaluate if a modern ESM-compatible parser is a better fit.","message":"The package is CommonJS-only and does not support ES module syntax (`import/export`). Attempting to use it in an ESM context without proper transpilation will result in errors.","severity":"gotcha","affected_versions":">=1.0.0"},{"fix":"When parsing potentially invalid CSS, pass `{ silent: true }` as an option: `const ast = parse(cssString, { silent: true }); if (ast.stylesheet.parsingErrors) { console.error(ast.stylesheet.parsingErrors); }`","message":"By default, `css.parse` (which `css-parse` uses) throws an error on invalid CSS. To collect errors without stopping execution, you must pass the `{ silent: true }` option and check `ast.stylesheet.parsingErrors`.","severity":"gotcha","affected_versions":">=1.0.0"}],"env_vars":null,"last_verified":"2026-04-19T00:00:00.000Z","next_check":"2026-07-18T00:00:00.000Z","problems":[{"fix":"Ensure you are using `const parse = require('css-parse');` for CommonJS environments.","cause":"Incorrectly importing the module as a default export or attempting named import from a CommonJS module in an ESM context.","error":"TypeError: parse is not a function"},{"fix":"Modify your import to `const parse = require('css-parse');` or configure your build system to handle CommonJS modules in an ESM context.","cause":"Attempting to use `css-parse` (or its `css` dependency) with ES module syntax (`import`) in a pure ESM environment without a CommonJS compatibility layer.","error":"SyntaxError: Unexpected token 'export'"},{"fix":"Either correct the CSS syntax or parse with the `{ silent: true }` option to collect errors in `ast.stylesheet.parsingErrors` instead of throwing.","cause":"The input CSS string contains a syntax error, and `css-parse` is throwing an error by default (not in 'silent' mode).","error":"SyntaxError: missing '}' (CSS)"}],"ecosystem":"npm","meta_description":null,"install_score":null,"install_tag":null,"quickstart_score":null,"quickstart_tag":null,"pypi_latest":null,"cli_name":""}