webpack 打包优化 about blog HOT 1 OPEN

npm install webpack-cli --save-d 

const path = require("path");
const webpack = require("webpack");

module.exports = {
  entry: {
    vendor: [
      "vue-router/dist/vue-router.esm.js",
      "vuex/dist/vuex.esm.js",
      "axios"
    ]
  },
  output: {
    path: path.join(__dirname, "public/vendor"),
    filename: "[name].dll.js",
    library: "[name]_[hash]" // vendor.dll.js中暴露出的全局变量名
  },
  plugins: [
    new webpack.DllPlugin({
      path: path.join(__dirname, "public/vendor", "[name]-manifest.json"),
      name: "[name]_[hash]",
      context: process.cwd()
    })
  ]
};

{
···
  "scripts": {
    "serve": "npm link typescript && vue-cli-service serve",
    "dll": "webpack -p --progress --config ./webpack.dll.conf.js",
···
  },
···
}

<script src="./vendor/vendor.dll.js"></script>

const webpack = require("webpack");
module.exports = {
···
  configureWebpack: {
    plugins: [
      new webpack.DllReferencePlugin({
        context: process.cwd(),
        manifest: require("./public/vendor/vendor-manifest.json")
      })
    ]
  }
···
}