Security News
pnpm 10.0.0 Blocks Lifecycle Scripts by Default
pnpm 10 blocks lifecycle scripts by default to improve security, addressing supply chain attack risks but sparking debate over compatibility and workflow changes.
Rework is a plugin framework for CSS preprocessing. It allows you to manipulate CSS using JavaScript, providing a way to transform stylesheets with various plugins.
CSS Parsing
Rework can parse CSS strings into an Abstract Syntax Tree (AST), which can then be manipulated programmatically.
const rework = require('rework');
const css = 'body { color: red; }';
const ast = rework(css).toString();
console.log(ast);
CSS Transformation
Rework allows you to transform CSS using plugins. For example, the rework-npm plugin lets you import CSS from npm packages.
const rework = require('rework');
const reworkNPM = require('rework-npm');
const css = '@import "normalize.css";';
const output = rework(css).use(reworkNPM()).toString();
console.log(output);
Vendor Prefixing
Rework can automatically add vendor prefixes to CSS properties using plugins like rework-plugin-prefix.
const rework = require('rework');
const reworkPrefix = require('rework-plugin-prefix');
const css = 'body { display: flex; }';
const output = rework(css).use(reworkPrefix('webkit')).toString();
console.log(output);
PostCSS is a tool for transforming CSS with JavaScript plugins. It is more modern and widely used compared to Rework, offering a larger ecosystem of plugins and better performance.
Less is a CSS pre-processor that extends the CSS language, adding features like variables, mixins, and functions. Unlike Rework, Less is a full-fledged pre-processor rather than a plugin framework.
Sass is another CSS pre-processor that provides advanced features like variables, nested rules, and mixins. Sass is more feature-rich and has a larger community compared to Rework.
CSS manipulations built on css
, allowing
you to automate vendor prefixing, create your own properties, inline images,
anything you can imagine!
Please refer to css
for AST documentation
and to report parser/stringifier issues.
$ npm install rework
var rework = require('rework');
var pluginA = require('pluginA');
var pluginB = require('pluginB');
rework('body { font-size: 12px; }', { source: 'source.css' })
.use(pluginA)
.use(pluginB)
.toString({ sourcemap: true })
Accepts a CSS string and returns a new Rework
instance. The options
are
passed directly to css.parse
.
Use the given plugin fn
. A rework "plugin" is simply a function accepting the
stylesheet root node and the Rework
instance.
Returns the string representation of the manipulated CSS. The options
are
passed directly to css.stringify
.
Unlike css.stringify
, if you pass sourcemap: true
a string will still be
returned, with the source map inlined. Also use sourcemapAsObject: true
if
you want the css.stringify
return value.
Rework has a rich collection of plugins and mixins. Browse all the Rework plugins available on npm.
Plugins of particular note:
calc()
expressionsrgba(#fc0, .5)
extend: selector
support@import
@import
using node's module resolverheight: @width
url()
s with a given function(The MIT License)
Copyright (c) 2012–2013 TJ Holowaychuk tj@vision-media.ca
Copyright (c) 2014 Contributors
Permission is hereby granted, free of charge, to any person obtaining a copy of this software and associated documentation files (the 'Software'), to deal in the Software without restriction, including without limitation the rights to use, copy, modify, merge, publish, distribute, sublicense, and/or sell copies of the Software, and to permit persons to whom the Software is furnished to do so, subject to the following conditions:
The above copyright notice and this permission notice shall be included in all copies or substantial portions of the Software.
THE SOFTWARE IS PROVIDED 'AS IS', WITHOUT WARRANTY OF ANY KIND, EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE.
FAQs
Plugin framework for CSS preprocessing
The npm package rework receives a total of 492,775 weekly downloads. As such, rework popularity was classified as popular.
We found that rework demonstrated a not healthy version release cadence and project activity because the last version was released a year ago. It has 11 open source maintainers collaborating on the project.
Did you know?
Socket for GitHub automatically highlights issues in each pull request and monitors the health of all your open source dependencies. Discover the contents of your packages and block harmful activity before you install or update your dependencies.
Security News
pnpm 10 blocks lifecycle scripts by default to improve security, addressing supply chain attack risks but sparking debate over compatibility and workflow changes.
Product
Socket now supports uv.lock files to ensure consistent, secure dependency resolution for Python projects and enhance supply chain security.
Research
Security News
Socket researchers have discovered multiple malicious npm packages targeting Solana private keys, abusing Gmail to exfiltrate the data and drain Solana wallets.