首页 > Web开发 > 详细

【webpack】使用DllPlugin拆分模块

时间:2019-02-13 13:52:11      阅读:178      评论:0      收藏:0      [点我收藏+]

开发过程中,我们经常需要引入大量第三方库,这些库并不需要随时修改或调试,我们可以使用DllPlugin和DllReferencePlugin单独构建它们。 具体使用如下:

const HtmlWebpackPlugin = require(‘html-webpack-plugin‘);
module.exports = {
    entry: {
        vendor: [
            ‘axios‘,
            ‘vue-i18n‘,
            ‘vue-router‘,
            ‘vuex‘
        ]
    },
    output: {
        path: path.resolve(__dirname, ‘../static/‘),
        filename: ‘[name].dll.js‘,
        library: ‘[name]_library‘
    },
    plugins: [
        new webpack.DllPlugin({
            path: path.join(__dirname, ‘build‘, ‘[name]-manifest.json‘),
            name: ‘[name]_library‘
        })
    ]
}

 

执行webpack命令,build目录下即可生成 dll.js 文件和对应的 manifest 文件,使用 DLLReferencePlugin 引入:

plugins: [
    new webpack.DllReferencePlugin({
        context: __dirname,
        manifest: require(‘./build/vendor-manifest.json‘)
    })
]

 

【webpack】使用DllPlugin拆分模块

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

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