split built-in postcss plugins

Author: yyx990803

lib/style-compiler/index.js

@@ -1,42 +1,9 @@
 var postcss = require('postcss')
 var loaderUtils = require('loader-utils')
-var selectorParser = require('postcss-selector-parser')
 var loadPostcssConfig = require('./load-postcss-config')
 
-var addId = postcss.plugin('add-id', function (opts) {
-  return function (root) {
-    root.each(function rewriteSelector (node) {
-      if (!node.selector) {
-        // handle media queries
-        if (node.type === 'atrule' && node.name === 'media') {
-          node.each(rewriteSelector)
-        }
-        return
-      }
-      node.selector = selectorParser(function (selectors) {
-        selectors.each(function (selector) {
-          var node = null
-          selector.each(function (n) {
-            if (n.type !== 'pseudo') node = n
-          })
-          selector.insertAfter(node, selectorParser.attribute({
-            attribute: opts.id
-          }))
-        })
-      }).process(node.selector).result
-    })
-  }
-})
-
-var trim = postcss.plugin('trim', function (opts) {
-  return function (css) {
-    css.walk(function (node) {
-      if (node.type === 'rule' || node.type === 'atrule') {
-        node.raws.before = node.raws.after = '\n'
-      }
-    })
-  }
-})
+var trim = require('./plugins/trim')
+var scopeId = require('./plugins/scope-id')
 
 module.exports = function (css, map) {
   this.cacheable()
@@ -69,7 +36,7 @@ module.exports = function (css, map) {
 
     // add plugin for vue-loader scoped css rewrite
     if (query.scoped) {
-      plugins.push(addId({ id: query.id }))
+      plugins.push(scopeId({ id: query.id }))
     }
 
     // source map

lib/style-compiler/plugins/scope-id.js

@@ -0,0 +1,27 @@
+var postcss = require('postcss')
+var selectorParser = require('postcss-selector-parser')
+
+module.exports = postcss.plugin('add-id', function (opts) {
+  return function (root) {
+    root.each(function rewriteSelector (node) {
+      if (!node.selector) {
+        // handle media queries
+        if (node.type === 'atrule' && node.name === 'media') {
+          node.each(rewriteSelector)
+        }
+        return
+      }
+      node.selector = selectorParser(function (selectors) {
+        selectors.each(function (selector) {
+          var node = null
+          selector.each(function (n) {
+            if (n.type !== 'pseudo') node = n
+          })
+          selector.insertAfter(node, selectorParser.attribute({
+            attribute: opts.id
+          }))
+        })
+      }).process(node.selector).result
+    })
+  }
+})

lib/style-compiler/plugins/trim.js

@@ -0,0 +1,11 @@
+var postcss = require('postcss')
+
+module.exports = postcss.plugin('trim', function (opts) {
+  return function (css) {
+    css.walk(function (node) {
+      if (node.type === 'rule' || node.type === 'atrule') {
+        node.raws.before = node.raws.after = '\n'
+      }
+    })
+  }
+})