motion
Version:
motion - moving development forward
85 lines (84 loc) • 5.14 kB
JSON
{
"_args": [
[
"postcss-modules-scope@https://registry.npmjs.org/postcss-modules-scope/-/postcss-modules-scope-1.0.0.tgz",
"/Users/nw/flint/packages/flint"
]
],
"_from": "postcss-modules-scope@>=1.0.0 <2.0.0",
"_id": "postcss-modules-scope@1.0.0",
"_inCache": true,
"_location": "/postcss-modules-scope",
"_phantomChildren": {},
"_requested": {
"name": "postcss-modules-scope",
"raw": "postcss-modules-scope@https://registry.npmjs.org/postcss-modules-scope/-/postcss-modules-scope-1.0.0.tgz",
"rawSpec": "https://registry.npmjs.org/postcss-modules-scope/-/postcss-modules-scope-1.0.0.tgz",
"scope": null,
"spec": "https://registry.npmjs.org/postcss-modules-scope/-/postcss-modules-scope-1.0.0.tgz",
"type": "remote"
},
"_requiredBy": [
"/css-loader"
],
"_resolved": "https://registry.npmjs.org/postcss-modules-scope/-/postcss-modules-scope-1.0.0.tgz",
"_shasum": "d17baef9b34512d06a316492cb3ea7cce9072255",
"_shrinkwrap": null,
"_spec": "postcss-modules-scope@https://registry.npmjs.org/postcss-modules-scope/-/postcss-modules-scope-1.0.0.tgz",
"_where": "/Users/nw/flint/packages/flint",
"author": {
"name": "Glen Maddern"
},
"bugs": {
"url": "https://github.com/geelen/postcss-modules-scope/issues"
},
"dependencies": {
"css-selector-tokenizer": "^0.5.0",
"postcss": "^5.0.4"
},
"description": "A CSS Modules transform to extract export statements from local-scope classes",
"devDependencies": {
"babel": "^5.4.7",
"babel-eslint": "^4.1.3",
"babel-istanbul": "^0.3.20",
"babelify": "^6.1.2",
"chokidar-cli": "^1.0.1",
"codecov.io": "^0.1.2",
"coveralls": "^2.11.2",
"css-selector-parser": "^1.0.4",
"eslint": "^1.5.0",
"mocha": "^2.2.5"
},
"files": [
"lib"
],
"homepage": "https://github.com/geelen/postcss-modules-scope",
"keywords": [
"css-modules",
"plugin",
"postcss"
],
"license": "ISC",
"main": "lib/index.js",
"name": "postcss-modules-scope",
"optionalDependencies": {},
"readme": "# CSS Modules: Scope Locals & Extend\n\n[](https://travis-ci.org/css-modules/postcss-modules-scope)\n\nTransforms:\n\n```css\n:local(.continueButton) {\n color: green;\n}\n```\n\ninto:\n\n```css\n:export {\n continueButton: __buttons_continueButton_djd347adcxz9;\n}\n.__buttons_continueButton_djd347adcxz9 {\n color: green;\n}\n```\n\nso it doesn't pollute CSS global scope and can be simply used in JS like so:\n\n```js\nimport styles from './buttons.css'\nelem.innerHTML = `<button class=\"${styles.continueButton}\">Continue</button>`\n```\n\n## Composition\n\nSince we're exporting class names, there's no reason to export only one. This can give us some really useful reuse of styles:\n\n```css\n.globalButtonStyle {\n background: white;\n border: 1px solid;\n border-radius: 0.25rem;\n}\n.globalButtonStyle:hover {\n box-shadow: 0 0 4px -2px;\n}\n:local(.continueButton) {\n compose-with: globalButtonStyle;\n color: green;\n}\n```\n\nbecomes:\n\n```\n.globalButtonStyle {\n background: white;\n border: 1px solid;\n border-radius: 0.25rem;\n}\n.globalButtonStyle:hover {\n box-shadow: 0 0 4px -2px;\n}\n:local(.continueButton) {\n compose-with: globalButtonStyle;\n color: green;\n}\n```\n\n**Note:** you can also use `composes` as a shorthand for `compose-with`\n\n## Local-by-default & reuse across files\n\nYou're looking for [CSS Modules](https://github.com/css-modules/css-modules). It uses this plugin as well as a few others, and it's amazing.\n\n## Building\n\n```\nnpm install\nnpm test\n```\n\n[](https://travis-ci.org/css-modules/postcss-modules-scope)\n\n* Lines: [](https://coveralls.io/r/css-modules/postcss-modules-scope?branch=master)\n* Statements: [](http://codecov.io/github/css-modules/postcss-modules-scope?branch=master)\n\n## Development\n\n- `npm autotest` will watch `src` and `test` for changes and run the tests, and transpile the ES6 to ES5 on success\n\n## License\n\nISC\n\n## With thanks\n\n- Mark Dalgleish\n- Tobias Koppers\n- Guy Bedford\n\n---\nGlen Maddern, 2015.\n",
"readmeFilename": "README.md",
"repository": {
"type": "git",
"url": "git+https://github.com/geelen/postcss-modules-scope.git"
},
"scripts": {
"autotest": "chokidar src test -c 'npm test'",
"build": "babel --out-dir lib src",
"cover": "babel-istanbul cover node_modules/.bin/_mocha",
"lint": "eslint src",
"posttest": "npm run lint && npm run build",
"precover": "npm run lint && npm run build",
"prepublish": "npm run build",
"test": "mocha --compilers js:babel/register",
"travis": "npm run cover -- --report lcovonly",
"watch": "chokidar src -c 'npm run build'"
},
"version": "1.0.0"
}