{"id":11949,"library":"rework-visit","title":"Rework CSS AST Declaration Visitor","description":"rework-visit is a utility package providing a declaration visitor for the Rework CSS preprocessor's Abstract Syntax Tree (AST). Released as version 1.0.0 in June 2013, it has not seen active development or new releases since. The package enables Rework plugins to traverse and manipulate CSS declarations programmatically within the AST. It is specifically designed for the `rework` ecosystem, which has largely been superseded by more modern and actively maintained CSS tooling like PostCSS. Therefore, rework-visit is considered abandoned, with no ongoing release cadence or new feature development. Its core differentiator is its tight integration with the now-legacy Rework AST, making it unsuitable for contemporary CSS processing pipelines.","status":"abandoned","version":"1.0.0","language":"javascript","source_language":"en","source_url":null,"tags":["javascript","css","rework"],"install":[{"cmd":"npm install rework-visit","lang":"bash","label":"npm"},{"cmd":"yarn add rework-visit","lang":"bash","label":"yarn"},{"cmd":"pnpm add rework-visit","lang":"bash","label":"pnpm"}],"dependencies":[{"reason":"This package is a utility that operates on the Abstract Syntax Tree generated by the 'rework' CSS preprocessor. It provides no standalone functionality.","package":"rework","optional":false}],"imports":[{"note":"rework-visit is a CommonJS module and only supports `require()` syntax. It exports the visitor function as the default.","wrong":"import visit from 'rework-visit';","symbol":"visit","correct":"const visit = require('rework-visit');"}],"quickstart":{"code":"const rework = require('rework');\nconst visit = require('rework-visit');\n\nconst cssInput = `\n  .container {\n    color: blue;\n    font-size: 16px;\n    display: flex;\n  }\n  .item {\n    margin: 10px;\n    padding: 5px;\n  }\n`;\n\nfunction myReworkPlugin(stylesheet) {\n  visit.declarations(stylesheet, function (declarations, node) {\n    declarations.forEach(function (declaration) {\n      // Example: Convert all font-size values to '1.2em' (for demonstration)\n      if (declaration.property === 'font-size') {\n        declaration.value = '1.2em';\n      }\n      // Example: Add a new declaration\n      if (declaration.property === 'display' && declaration.value === 'flex') {\n        declarations.push({\n          type: 'declaration',\n          property: 'align-items',\n          value: 'center'\n        });\n      }\n    });\n  });\n}\n\n// Apply the plugin\nconst outputCss = rework(cssInput)\n  .use(myReworkPlugin)\n  .toString();\n\nconsole.log(outputCss);\n/*\n  Expected Output:\n  .container {\n    color: blue;\n    font-size: 1.2em;\n    display: flex;\n    align-items: center;\n  }\n  .item {\n    margin: 10px;\n    padding: 5px;\n  }\n*/","lang":"javascript","description":"This example demonstrates how to use `rework-visit` within a `rework` plugin to iterate over and modify CSS declarations in an AST. It changes 'font-size' and adds 'align-items' to flex containers."},"warnings":[{"fix":"Migrate your CSS processing pipeline to PostCSS or a modern alternative. Existing `rework` plugins using `rework-visit` will likely need to be rewritten for the new tooling.","message":"The `rework-visit` package, along with the entire `rework` ecosystem, is unmaintained and considered abandoned. The last release was in 2013. Users should migrate to actively maintained CSS processing tools like PostCSS.","severity":"breaking","affected_versions":"1.0.0"},{"fix":"Ensure your project uses CommonJS `require()` statements for `rework-visit`. If your project is ESM-first, you might need to use dynamic `import()` or stick to CommonJS for the parts interacting with `rework-visit`.","message":"rework-visit is a CommonJS module and does not support ES Modules (ESM) `import` syntax. Attempting to `import` it in an ESM context will result in a runtime error.","severity":"gotcha","affected_versions":"1.0.0"},{"fix":"Avoid using `rework-visit` for projects requiring modern CSS syntax. Use tools that actively support the latest CSS specifications.","message":"Due to its age and lack of maintenance, `rework-visit` and the `rework` parser it relies on do not support modern CSS features (e.g., CSS Nesting, Container Queries, `color-mix()`, `:has()`). Parsing modern CSS with `rework` will likely lead to errors or incorrect AST generation.","severity":"breaking","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":"This package is CommonJS. If you are in an ESM module, you cannot directly use `require()`. You must either convert your file to CommonJS (`.cjs` or `\"type\": \"commonjs\"` in `package.json`) or use a dynamic import, e.g., `const visit = await import('rework-visit');` (note: this will still return a module object, not the direct function, so you might need `(await import('rework-visit')).default`).","cause":"Attempting to use `require()` in an ES Module (ESM) file context.","error":"TypeError: require is not a function"},{"fix":"This error indicates that the CSS input contains syntax (e.g., nesting, custom properties advanced usage, new selectors) that the outdated `rework` parser cannot handle. `rework-visit` is not compatible with modern CSS. Consider using PostCSS with appropriate plugins for contemporary CSS processing.","cause":"The `rework` parser, which `rework-visit` relies on, encounters modern CSS syntax it does not understand.","error":"Error: Parse error on line X, column Y: Unexpected token"}],"ecosystem":"npm"}