fix: useVue logic

Author: Baitu Huang

lib/plugin.js

@@ -45,8 +45,32 @@ module.exports = class VueFlagsWebpackPlugin {
       }
     }
   }
-  patchRules (rules, useVue) {
+  useVue (plugins) {
+    let vueLoader
+    let VueLoaderPlugin
+    try {
+      vueLoader = require('vue-loader')
+      VueLoaderPlugin = require('vue-loader/lib/plugin')
+    } catch (err) {
+      if (vueLoader && !VueLoaderPlugin) {
+        throw genError('vue-loader < 15 is not supported, ' + err.message)
+      }
+      return false
+    }
+    const useVue = !!plugins.find(p => p.constructor === VueLoaderPlugin)
     if (useVue) {
+      require.resolve('vue-template-compiler')
+      const vueCompilerVersion = require('vue-template-compiler/package.json').version
+      const semver = require('semver')
+      if (semver.lt(vueCompilerVersion, MIN_VERSION)) {
+        throw genError(`vue-template-compiler < ${MIN_VERSION} is not supported`)
+      }
+    }
+    return useVue
+  }
+  patchRules (webpackConfig) {
+    const { module: { rules }, plugins } = webpackConfig
+    if (this.useVue(plugins)) {
       let vueUses
       let index
       assert.doesNotThrow(
@@ -92,36 +116,17 @@ module.exports = class VueFlagsWebpackPlugin {
     if (!compiler.hooks) {
       throw genError('webpack < 4 is not supported')
     }
-    const { plugins, mode, context, module: moduleOption, watchOptions } = compiler.options
+    const { plugins, mode, context, watchOptions } = compiler.options
     if (plugins.filter(p => p.constructor === VueFlagsWebpackPlugin).length > 1) {
-      throw genError('This plugin can not be used multiple times')
+      throw genError('Sorry, this plugin can not be used multiple times')
     }
     this.pluginOptions = setOptions(this.options, context, watchOptions, mode === 'development')
     postcssFlagsPlugin.pluginOptions = this.pluginOptions
 
     // patch webpack rules
-    let vueLoaderPath
-    let VueLoaderPlugin
-    let vueTemplateCompilerVersion
-    try {
-      vueLoaderPath = require.resolve('vue-loader')
-      VueLoaderPlugin = require('vue-loader/lib/plugin')
-      vueTemplateCompilerVersion = require('vue-template-compiler/package.json').version
-    } catch (err) {
-      if (vueLoaderPath && !VueLoaderPlugin) {
-        throw genError('vue-loader < 15 is not supported, ' + err.message)
-      }
-    }
-    const vuePlugin = VueLoaderPlugin && plugins.find(p => p.constructor === VueLoaderPlugin)
-    if (vuePlugin) {
-      const semver = require('semver')
-      if (semver.lt(vueTemplateCompilerVersion, MIN_VERSION)) {
-        throw genError(`vue-template-compiler < ${MIN_VERSION} is not supported`)
-      }
-    }
     compiler.hooks.afterEnvironment.tap(PLUGIN_NAME, () => {
       // ensure patching rules after `VueLoaderPlugin`
-      this.patchRules(moduleOption.rules, !!vuePlugin)
+      this.patchRules(compiler.options)
     })
 
     // apply flag variable plugin

lib/utils.js

@@ -7,8 +7,6 @@ class VueFlagsWebpackPluginError extends Error {
   }
 }
 
-exports.VueFlagsWebpackPluginError = VueFlagsWebpackPluginError
-
 exports.genError = function genError (msg) {
   return new VueFlagsWebpackPluginError(msg)
 }

test/webpack-build.test.js

@@ -5,7 +5,7 @@ const clearModule = require('clear-module')
 
 const rfp = Module._resolveFilename
 const mmap = [
-  'webpack', 'vue-loader', 'vue-loader/lib/plugin', 'vue-template-compiler/package.json'
+  'webpack', 'vue-loader', 'vue-loader/lib/plugin', 'vue-template-compiler', 'vue-template-compiler/package.json'
 ].reduce((k1, k2) => {
   k1[k2] = require.resolve(k2)
   return k1