首页 > Web开发 > 详细

【webpack】中DllPlugin用法

时间:2019-07-14 13:00:49      阅读:96      评论:0      收藏:0      [点我收藏+]

首先准备需要打包的库

webpack.dll.js

const webpack = require(‘webpack‘)
const path = require(‘path‘)

module.exports = {
  entry: {
    react: [‘react‘, ‘react-dom‘]
  },
  output: {
    library:  ‘react‘, // 以一个库的形式导出
    filename: ‘[name].dll.js‘
  },
  plugins: [
    new webpack.DllPlugin({
      name: ‘react‘,
      path: path.resolve(__dirname, ‘dist/manifest.json‘)
    })
  ]
}

 

package.json增加一个脚本

    "dll": "webpack --config webpack.dll.js --mode=development"

 

然后打包出文件react.dll.js和manifest.json

 

在开发环境配置中增加下面代码

  plugins: [
    new webpack.DllReferencePlugin({
      manifest: path.resolve(__dirname, ‘dist/manifest.json‘)
    }),
    new AddAssetHtmlPlugin({ filepath: path.resolve(__dirname, ‘dist/react.dll.js‘) })
  ]

 

用到了HTML引入静态资源的库

add-asset-html-webpack-plugin

【webpack】中DllPlugin用法

原文:https://www.cnblogs.com/wuxianqiang/p/11183736.html

(0)
(0)
   
举报
评论 一句话评论(0
关于我们 - 联系我们 - 留言反馈 - 联系我们:wmxa8@hotmail.com
© 2014 bubuko.com 版权所有
打开技术之扣,分享程序人生!