refactor transform to require compiler module

Author: yyx990803

lib/template-compiler.js

@@ -1,67 +1,26 @@
-var compiler = require('vue-template-compiler')
-var transpile = require('vue-template-es2015-compiler')
+var normalize = require('./normalize')
 var loaderUtils = require('loader-utils')
+var compiler = require('vue-template-compiler')
 var beautify = require('js-beautify').js_beautify
-var normalize = require('./normalize')
+var transpile = require('vue-template-es2015-compiler')
 var hotReloadAPIPath = normalize.dep('vue-hot-reload-api')
+var transformRequire = require('./template-transform-require')
 
-// vue compiler module for using transforming `<tag>:<attribute>` to `require`
-var defaultTransformToRequire = {
-  img: 'src',
-  image: 'xlink:href'
-}
-var transformToRequire = defaultTransformToRequire
-var defaultCompileOptions = {
-  modules: [{
-    postTransformNode (el) {
-      for (var tag in transformToRequire) {
-        if (el.tag === tag && el.attrs) {
-          var attributes = transformToRequire[tag]
-          if (typeof attributes === 'string') {
-            el.attrs.some(attr => rewrite(attr, attributes))
-          } else if (Array.isArray(attributes)) {
-            attributes.forEach(item => el.attrs.some(attr => rewrite(attr, item)))
-          }
-        }
-      }
-    }
-  }]
-}
-
-function rewrite (attr, name) {
-  if (attr.name === name) {
-    var value = attr.value
-    var isStatic = value.charAt(0) === '"' && value.charAt(value.length - 1) === '"'
-    if (!isStatic) {
-      return
-    }
-    var firstChar = value.charAt(1)
-    if (firstChar === '.' || firstChar === '~') {
-      if (firstChar === '~') {
-        value = '"' + value.slice(2)
-      }
-      attr.value = `require(${value})`
-    }
-    return true
-  }
-}
+var defaultCompileModules = [transformRequire]
 
 module.exports = function (html) {
   this.cacheable()
   var isServer = this.target === 'node'
   var isProduction = this.minimize || process.env.NODE_ENV === 'production'
   var options = loaderUtils.getOptions(this) || {}
-  if (options.transformToRequire) {
-    transformToRequire = Object.assign(
-      {},
-      defaultTransformToRequire,
-      options.transformToRequire
-    )
-  }
 
-  var compiled = compiler.compile(html, Object.assign({
-    preserveWhitespace: options.preserveWhitespace
-  }, defaultCompileOptions))
+  // set user transformToRequire options on module
+  transformRequire._userOptions = options.transformToRequire
+
+  var compiled = compiler.compile(html, {
+    preserveWhitespace: options.preserveWhitespace,
+    modules: defaultCompileModules.concat(options.modules || [])
+  })
 
   // tips
   if (compiled.tips && compiled.tips.length) {

lib/template-transform-require.js

@@ -0,0 +1,43 @@
+// vue compiler module for using transforming `<tag>:<attribute>` to `require`
+var defaultOptions = {
+  img: 'src',
+  image: 'xlink:href'
+}
+
+module.exports = {
+  _userOptions: null,
+  postTransformNode: el => {
+    var userOptions = module.exports._userOptions
+    var options = userOptions
+      ? Object.assign({}, defaultOptions, userOptions)
+      : defaultOptions
+    for (var tag in options) {
+      if (el.tag === tag && el.attrs) {
+        var attributes = options[tag]
+        if (typeof attributes === 'string') {
+          el.attrs.some(attr => rewrite(attr, attributes))
+        } else if (Array.isArray(attributes)) {
+          attributes.forEach(item => el.attrs.some(attr => rewrite(attr, item)))
+        }
+      }
+    }
+  }
+}
+
+function rewrite (attr, name) {
+  if (attr.name === name) {
+    var value = attr.value
+    var isStatic = value.charAt(0) === '"' && value.charAt(value.length - 1) === '"'
+    if (!isStatic) {
+      return
+    }
+    var firstChar = value.charAt(1)
+    if (firstChar === '.' || firstChar === '~') {
+      if (firstChar === '~') {
+        value = '"' + value.slice(2)
+      }
+      attr.value = `require(${value})`
+    }
+    return true
+  }
+}