2016-11-02 10 views
0

Я отправился на сайт stylelint, github и загрузился локально через npm. Сайт stylelint советует создать свой собственный плагин я должен использовать этот формат:stylelint - Где есть примеры для создания собственного плагина?

var myPluginRule = stylelint.createPlugin(ruleName, function(primaryOption, secondaryOptionObject) { 
    return function(postcssRoot, postcssResult) { 
    var validOptions = stylelint.utils.validateOptions(postcssResult, ruleName, { .. }) 
    if (!validOptions) { return } 
    // ... some logic ... 
    stylelint.utils.report({ .. }) 
    } 
}) 

Когда я делаю «найти» в папке НОЙ stylelint, я не могу найти какие-либо примеры, которые используют этот формат. Может ли кто-нибудь посоветовать действительно хороший учебник по созданию собственного плагина?

благодаря

ответ

0

ОК после того, как играл с ней я буквально нашел способ.

1) предпосылки:

$ npm init 
$ npm install gulp stylelint gulp-style-lint --save-dev 

2) Создайте несколько SCSS файлов ./scss/myfile.scss

тела {фон: красный;}

3) создают. /gulpfile.js

var gulp   = require('gulp'); 
var gulpStylelint = require('gulp-stylelint'); 

gulp.task('stylelint',function(){ 
    return gulp   
    .src('./scss/*.scss') 
    .pipe(
     gulpStylelint({ 
     reporters: [ 
      {formatter: 'string', console: true} 
     ] 
     }) 
    ); 
}) 

4) создать ./stylelintCustom/index. js

var stylelint = require("stylelint"); 
var ruleName = "steves/steve1"; 

var messages = stylelint.utils.ruleMessages(ruleName, { 
    rejected: 'steve rejects this', 
}); 

module.exports = stylelint.createPlugin(ruleName, function(max, options) { 

    return function(root, result) {  
     // to access the variable for the whole of this file scss =   
     console.log(root.source.input); 

     // apply rules now... 
     // run reporter to output 

    } 
}); 

module.exports.ruleName = ruleName; 
module.exports.messages = messages; 

Обязательно укажите имя ruleName: «plugins/plugin». т.е. Steves/steverule1 и т.д.

5) Убедитесь, что для создания stylelintCustom/package.json

{ 
    "name": "stylelint-steves-steve1", 
    "version": "0.0.1", 
    "main": "index.js", 
    "devDependencies": { 
    "stylelint": "~2.6.0" 
    }, 
    "engines": { 
    "node": ">=0.10.0" 
    } 
} 

6) создать: stylelint.rc

{ 
    "plugins": [ 
    "./stylelintCustom/index.js" 
    ], 
    "rules": { 
    "steves/steve1": true 
    } 
} 

7) запустить глотком

$ gulp stylelint 

Выведет scss, чтобы вы могли запускать любые js, regex, которые вам нужны здесь.

0

Для справки о том, как существующие правила работы в stylelint вы можете пойти:

yourproject/node_modules/stylelint/DIST/правила/*

 Смежные вопросы

  • Нет связанных вопросов^_^