webpack 处理 vue单文件

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
const { VueLoaderPlugin } = require('vue-loader');
const  ExtractTextPlugin=require("extract-text-webpack-plugin");
const webpack = require ("webpack");  
const webpackDevServer = require('webpack-dev-server');  

module.exports = {
  mode: 'development',
  entry:...
  output:{
      path:path.join(__dirname,"./dist"),  
      publicPath:"/vue-SPA/dist/" ,       
      filename:"main.js"
  },
  module: {
    rules: [
      {
        test: /.vue$/,
        loader: 'vue-loader',       
         options:{
         loaders:{
           css:ExtractTextPlugin.extract({
             use:"css-loader",
             fallback:"vue-style-loader",           
           })
         }
       }
      }
},

    plugins:[

1
      new ExtractTextPlugin("main.css"")       

1
      new VueLoaderPlugin(),                     //注意插件的引入