feat: add include option

docs: update README.md
feat: add include option test cases
feat: add include-and-exclude test cases & regex test cases

README.md

@@ -94,7 +94,8 @@ Default Options:
   minPixelValue: 1,
   mediaQuery: false,
   replace: true,
-  exclude: [],
+  exclude: undefined,
+  include: undefined,
   landscape: false,
   landscapeUnit: 'vw',
   landscapeWidth: 568
@@ -122,10 +123,15 @@ Default Options:
 - `exclude` (Array or Regexp) Ignore some files like 'node_modules'
     - If value is regexp, will ignore the matches files.
     - If value is array, the elements of the array are regexp.
+- `include` (Array or Regexp) If `include` is set, only matching files will be converted, for example, only files under 'src/mobile'
+    - If the value is regexp, the matching file will be included, otherwise it will be excluded.
+    - If value is array, the elements of the array are regexp.
 - `landscape` (Boolean) Adds `@media (orientation: landscape)` with values converted via `landscapeWidth`.
 - `landscapeUnit` (String) Expected unit for `landscape` option
 - `landscapeWidth` (Number) Viewport width for landscape orientation.
 
+> `exclude` and` include` can be set together, and the intersection of the two rules will be taken.
+
 #### Use with gulp-postcss
 
 add to your `gulpfile.js`:

README_CN.md

@@ -94,7 +94,8 @@ $ yarn add -D postcss-px-to-viewport
   minPixelValue: 1,
   mediaQuery: false,
   replace: true,
-  exclude: [],
+  exclude: undefined,
+  include: undefined,
   landscape: false,
   landscapeUnit: 'vw',
   landscapeWidth: 568
@@ -122,10 +123,15 @@ $ yarn add -D postcss-px-to-viewport
 - `exclude` (Array or Regexp) 忽略某些文件夹下的文件或特定文件，例如 'node_modules' 下的文件
     - 如果值是一个正则表达式，那么匹配这个正则的文件会被忽略
     - 如果传入的值是一个数组，那么数组里的值必须为正则
+- `include` (Array or Regexp) 如果设置了`include`，那将只有匹配到的文件才会被转换，例如只转换 'src/mobile' 下的文件
+    - 如果值是一个正则表达式，将包含匹配的文件，否则将排除该文件
+    - 如果传入的值是一个数组，那么数组里的值必须为正则
 - `landscape` (Boolean) 是否添加根据 `landscapeWidth` 生成的媒体查询条件 `@media (orientation: landscape)`
 - `landscapeUnit` (String) 横屏时使用的单位
 - `landscapeWidth` (Number) 横屏时使用的视口宽度
 
+> `exclude`和`include`是可以一起设置的，将取两者规则的交集。
+
 #### 直接在gulp中使用，添加gulp-postcss
 
 在 `gulpfile.js` 添加如下配置:

index.js

@@ -35,6 +35,20 @@ module.exports = postcss.plugin('postcss-px-to-viewport', function (options) {
       // Add exclude option to ignore some files like 'node_modules'
       var file = rule.source && rule.source.input.file;
 
+      if (opts.include && file) {
+        if (Object.prototype.toString.call(opts.include) === '[object RegExp]') {
+          if (!isInclude(opts.include, file)) return;
+        } else if (Object.prototype.toString.call(opts.include) === '[object Array]') {
+          var flag = false;
+          for (let i = 0; i < opts.include.length; i++) {
+            if (isInclude(opts.include[i], file)) flag = true;
+          }
+          if (!flag) return;
+        } else {
+          throw new Error('options.include should be RegExp or Array.');
+        }
+      }
+
       if (opts.exclude && file) {
         if (Object.prototype.toString.call(opts.exclude) === '[object RegExp]') {
           if (isExclude(opts.exclude, file)) return;
@@ -142,6 +156,13 @@ function isExclude(reg, file) {
   return file.match(reg) !== null;
 }
 
+function isInclude(reg, file) {
+  if (Object.prototype.toString.call(reg) !== '[object RegExp]') {
+    throw new Error('options.include should be RegExp.');
+  }
+  return file.match(reg) !== null;
+}
+
 function declarationExists(decls, prop, value) {
   return decls.some(function (decl) {
       return (decl.prop === prop && decl.value === value);

spec/px-to-viewport.spec.js

@@ -285,7 +285,7 @@ describe('exclude', function () {
   var covered = '.rule { border: 1px solid #000; font-size: 5vw; margin: 1px 3.125vw; }';
   it('when using regex at the time, the style should not be overwritten.', function () {
     var options = {
-      exclude: /node_modules/
+      exclude: /\/node_modules\//
     };
     var processed = postcss(pxToViewport(options)).process(rules, {
       from: '/node_modules/main.css'
@@ -296,7 +296,7 @@ describe('exclude', function () {
 
   it('when using regex at the time, the style should be overwritten.', function () {
     var options = {
-      exclude: /node_modules/
+      exclude: /\/node_modules\//
     };
     var processed = postcss(pxToViewport(options)).process(rules, {
       from: '/example/main.css'
@@ -307,7 +307,7 @@ describe('exclude', function () {
 
   it('when using array at the time, the style should not be overwritten.', function () {
     var options = {
-      exclude: [/node_modules/, /exclude/]
+      exclude: [/\/node_modules\//, /\/exclude\//]
     };
     var processed = postcss(pxToViewport(options)).process(rules, {
       from: '/exclude/main.css'
@@ -318,7 +318,7 @@ describe('exclude', function () {
 
   it('when using array at the time, the style should be overwritten.', function () {
     var options = {
-      exclude: [/node_modules/, /exclude/]
+      exclude: [/\/node_modules\//, /\/exclude\//]
     };
     var processed = postcss(pxToViewport(options)).process(rules, {
       from: '/example/main.css'
@@ -328,6 +328,156 @@ describe('exclude', function () {
   });
 });
 
+describe('include', function () {
+  var rules = '.rule { border: 1px solid #000; font-size: 16px; margin: 1px 10px; }';
+  var covered = '.rule { border: 1px solid #000; font-size: 5vw; margin: 1px 3.125vw; }';
+  it('when using regex at the time, the style should not be overwritten.', function () {
+    var options = {
+      include: /\/mobile\//
+    };
+    var processed = postcss(pxToViewport(options)).process(rules, {
+      from: '/pc/main.css'
+    }).css;
+
+    expect(processed).toBe(rules);
+  });
+
+  it('when using regex at the time, the style should be overwritten.', function () {
+    var options = {
+      include: /\/mobile\//
+    };
+    var processed = postcss(pxToViewport(options)).process(rules, {
+      from: '/mobile/main.css'
+    }).css;
+
+    expect(processed).toBe(covered);
+  });
+
+  it('when using array at the time, the style should not be overwritten.', function () {
+    var options = {
+      include: [/\/flexible\//, /\/mobile\//]
+    };
+    var processed = postcss(pxToViewport(options)).process(rules, {
+      from: '/pc/main.css'
+    }).css;
+
+    expect(processed).toBe(rules);
+  });
+
+  it('when using array at the time, the style should be overwritten.', function () {
+    var options = {
+      include: [/\/flexible\//, /\/mobile\//]
+    };
+    var processed = postcss(pxToViewport(options)).process(rules, {
+      from: '/flexible/main.css'
+    }).css;
+
+    expect(processed).toBe(covered);
+  });
+});
+
+describe('include-and-exclude', function () {
+  var rules = '.rule { border: 1px solid #000; font-size: 16px; margin: 1px 10px; }';
+  var covered = '.rule { border: 1px solid #000; font-size: 5vw; margin: 1px 3.125vw; }';
+
+  it('when using regex at the time, the style should not be overwritten.', function () {
+    var options = {
+      include: /\/mobile\//,
+      exclude: /\/not-transform\//
+    };
+    var processed = postcss(pxToViewport(options)).process(rules, {
+      from: '/mobile/not-transform/main.css'
+    }).css;
+
+    expect(processed).toBe(rules);
+  });
+
+  it('when using regex at the time, the style should be overwritten.', function () {
+    var options = {
+      include: /\/mobile\//,
+      exclude: /\/not-transform\//
+    };
+    var processed = postcss(pxToViewport(options)).process(rules, {
+      from: '/mobile/style/main.css'
+    }).css;
+
+    expect(processed).toBe(covered);
+  });
+
+  it('when using array at the time, the style should not be overwritten.', function () {
+    var options = {
+      include: [/\/flexible\//, /\/mobile\//],
+      exclude: [/\/not-transform\//, /pc/]
+    };
+    var processed = postcss(pxToViewport(options)).process(rules, {
+      from: '/flexible/not-transform/main.css'
+    }).css;
+
+    expect(processed).toBe(rules);
+  });
+
+  it('when using regex at the time, the style should be overwritten.', function () {
+    var options = {
+      include: [/\/flexible\//, /\/mobile\//],
+      exclude: [/\/not-transform\//, /pc/]
+    };
+    var processed = postcss(pxToViewport(options)).process(rules, {
+      from: '/mobile/style/main.css'
+    }).css;
+
+    expect(processed).toBe(covered);
+  });
+});
+
+describe('regex', function () {
+  var rules = '.rule { border: 1px solid #000; font-size: 16px; margin: 1px 10px; }';
+  var covered = '.rule { border: 1px solid #000; font-size: 5vw; margin: 1px 3.125vw; }';
+
+  it('when using regex at the time, the style should not be overwritten.', function () {
+    var options = {
+      exclude: /pc/
+    };
+    var processed = postcss(pxToViewport(options)).process(rules, {
+      from: '/pc-project/main.css'
+    }).css;
+
+    expect(processed).toBe(rules);
+  });
+
+  it('when using regex at the time, the style should be overwritten.', function () {
+    var options = {
+      exclude: /\/pc\//
+    };
+    var processed = postcss(pxToViewport(options)).process(rules, {
+      from: '/pc-project/main.css'
+    }).css;
+
+    expect(processed).toBe(covered);
+  });
+
+  it('when using regex at the time, the style should not be overwritten.', function () {
+    var options = {
+      include: /\/pc\//
+    };
+    var processed = postcss(pxToViewport(options)).process(rules, {
+      from: '/pc-project/main.css'
+    }).css;
+
+    expect(processed).toBe(rules);
+  });
+
+  it('when using regex at the time, the style should be overwritten.', function () {
+    var options = {
+      include: /pc/
+    };
+    var processed = postcss(pxToViewport(options)).process(rules, {
+      from: '/pc-project/main.css'
+    }).css;
+
+    expect(processed).toBe(covered);
+  });
+});
+
 describe('replace', function () {
   it('should leave fallback pixel unit with root em value', function () {
     var options = {