uni微信小程序优化，删除打包后的import vue路径

  • Z时代
  • 2024-01-10
  • 分类：综合

vue

这次的优化我公司项目主包只减小了32kb，但是减小的不仅仅是主包，所有分包均在没有改动任何业务代码的情况下完成了压缩空间的优化。

主包分包压缩空间的优化都要视项目而定，32kb只是我公司的小程序项目。

还有一点需要提前说明，此优化我公司项目因为主包够用了就还没有正式使用，不保证完全没有问题，所以要辛苦测试了。

插件

uni-optimize 是我看了uni源码之后发现的所有可安全优化的地方，包括压缩空间和提升打包速度2个方面

uni-optimize中的fix-ensure-import-plugin插件

可以直接把代码拷下来使用，也可以npm下载

优化原理

我的标题描述的可能不太好，直接上代码吧

import ff from \'./ff.vue\'

这种类似代码相信大家写的都能倒着背了吧。uni转换后的代码如下

var ff = function ff() {
  __webpack_require__.e(/*! require.ensure | pages/index/ff */ "pages/index/ff").then((function () {
    return resolve(__webpack_require__(/*! ./ff */ "3fd1"));
  }).bind(null, __webpack_require__)).catch(__webpack_require__.oe);
};

这是为了可阅读没有走压缩的代码，这一段代码在小程序中实没有使用的，所以我用ast把代码删除了

插件安全性

我通过了以下几点来确认是可以删除的。

1 先在导入方法里也就是上面代码的ff方法中打断点，看断点是否生效，如果生效了那就没必要写这个文章了。。。

2 为了了解小程序中vue组件之间的交互专门去把uni的运行时代码读了一遍，发现确实是没有使用的，

uni运行时: https://www.cnblogs.com/wzcsqaws/p/15731957.html

简单点来说，微信每一个页面或者组件都有json文件，里面存放了相互的关系，我们平时写的import组件的代码，

其实只是在打包的时候帮助uni来生成小程序的json文件，打包完后微信并没有去使用它所以可以删除来节省代码空间。

可能出现的问题

本人的ast不是很厉害，可能没有兼容到不同的import写法，但是最多也就是没有删除干净

以上是 uni微信小程序优化，删除打包后的import vue路径 的全部内容， 来源链接： utcz.com/z/379104.html

回到顶部