taro 升级为3.0.9版本之后的明显的两大变化

主要谈论两点我项目中亲身经历到的，更能感同身受

一、优化base.wxml 模版的体积

• 下边看我升级之前的base.wxml的体积，如
• 预览包大小为 5650kb,大家都知道小程序是有大小上限的，超出之后就给开发者带来了一定的困扰。

• 针对大小超限制，我进行了分包预加载的方案，但是无论怎么分都是不行的，因为base.wxml太大了。大的可怕。
• 就去官方找issues，巧了，就有人遇到一样的问题。issues

主要如下三个方向

• 只递归 view、cover-view、block、text、slot、slot-view、label、form、scroll-view 组件，其它组件只需输出一层。其中 slot、slot-view、label、form、scroll-view 组件虽然可能会循环引用自身，但不会循环太多层，因此加上了一定的循环层数限制。
• ad、official-account、open-data、navigation-bar 不需要渲染子元素
• 利用 wxs 计算三元表达式
• 第 16 层只需要渲染一个 container
• 针对如上这里有完整的提案
• 了解此提案之后，我马上对项目进行了升级
• 升级之后的大小来了，擦亮眼睛吧，惊喜来了

• 看见了吗？base由3.6 MB 变成了211 KB，这多么棒呀，体积优化到了几倍，你去算算吧，哈哈。
• 此时我们点击预览，大小变成了1718KB

• 从此想要预览就很方便了呀

二、当一个taro的工程，使用taro UI 组件时，Current值错误

• 官方issues
• 主要是因为组件库引用的 @tarojs/runtime 会是 UI 库文件夹里 node_modules 的一份
• 而项目使用的 @tarojs/runtime 是项目顶层 node_modules 的那份。两个包不一致导致 UI 库获取闭包的 Current 值错误。
• 使用 webpack alias 强行指定使用顶层 node_modules 的 @tarojs/runtime即可解决此问题

具体如：

const path = require("path");
const Chain = require("webpack-chain");
exports.default = (appPath) => {
    const chain = new Chain();
    chain.merge({
        resolve: {
            alias: {
                // 小程序使用 [email protected]
                'regenerator-runtime': require.resolve('regenerator-runtime'),
                // 开发组件库时 link 到本地调试，runtime 包需要指向本地 node_modules 顶层的 runtime，保证闭包值 Current 一致
                '@tarojs/runtime': require.resolve('@tarojs/runtime')
            }
        },
    });
    return chain;
};

• 版本升级之后，在使用库及ui库都可以获取到 Current
• 使用库如

• ui库如

升级之后就是正常的使用，就都可以获取到啦。