diff --git a/.travis.yml b/.travis.yml index 48c9df9..62105ca 100644 --- a/.travis.yml +++ b/.travis.yml @@ -1,7 +1,6 @@ sudo: false language: node_js node_js: - - "7" - "6" - "5" - "4" diff --git a/changelog.md b/CHANGELOG.md similarity index 100% rename from changelog.md rename to CHANGELOG.md diff --git a/README.md b/README.md new file mode 100644 index 0000000..5d55d08 --- /dev/null +++ b/README.md @@ -0,0 +1,113 @@ +# postcss-attribute-selector-prefix plugin for postcss +> Adds a namespace/prefix to attribute selector, needs to escape from the third-party frameworks. + + +[![Build Status](https://img.shields.io/travis/GitScrum/postcss-attribute-selector-prefix.svg?style=flat-square)](https://travis-ci.org/GitScrum/postcss-attribute-selector-prefix)[![npm version](https://img.shields.io/npm/v/postcss-attribute-selector-prefix.svg?style=flat-square)](https://www.npmjs.com/package/postcss-attribute-selector-prefix)[![Dependency Status](https://david-dm.org/gitscrum/postcss-attribute-selector-prefix.svg?style=flat-square)](https://david-dm.org/gitscrum/postcss-attribute-selector-prefix)[![XO code style](https://img.shields.io/badge/code_style-XO-5ed9c7.svg?style=flat-square)](https://github.com/sindresorhus/xo)[![Coveralls status](https://img.shields.io/coveralls/GitScrum/postcss-attribute-selector-prefix.svg?style=flat-square)](https://coveralls.io/r/GitScrum/postcss-attribute-selector-prefix)[![npm downloads](https://img.shields.io/npm/dm/postcss-attribute-selector-prefix.svg?style=flat-square)](https://www.npmjs.com/package/postcss-attribute-selector-prefix)[![npm](https://img.shields.io/npm/dt/postcss-attribute-selector-prefix.svg?style=flat-square)](https://www.npmjs.com/package/postcss-attribute-selector-prefix) + +```css +/* input.css */ +.class, +[type="text"], +[class*="lorem"] { + color:red; +} +``` + +```css +/* Output example */ +.class, +[type="text"], +[class*="test-lorem"] { + color:red; +} +``` + +## Installation + +```console +$ npm install postcss-attribute-selector-prefix +``` + +## Usage + +```js +// dependencies +var fs = require("fs"); +var postcss = require("postcss"); +var attrSelectorPrefix = require("postcss-attribute-selector-prefix"); + +// css to be processed +var css = fs.readFileSync("css/input.css", "utf8"); + +// process css +var output = postcss() + .use(attrSelectorPrefix({prefix: 'test-'})) + .process(css) + .css; + +console.log(output); +``` + +### Options + +#### `prefix` +*add prefix to attribute selector* + +Type: `string` +Default: `` + +#### `filter` +*attribute selector to which we must add the prefix* + +Type: `Array` +Default: `[]` +Example: `['class', 'id']` + +```css +/* input.css */ +.class, +[type="text"], +[class*="lorem"], +[id^="myID"] { + color: red; +} +``` + +```css +/* Output example */ +.class, +[type="text"], +[class*="test-lorem"], +[id^="test-myID"] { + color: red; +} +``` + +#### `ignore` +*ignored attribute selector* + +Type: `Array` +Default: `[]` +Example: `['type', 'alt']` + +```css +/* input.css */ +.class, +[type="text"], +[alt*="ALT"], +[class*="class"] { + color: red; +} +``` + +```css +/* Output example */ +.class, +[type="text"], +[alt*="ALT"], +[class*="test-class"] { + color: red; +} +``` + +See [PostCSS](https://github.com/postcss/postcss) docs for examples for your environment. diff --git a/appveyor.yml b/appveyor.yml deleted file mode 100644 index 740a6f8..0000000 --- a/appveyor.yml +++ /dev/null @@ -1,19 +0,0 @@ -environment: - matrix: - - nodejs_version: "7" - - nodejs_version: "6" - - nodejs_version: "5" - - nodejs_version: "4" - -version: "{build}" -build: off -deploy: off - -install: - - ps: Install-Product node $env:nodejs_version - - npm install - -test_script: - - node --version - - npm --version - - npm test diff --git a/license b/license deleted file mode 100644 index 657c7e7..0000000 --- a/license +++ /dev/null @@ -1,21 +0,0 @@ -The MIT License (MIT) - -Copyright (c) Ivan Demidov - -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. \ No newline at end of file diff --git a/package.json b/package.json index d424319..00f0339 100644 --- a/package.json +++ b/package.json @@ -2,97 +2,46 @@ "name": "postcss-attribute-selector-prefix", "version": "0.0.10", "description": "A attribute selector prefixer for postcss", - "license": "MIT", - "repository": "GitScrum/postcss-attribute-selector-prefix", - "homepage": "GitScrum/postcss-attribute-selector-prefix#readme", - "bugs": "GitScrum/postcss-attribute-selector-prefix/issues", - "author": { - "name": "Ivan Demidov", - "email": "Scrum@list.ru", - "url": "https://twitter.com/Scrum_" - }, "main": "lib/index.js", - "engines": { - "node": ">=4" - }, + "files": [ + "lib/" + ], "scripts": { - "commitmsg": "conventional-changelog-lint -e", - "postpublish": "conventional-changelog -i changelog.md -s -r 0 && git commit -am \"chore(changelog): Update changelog\"", - "patch": "np patch --any-branch", - "minor": "np minor --any-branch", - "major": "np major --any-branch", + "test": "eslint --format=node_modules/eslint-formatter-pretty ./src/*.js ./test/*.js && nyc ava", "clean": "rm -rf lib && mkdir lib", "build": "npm run clean && babel src/ -d lib/", "prepublish": "npm run build", - "lintjs": "eslint ./src/*.js ./test/*.js", - "lintmd": "eslint --ext md --rule indent: [error, 4] .", - "pretest": "clinton && npm run lintjs && npm run lintmd", - "test": "nyc ava", - "update": "updtr && ava-codemods --force", - "testen": "testen -n -- ava" + "update": "updtr && ava-codemods --force" + }, + "repository": { + "type": "git", + "url": "git+https://github.com/GitScrum/postcss-attribute-selector-prefix.git" }, - "files": [ - "lib/" - ], "keywords": [ "postcss", "postcss-plugin", "prefix", "css" ], - "dependencies": { - "postcss": "^5.2.6" - }, - "devDependencies": { - "ava": "*", - "ava-codemods": "^0.3.0", - "babel-cli": "^6.11.4", - "babel-eslint": "^7.1.1", - "babel-plugin-add-module-exports": "^0.2.1", - "babel-preset-babili": "^0.0.9", - "babel-preset-env": "^0.0.9", - "babel-register": "^6.11.6", - "clinton": "^0.8.0", - "conventional-changelog-cli": "^1.2.0", - "conventional-changelog-lint": "^1.1.0", - "coveralls": "^2.11.15", - "eslint": "^3.11.1", - "eslint-config-xo": "^0.17.0", - "eslint-formatter-pretty": "^1.0.0", - "eslint-plugin-ava": "^4.0.0", - "eslint-plugin-babel": "^4.0.0", - "eslint-plugin-markdown": "^1.0.0-beta.3", - "eslint-plugin-require-path-exists": "^1.1.5", - "eslint-plugin-xo": "^1.0.0", - "husky": "^0.11.9", - "np": "^2.10.1", - "nyc": "^10.0.0", - "testen": "^1.8.2", - "updtr": "^0.2.3" + "author": { + "name": "GitScrum", + "email": "scrum@list.ru" }, - "testen": { - "node": [ - "4", - "5", - "6", - "7" - ] + "license": "MIT", + "bugs": { + "url": "https://github.com/GitScrum/postcss-attribute-selector-prefix/issues" }, + "homepage": "https://github.com/GitScrum/postcss-attribute-selector-prefix#readme", "babel": { "presets": [ - [ - "env", - { - "targets": { - "node": "4" - } - } - ], - "babili" + "es2015" ], "plugins": [ "add-module-exports" - ] + ], + "comments": false, + "compact": true, + "minified": true }, "ava": { "require": [ @@ -100,14 +49,12 @@ ] }, "eslintConfig": { - "format": "node_modules/eslint-formatter-pretty", "parser": "babel-eslint", "plugins": [ "ava", "xo", "babel", - "require-path-exists", - "markdown" + "require-path-exists" ], "extends": [ "xo", @@ -115,20 +62,27 @@ "plugin:ava/recommended" ] }, - "clinton": { - "ignores": [ - "test/**", - "tmp/**", - "lib/**", - "*.{html,jpg}" - ], - "rules": { - "pkg-main": [ - "off" - ], - "xo": [ - "off" - ] - } + "dependencies": { + "postcss": "^5.1.1" + }, + "devDependencies": { + "ava": "^0.17.0", + "ava-codemods": "^0.3.0", + "babel-cli": "^6.11.4", + "babel-eslint": "^7.0.0", + "babel-plugin-add-module-exports": "^0.2.1", + "babel-preset-es2015": "^6.9.0", + "babel-preset-min": "^0.1.15", + "babel-register": "^6.11.6", + "coveralls": "^2.11.15", + "eslint": "^3.11.1", + "eslint-config-xo": "^0.17.0", + "eslint-formatter-pretty": "^1.0.0", + "eslint-plugin-ava": "^4.0.0", + "eslint-plugin-babel": "^3.3.0", + "eslint-plugin-require-path-exists": "^1.1.5", + "eslint-plugin-xo": "^1.0.0", + "nyc": "^10.0.0", + "updtr": "^0.2.3" } } diff --git a/readme.md b/readme.md deleted file mode 100644 index 623e433..0000000 --- a/readme.md +++ /dev/null @@ -1,141 +0,0 @@ -# postcss-attribute-selector-prefix -> [PostCSS](https://github.com/postcss/postcss) plugin adds a namespace/prefix to attribute selector. - -[![Travis Build Status](https://img.shields.io/travis/GitScrum/postcss-attribute-selector-prefix.svg?style=flat-square&label=unix)](https://travis-ci.org/GitScrum/postcss-attribute-selector-prefix)[![AppVeyor Build Status](https://img.shields.io/appveyor/ci/GitScrum/postcss-attribute-selector-prefix.svg?style=flat-square&label=windows)](https://ci.appveyor.com/project/GitScrum/postcss-attribute-selector-prefix)[![testen badge](https://img.shields.io/badge/testen-passing-brightgreen.svg?style=flat-square)][testen repo][![node](https://img.shields.io/node/v/postcss-attribute-selector-prefix.svg?maxAge=2592000&style=flat-square)]()[![npm version](https://img.shields.io/npm/v/postcss-attribute-selector-prefix.svg?style=flat-square)](https://www.npmjs.com/package/postcss-attribute-selector-prefix)[![Dependency Status](https://david-dm.org/gitscrum/postcss-attribute-selector-prefix.svg?style=flat-square)](https://david-dm.org/gitscrum/postcss-attribute-selector-prefix)[![XO code style](https://img.shields.io/badge/code_style-XO-5ed9c7.svg?style=flat-square)](https://github.com/sindresorhus/xo)[![Coveralls status](https://img.shields.io/coveralls/GitScrum/postcss-attribute-selector-prefix.svg?style=flat-square)](https://coveralls.io/r/GitScrum/postcss-attribute-selector-prefix) - -[![npm downloads](https://img.shields.io/npm/dm/postcss-attribute-selector-prefix.svg?style=flat-square)](https://www.npmjs.com/package/postcss-attribute-selector-prefix)[![npm](https://img.shields.io/npm/dt/postcss-attribute-selector-prefix.svg?style=flat-square)](https://www.npmjs.com/package/postcss-attribute-selector-prefix) - -## Why ? -Needs to escape from the third-party frameworks. - -## Install - -```bash -$ npm install postcss-at-rules-variables -``` - -> **Note:** This project is compatible with node v4+ - -## Usage - -```js -// dependencies -var fs = require('fs'); -var postcss = require('postcss'); -var attrSelectorPrefix = require('postcss-attribute-selector-prefix'); - -// css to be processed -var css = fs.readFileSync('css/input.css', 'utf8'); - -// process css -var output = postcss() - .use(attrSelectorPrefix({prefix: 'test-'})) - .process(css) - .css; - -console.log(output); -``` - -## Example - -```css -/* input.css */ -.class, -[type="text"], -[class*="lorem"] { -color:red; -} -``` - -```css -/* Output example */ -.class, -[type="text"], -[class*="test-lorem"] { - color:red; -} -``` - -## Options - -#### `prefix` - -Type: `string` -Default: `` -Description: *add prefix to attribute selector* - -#### `filter` - -Type: `Array` -Default: `[]` -Description: *attribute selector to which we must add the prefix* -Example: `['class', 'id']` - -```css -/* input.css */ -.class, -[type="text"], -[class*="lorem"], -[id^="myID"] { - color: red; -} -``` - -```css -/* Output example */ -.class, -[type="text"], -[class*="test-lorem"], -[id^="test-myID"] { - color: red; -} -``` - -#### `ignore` - - -Type: `Array` -Default: `[]` -Description: *ignored attribute selector* -Example: `['type', 'alt']` - -```css -/* input.css */ -.class, -[type="text"], -[alt*="ALT"], -[class*="class"] { - color: red; -} -``` - -```css -/* Output example */ -.class, -[type="text"], -[alt*="ALT"], -[class*="test-class"] { - color: red; -} -``` - -## LICENSE - -> MIT License (MIT) - ->Copyright (c) Ivan Demidov - -> 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, - -[testen repo]: https://github.com/egoist/testen diff --git a/src/index.js b/src/index.js index 4415741..a805a7f 100644 --- a/src/index.js +++ b/src/index.js @@ -5,7 +5,7 @@ const filter = (filter, attributeSelector) => new RegExp(filter.map(attribut => export default postcss.plugin('postcss-attribute-selector-prefix', options => { return nodes => { return nodes.walkRules(rule => { - rule.selector = rule.selector.replace(/\[.*?]/g, match => { + rule.selector = rule.selector.replace(/\[.*?\]/g, match => { if (options.prefix === undefined) { return match; } @@ -18,7 +18,7 @@ export default postcss.plugin('postcss-attribute-selector-prefix', options => { return match; } - return match.replace(/(\[.*?="?)(.*?)("?])/, (match, before, required, after) => { + return match.replace(/(\[.*?="?)(.*?)("?\])/, (match, before, required, after) => { return `${before}${options.prefix}${required}${after}`; }); });