如何在微信小程序中使用Lodash工具类库

“我报名参加金石计划1期挑战——瓜分10万奖池，这是我的第2篇文章，点击查看活动详情”

一、引入lodash工具类库

1. npm安装

   npm i --save lodash 下载成功后，使用微信开发工具-工具栏-构建npm

2. 直接去官网下载

   推荐下载 lodash.min.js

二、使用

    //app.js 全局引入

    import _ from 'lodash'

    // import _ from './libs/lodash@4.17.15.min.js'

    // 全局挂载lodash工具库`

    wx.$_ = _;

三、对比

npm此方式引入的包体积很大，占用了533KB,而微信单包体积允许2M

上传代码时，微信开发者工具并没有将lodash包进行打包压缩

所以采用min.js方式，以减少包体积

|   方式   | 包体积   | 推荐 |
| ------  | -----   | ---- |
|  npm    | 533KB   |  ❌  |
| min.js  | 72KB    |  ✅ ｜

四、存在的问题

直接引入lodash工具类库运行小程序会报错

原因：因为该工具库有很多原生 JS 对象在微信小程序中是不存在的，比如 BOM 对象只有浏览器中才有，小程序没有所以势必会引发报错。

解决办法：需要引入一个修复包

lodash-fix.js
/**
 * 修复 微信小程序中lodash 的运行环境
 */
global.Object = Object;
global.Array = Array;
// global.Buffer = Buffer
global.DataView = DataView;
global.Date = Date;
global.Error = Error;
global.Float32Array = Float32Array;
global.Float64Array = Float64Array;
global.Function = Function;
global.Int8Array = Int8Array;
global.Int16Array = Int16Array;
global.Int32Array = Int32Array;
global.Map = Map;
global.Math = Math;
global.Promise = Promise;
global.RegExp = RegExp;
global.Set = Set;
global.String = String;
global.Symbol = Symbol;
global.TypeError = TypeError;
global.Uint8Array = Uint8Array;
global.Uint8ClampedArray = Uint8ClampedArray;
global.Uint16Array = Uint16Array;
global.Uint32Array = Uint32Array;
global.WeakMap = WeakMap;
global.clearTimeout = clearTimeout;
global.isFinite = isFinite;
global.parseInt = parseInt;
global.setTimeout = setTimeout;

再引入修复包即可解决

//app.js
import 'lodash-fix.js';
import _ from 'lodash@4.17.15.min.js';