本文共 2486 字，大约阅读时间需要 8 分钟。

// node path packageconst path = require("path")const VueLoaderPlugin = require('vue-loader/lib/plugin')const ExtractTextPlugin = require("extract-text-webpack-plugin")const HtmlWebpackPlugin = require('html-webpack-plugin')module.exports = {       entry: "./webpack-demo/src/index.js",    output: {           path: path.resolve(__dirname, "./webpack-demo/dist"),        filename: "js/index.js",        // 对编译后的url 增加前缀        // publicPath: "dist/",    },    resolve: {           // 给vue起别名        alias: {               // 运行时依赖版本            "vue$": "vue/dist/vue.esm.js"        }    },    module: {           rules: [            {                   // npm --save-dev install style-loader css-loader                test: /\.css$/,                // 顺序不能改变                // use: ["style-loader", "css-loader"]                use: ExtractTextPlugin.extract({                       use: 'css-loader',                    fallback: 'vue-style-loader'                })            },            {                   // npm --save-dev install url-loader file-loader                test: /\.(png|gif|jpg)$/,                use: [                    {                           loader: "url-loader",                        options: {                               // 对文件大小限制,大于限制则使用file-loader                            limit: 8192,                            // 对file-loader 设置                            name: 'img/[name].[hash:8].[ext]',                        }                    }                ]            },            {                   // ES6 转ES5 npm --save-dev install babel-loader@7 babel-core babel-preset-es2015                test: /\.js$/,                // 排除，不打包该文件夹下的js                exclude: /(node_modules|bower_components)/,                use: {                       loader: 'babel-loader',                    options: {                           presets: ['es2015']                    }                }            },            {                   // vue loader                test: /\.vue$/,                use: ["vue-loader"]            },            {                   test: /\.(eot|svg|ttf|woff|woff2)(\?\S*)?$/,                loader: 'file-loader',                options: {                       outputPath: "fonts"                }            }        ]    },    plugins: [        new VueLoaderPlugin(),        new ExtractTextPlugin("css/styles.css"),        new HtmlWebpackPlugin(            {    template: "./webpack-demo/index.html" }        )    ]}