postcss-bem-linter
Advanced tools
postcss-bem-linter - npm Package Compare versions
Comparing version 0.3.0 to 0.4.0
| === HEAD | ||
| === 0.4.0 (June 23, 2015) | ||
| * Support `/* postcss-bem-linter: ignore */` comments. | ||
| === 0.3.0 (May 23, 2015) | ||
@@ -4,0 +8,0 @@ |
@@ -44,8 +44,5 @@ 'use strict'; | ||
| var WORD = '[a-zA-Z0-9]+(?:-[a-zA-Z0-9]+)*'; | ||
| var element = '(?:__' + WORD + ')'; | ||
| var modifier = '(?:(?:_' + WORD + '){1,2})'; | ||
| return new RegExp( | ||
| '^\\.' + block + modifier + '?$' + | ||
| '|^\\.' + block + element + modifier + '?$' | ||
| ); | ||
| var element = '(?:__' + WORD + ')?'; | ||
| var modifier = '(?:_' + WORD + '){0,2}'; | ||
| return new RegExp('^\\.' + block + element + modifier + '$'); | ||
| } |
@@ -8,2 +8,3 @@ 'use strict'; | ||
| var isValid = require('./is-valid-selector'); | ||
| var IGNORE_COMMENT = 'postcss-bem-linter: ignore'; | ||
@@ -28,5 +29,8 @@ /** | ||
| styles.eachRule(function (rule) { | ||
| if (rule.parent && rule.parent.name === 'keyframes') { | ||
| return; | ||
| } | ||
| if (rule.parent && rule.parent.name === 'keyframes') { return; } | ||
| var prev = rule.prev(); | ||
| if (prev && prev.type === 'comment' | ||
| && prev.text === IGNORE_COMMENT) { return; } | ||
| var selectors = rule.selectors; | ||
@@ -33,0 +37,0 @@ |
| { | ||
| "name": "postcss-bem-linter", | ||
| "version": "0.3.0", | ||
| "version": "0.4.0", | ||
| "description": "A BEM linter for postcss", | ||
@@ -13,4 +13,4 @@ "files": [ | ||
| "devDependencies": { | ||
| "eslint": "0.20.0", | ||
| "mocha": "2.2.3" | ||
| "eslint": "0.23.0", | ||
| "mocha": "2.2.5" | ||
| }, | ||
@@ -17,0 +17,0 @@ "scripts": { |
| # postcss-bem-linter | ||
| [](http://travis-ci.org/necolas/postcss-bem-linter) | ||
| [](https://travis-ci.org/postcss/postcss-bem-linter) | ||
@@ -15,4 +15,4 @@ A [PostCSS](https://github.com/postcss/postcss) plugin to lint *BEM-style* CSS. | ||
| With this plugin, you can check the validity of stylesheets against a set of BEM-style conventions. | ||
| You can use preset patterns (SUIT and BEM, currently) or insert your own. The plugin will throw an | ||
| error if it finds CSS that does not follow the specified conventions. | ||
| You can use preset patterns (SUIT and BEM, currently) or insert your own. The plugin will register | ||
| warnings if it finds CSS that does not follow the specified conventions. | ||
@@ -25,3 +25,3 @@ ## Installation | ||
| This plugin logs warnings via PostCSS. Therefore, you'll want to use it with a PostCSS runner that prints warnings (e.g. [`gulp-postcss`](https://github.com/postcss/gulp-postcss)) or another PostCSS plugin that prints warnings (e.g. [`postcss-log-warnings`](https://github.com/davidtheclark/postcss-log-warnings)). | ||
| This plugin registers warnings via PostCSS. Therefore, you'll want to use it with a PostCSS runner that prints warnings (e.g. [`gulp-postcss`](https://github.com/postcss/gulp-postcss)) or another PostCSS plugin that prints warnings (e.g. [`postcss-log-warnings`](https://github.com/davidtheclark/postcss-log-warnings)). | ||
@@ -32,3 +32,3 @@ ## Conformance tests | ||
| * Only allow selectors sequences that match the defined convention. | ||
| * Only allow selector sequences that match the defined convention. | ||
| * Only allow custom-property names that *begin* with the defined `ComponentName`. | ||
@@ -46,3 +46,3 @@ * The `:root` selector can only contain custom-properties. | ||
| ``` | ||
| postcss().use(bemLinter([pattern, options])); | ||
| bemLinter([pattern[, options]]) | ||
| ``` | ||
@@ -61,3 +61,3 @@ | ||
| will be ignored*. Instead of `.Component:first-child.is-open` you should use | ||
| `.Component.is-open:first-child`. The former will cause an error. | ||
| `.Component.is-open:first-child`. The former will trigger a warning. | ||
@@ -186,5 +186,25 @@ #### Preset Patterns | ||
| ### Ignoring specific selectors | ||
| If you need to ignore a specific selector but do not want to ignore the entire stylesheet, | ||
| you can do so by preceding the selector with this comment: `/* postcss-bem-linter: ignore */`. | ||
| ```css | ||
| /** @define MyComponent */ | ||
| .MyComponent { | ||
| display: flex; | ||
| } | ||
| /* postcss-bem-linter: ignore */ | ||
| .no-flexbox .Component { | ||
| display: block; | ||
| } | ||
| ``` | ||
| This will cause the linter to ignore *only* the very next selector. | ||
| ### Testing CSS files | ||
| Pass your individual CSS files through the plugin. It will log warnings errors for | ||
| Pass your individual CSS files through the plugin. It will register warnings for | ||
| conformance failures, which you can print to the console using | ||
@@ -204,3 +224,4 @@ [`postcss-log-warnings`](https://github.com/davidtheclark/postcss-log-warnings) or relying | ||
| .use(logWarnings()) | ||
| .process(css); | ||
| .process(css) | ||
| .then(function(result) { .. }); | ||
| }); | ||
@@ -207,0 +228,0 @@ ``` |
New alerts
License Policy Violation
LicenseThis package is not allowed per your license policy. Review the package's license to ensure compliance.
Found 1 instance in 1 package
New author
Supply chain riskA new npm collaborator published a version of the package for the first time. New collaborators are usually benign additions to a project, but do indicate a change to the security surface area of a package.
Found 1 instance in 1 package
Fixed alerts
License Policy Violation
LicenseThis package is not allowed per your license policy. Review the package's license to ensure compliance.
Found 1 instance in 1 package
Major refactor
Supply chain riskPackage has recently undergone a major refactor. It may be unstable or indicate significant internal changes. Use caution when updating to versions that include significant changes.
Found 1 instance in 1 package
Improved metrics
- Total package byte prevSize
- increased by3.27%
20766
- Number of lines in readme file
- increased by9.5%
242
Worsened metrics
- Lines of code
- decreased by-0.28%
350