dllplugin&dllReferencePlugin&htmlWebpackIncludeAssetsPlugin

weijiyang · weijiyang · commit e3ccf1158bb4 · 2019-02-20T16:20:30.000+08:00
diff --git a/optimization/project/package-lock.json b/optimization/project/package-lock.json
diff --git a/optimization/project/package.json b/optimization/project/package.json
@@ -3,8 +3,9 @@
   "version": "0.1.0",
   "private": true,
   "scripts": {
-    "serve": "vue-cli-service serve",
+    "start": "vue-cli-service serve",
     "build": "vue-cli-service build",
+    "dll": "webpack -p --progress --config webpack.dll.js",
     "lint": "vue-cli-service lint"
   },
   "dependencies": {
@@ -18,8 +19,11 @@
     "@vue/cli-service": "^3.4.0",
     "@vue/eslint-config-standard": "^4.0.0",
     "babel-eslint": "^10.0.1",
+    "clean-webpack-plugin": "^1.0.1",
     "eslint": "^5.8.0",
     "eslint-plugin-vue": "^5.0.0",
-    "vue-template-compiler": "^2.5.21"
+    "html-webpack-include-assets-plugin": "^1.0.7",
+    "vue-template-compiler": "^2.5.21",
+    "webpack-cli": "^3.2.3"
   }
 }
diff --git a/optimization/project/public/vendor/dll.lib.js b/optimization/project/public/vendor/dll.lib.js
diff --git a/optimization/project/public/vendor/vendor-manifest.json b/optimization/project/public/vendor/vendor-manifest.json
@@ -0,0 +1 @@
+{"name":"lib","content":{"../../project/node_modules/webpack/buildin/global.js":{"id":0,"buildMeta":{"providedExports":true}},"../../project/node_modules/vue/dist/vue.runtime.esm.js":{"id":2,"buildMeta":{"exportsType":"namespace","providedExports":["default"]}},"../../project/node_modules/timers-browserify/main.js":{"id":3,"buildMeta":{"providedExports":true}},"../../project/node_modules/setimmediate/setImmediate.js":{"id":4,"buildMeta":{"providedExports":true}},"../../project/node_modules/process/browser.js":{"id":5,"buildMeta":{"providedExports":true}},"../../project/node_modules/vue-router/dist/vue-router.esm.js":{"id":6,"buildMeta":{"exportsType":"namespace","providedExports":["default"]}},"../../project/node_modules/vuex/dist/vuex.esm.js":{"id":7,"buildMeta":{"exportsType":"namespace","providedExports":["default","Store","install","mapState","mapMutations","mapGetters","mapActions","createNamespacedHelpers"]}},"../../project/node_modules/lodash/lodash.js":{"id":8,"buildMeta":{"providedExports":true}},"../../project/node_modules/webpack/buildin/module.js":{"id":9,"buildMeta":{"providedExports":true}}}}
diff --git a/optimization/project/vue.config.js b/optimization/project/vue.config.js
@@ -0,0 +1,21 @@
+const path = require('path')
+const webpack = require('webpack')
+const HtmlWebpackIncludeAssetsPlugin = require('html-webpack-include-assets-plugin')
+module.exports = {
+  configureWebpack: {
+    devServer: {
+      open: true
+    },
+    plugins: [
+      new webpack.DllReferencePlugin({
+        context: process.cwd(),
+        manifest: require('./public/vendor/vendor-manifest.json')
+      }),
+      new HtmlWebpackIncludeAssetsPlugin({
+        assets: [path.posix.join('./vendor/dll.lib.js')],
+        hash: true,
+        append: false
+      })
+    ]
+  }
+}
diff --git a/optimization/project/webpack.dll.js b/optimization/project/webpack.dll.js
@@ -0,0 +1,28 @@
+const webpack = require('webpack')
+const path = require('path')
+const CleanWebpackPlugin = require('clean-webpack-plugin')
+const vendors = [
+  'vue',
+  'vue-router',
+  'vuex',
+  'lodash'
+]
+
+module.exports = {
+  entry: {
+    lib: vendors
+  },
+  output: {
+    path: path.resolve(__dirname, 'public/vendor'),
+    filename: 'dll.[name].js',
+    library: '[name]'
+  },
+  plugins: [
+    new CleanWebpackPlugin('public/vendor/*.*'),
+    new webpack.DllPlugin({
+      context: path.resolve(__dirname, '../dist/js'),
+      path: path.resolve(__dirname, 'public/vendor', 'vendor-manifest.json'),
+      name: '[name]'
+    })
+  ]
+}

Original file line number	Diff line number	Diff line change
`@@ -0,0 +1 @@`
	`1`	+{"name":"lib","content":{"../../project/node_modules/webpack/buildin/global.js":{"id":0,"buildMeta":{"providedExports":true}},"../../project/node_modules/vue/dist/vue.runtime.esm.js":{"id":2,"buildMeta":{"exportsType":"namespace","providedExports":["default"]}},"../../project/node_modules/timers-browserify/main.js":{"id":3,"buildMeta":{"providedExports":true}},"../../project/node_modules/setimmediate/setImmediate.js":{"id":4,"buildMeta":{"providedExports":true}},"../../project/node_modules/process/browser.js":{"id":5,"buildMeta":{"providedExports":true}},"../../project/node_modules/vue-router/dist/vue-router.esm.js":{"id":6,"buildMeta":{"exportsType":"namespace","providedExports":["default"]}},"../../project/node_modules/vuex/dist/vuex.esm.js":{"id":7,"buildMeta":{"exportsType":"namespace","providedExports":["default","Store","install","mapState","mapMutations","mapGetters","mapActions","createNamespacedHelpers"]}},"../../project/node_modules/lodash/lodash.js":{"id":8,"buildMeta":{"providedExports":true}},"../../project/node_modules/webpack/buildin/module.js":{"id":9,"buildMeta":{"providedExports":true}}}}