1.0.1 • Published 1 year ago

lodash-miniprogram-polyfill v1.0.1

Weekly downloads
-
License
ISC
Repository
-
Last release
1 year ago

背景

抹平lodash(lodash-es)在各类小程序环境下的报错问题。原理众所周知,小程序的全局对象跟browser的全局对象不同。出发点是在uniapp cli vue3+ts的工程里写小程序平台的lodash polyfill,因为不是npm包,引入执行始终会在npm包的lodash的引入执行之后,这样polyfill就失效了。所以需要构建一个npm包的ployfill,并在导入lodash前导入。

使用

import _ from 'lodash-es' 之前 import 'lodash-miniprogram-polyfill',(建议使用lodash-es可以按需导入减少打包后的体积)

推荐使用方式

定义一个文件提前导入polyfill,在这之后导入导出npm包中的lodash,在项目中使用就直接从这个文件导入lodash对应的api即可,ts的类型推断也能保持

示例

-/src/utils/lodashFix.ts

// #ifdef MP-WEIXIN
import 'lodash-miniprogram-polyfill'
// #endif
export * from 'lodash-es'

-/src/pages/index/index.vue

<script setup lang="ts">
import { throttle } from '@/utils/lodashFix'
</script>

这里的示例是uniapp中的使用,使用条件编译在编译阶段去掉不必要的导入,不过polyfill副作用执行前会先判断是否在小程序的环境中,即使导入了也无问题只是体积稍微大了一点(500+bytes)。 taro支持npm构建,所以也可以使用此npm包,使用示例可参考uniapp的。

待续

目前因为只需要支持微信小程序端,所以只针对微信小程序环境做了polyfill处理,其他的小程序平台没有测试过,不过应该是类似的处理方式。