webpack 多入口打包配置示例

  • 入口修改成你想要的多个文件

821507-20170915101511641-1740178179.png

  • 准备好多入口页面,也就是多个main.js

821507-20170915101617282-201652731.png

  • 多入口自然要生成多个index.html ,注意 chunks: ['vendor', 'pageb', 'manifest'],

    manifest 这个trunk 是基于vendor 抽取出来的配置trunk,这个一定要引入到html文件 否则会报webpackjsonp找不到错误
    vendor 这个trunk 代表抽取出来的公共的库,如vue,vuex等
    pageb 这个 trunk 代表其中的一个多入口的trunk的名称

821507-20170915101810797-740331778.png

  • 这是上文提到的抽取出来的两个公共trunk vendor & mainfest

821507-20170915102334750-1472683488.png

  • 我们看一下最红打包出来的文件目录和 index.html 引入的文件
    821507-20170915102518360-1270701040.png

源码: https://github.com/KuiShang/mutiple_entry_webpack_vue

转载于:https://www.cnblogs.com/WhiteHorseIsNotHorse/p/7524984.html

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值