[build] upgrade vue-loader@15 (youzan#937)

xuxiaoxiao312 · Apr 25, 2018 · e42a048 · e42a048
1 parent 7bdce04
commit e42a048
Show file tree

Hide file tree

Showing 7 changed files with 122 additions and 158 deletions.
diff --git a/build/webpack.build.js b/build/webpack.build.js
@@ -1,5 +1,4 @@
 const path = require('path');
-const webpack = require('webpack');
 const config = require('./webpack.config.dev.js');
 const isMinify = process.argv.indexOf('-p') !== -1;
 
@@ -24,7 +23,6 @@ module.exports = Object.assign({}, config, {
       amd: 'vue'
     }
   },
-  plugins: [],
   performance: false,
   optimization: {
     minimize: isMinify

diff --git a/build/webpack.config.dev.js b/build/webpack.config.dev.js
@@ -1,9 +1,9 @@
 const path = require('path');
-const webpack = require('webpack');
 const HtmlWebpackPlugin = require('html-webpack-plugin');
 const MiniCssExtractPlugin = require('mini-css-extract-plugin')
 const ProgressBarPlugin = require('progress-bar-webpack-plugin');
 const isProduction = process.env.NODE_ENV === 'production';
+const { VueLoaderPlugin } = require('vue-loader')
 
 module.exports = {
   mode: 'development',
@@ -41,7 +41,9 @@ module.exports = {
           {
             loader: 'vue-loader',
             options: {
-              preserveWhitespace: false
+              compilerOptions: {
+                preserveWhitespace: false
+              }
             }
           }
         ]
@@ -52,7 +54,7 @@ module.exports = {
         use: 'babel-loader'
       },
       {
-        test: /\.css$/,
+        test: /\.(css|postcss)$/,
         use: [
           MiniCssExtractPlugin.loader,
           'css-loader',
@@ -73,6 +75,7 @@ module.exports = {
     ]
   },
   plugins: [
+    new VueLoaderPlugin(),
     new ProgressBarPlugin(),
     new HtmlWebpackPlugin({
       chunks: ['vendor', 'vant-docs'],

diff --git a/build/webpack.config.prod.js b/build/webpack.config.prod.js
@@ -1,4 +1,3 @@
-const webpack = require('webpack');
 const merge = require('webpack-merge');
 const path = require('path');
 const devConfig = require('./webpack.config.dev.js');

diff --git a/package.json b/package.json
@@ -82,7 +82,7 @@
     "gh-pages": "^1.0.0",
     "html-webpack-plugin": "3.2.0",
     "husky": "^0.14.3",
-    "isparta-loader": "^2.0.0",
+    "istanbul-instrumenter-loader": "^3.0.1",
     "karma": "^2.0.0",
     "karma-chrome-launcher": "^2.2.0",
     "karma-coverage": "^1.1.1",
@@ -109,7 +109,7 @@
     "url-loader": "^1.0.1",
     "vant-doc": "1.0.4",
     "vue": "2.5.16",
-    "vue-loader": "^14.2.2",
+    "vue-loader": "^15.0.0",
     "vue-router": "^3.0.1",
     "vue-sfc-compiler": "^0.0.8",
     "vue-style-loader": "^4.1.0",

diff --git a/test/get-webpack-conf.js b/test/get-webpack-conf.js
@@ -1,6 +1,8 @@
 const path = require('path');
 const webpack = require('webpack');
 const ProgressBarPlugin = require('progress-bar-webpack-plugin');
+const { VueLoaderPlugin } = require('vue-loader');
+const webpackDevConfig = require('../build/webpack.config.dev');
 
 function getWebpackConfig(testFileName) {
   return {
@@ -12,100 +14,51 @@ function getWebpackConfig(testFileName) {
       chunkFilename: '[id].js',
       libraryTarget: 'umd'
     },
+    resolve: webpackDevConfig.resolve,
     plugins: [
+      new VueLoaderPlugin(),
       new ProgressBarPlugin(),
-      new webpack.LoaderOptionsPlugin({
-        minimize: true,
-        options: {
-          babel: {
-            presets: ['env'],
-            plugins: ['transform-runtime', 'transform-object-rest-spread']
-          },
-          vue: {
-            autoprefixer: false,
-            preserveWhitespace: false
-          }
-        }
-      }),
       new webpack.DefinePlugin({
         'process.env': {
           TEST_FILE: `"${testFileName}"`
         }
       })
     ],
-    stats: 'errors-only',
-    resolve: {
-      modules: [path.resolve(process.cwd(), 'node_modules'), 'node_modules'],
-      extensions: ['.js', '.vue', '.css'],
-      alias: {
-        src: path.resolve(process.cwd(), 'src'),
-        packages: path.resolve(process.cwd(), 'packages'),
-        vue$: 'vue/dist/vue.common.js'
-      }
-    },
     module: {
       rules: [
         {
-          enforce: 'pre',
           test: /\.js$/,
-          exclude: /node_modules|vue-router\/|vue-loader\/|docs|test|src\/index|src\/utils|src\/mixins|packages\/swipe/,
-          use: 'isparta-loader'
+          exclude: /node_modules|test|mock|swipe|locale|waterfall/,
+          use: [
+            {
+              loader: 'istanbul-instrumenter-loader',
+              options: { esModules: true }
+            },
+            'babel-loader'
+          ]
         },
         {
           test: /\.js$/,
-          exclude: /node_modules|vue-router\/|vue-loader\//,
-          use: 'babel-loader'
+          exclude: /node_modules/,
+          use: [
+            'babel-loader'
+          ]
         },
         {
-          test: /\.(css|pcss)$/,
+          test: /\.(css|postcss)$/,
           use: ['style-loader', 'css-loader', {
             loader: 'postcss-loader',
             options: { sourceMap: true }
           }]
         },
         {
-          test: /\.(gif|png|jpe?g)(\?\S*)?$/,
-          use: [
-            {
-              loader: 'url-loader',
-              options: {
-                query: {
-                  limit: 10000,
-                  name: 'static/[name].[hash:7].[ext]'
-                }
-              }
-            }
-          ]
-        },
-        {
-          test: /test\/components\/.*\.vue$|packages\/swipe.*\.vue$/,
-          use: [
-            {
-              loader: 'vue-loader',
-              options: {
-                loaders: {
-                  css: ['style-loader', 'css-loader', {
-                    loader: 'postcss-loader',
-                    options: { sourceMap: true }
-                  }]
-                }
-              }
-            }
-          ]
-        },
-        {
-          test: /packages\/.*\.vue$/,
-          exclude: /packages\/swipe.*\.vue$/,
+          test: /\.vue$/,
           use: [
             {
               loader: 'vue-loader',
               options: {
-                loaders: {
-                  css: ['style-loader', 'css-loader', {
-                    loader: 'postcss-loader',
-                    options: { sourceMap: true }
-                  }],
-                  js: ['isparta-loader']
+                compilerOptions: {
+                  preserveWhitespace: false
                 }
               }
             }

diff --git a/test/karma.conf.js b/test/karma.conf.js
@@ -1,9 +1,3 @@
-require('babel-polyfill');
-
-require('babel-core/register')({
-  presets: [require('babel-preset-env')]
-});
-
 const getWebpackConfig = require('./get-webpack-conf');
 
 module.exports = function(config) {
@@ -13,13 +7,9 @@ module.exports = function(config) {
     reporters: ['spec', 'coverage'],
     files: ['./index.js'],
     preprocessors: {
-      './index.js': ['webpack'],
-      'test/!(components)/**/*.vue': ['coverage']
+      './index.js': ['webpack']
     },
     webpack: getWebpackConfig(getTestFileName()),
-    webpackMiddleware: {
-      noInfo: true
-    },
     coverageReporter: {
       dir: './coverage',
       reporters: [