MPVUE - 第三方组件分包 解决代码包过大问题

最近做小程序项目,要加入视频通话功能,需要接入腾讯云实时音视频(trtc-room)。


trtc-room

各种百度、Google、GitHub,都说mpvue引入的第三方组件只能放在static目录下,但是小程序限制大小2M,引入vant weapp(700k) + 腾讯trtc实时音视频sdk(700k),再加上moment、mqtt等三方库,留给开发者的操作空间只有不到1M了?甚至。。。我的项目已经轻轻松松的超了限制不能预览了。。。

分包的话,把trtc sdk放在pages文件夹内,mpvue打包时会把它忽略掉 --- 它只管.vue文件,不管小程序格式 .wxml。

试了写插件、换框架-uni、wepy、taro甚至原生都试了 , 统统不能解决我的问题。。

只好从源头出发,去改mpvue的打包方式,webpack.base.conf.js。

特别简单的一行代码

    new CopyWebpackPlugin([{
      from: path.resolve(__dirname, '要引入的组件路径'),
      to: path.resolve(config.build.assetsRoot, '对应的打包后pages文件夹'),
      ignore: ['.*']
    }])

OK 搞定~!

webpack.base.conf.js

trtc被完全放在了分包内, 主包的大小又在可控范围内啦~~

你可能感兴趣的:(MPVUE - 第三方组件分包 解决代码包过大问题)