Loadsh is cumbersome to introduce in applets. Here’s why:
1. Cannot be introduced on demand. Since taro’s WebPack configuration doesn’t do tree shaking for es6 Modules, it will introduce Loash as a whole and support Verndor.js directly
2, environmental problems, some global variables in the small program environment do not exist, need to be re-specified
The solution
Use lodash-webpack-plugin to load on demand
In config/index.js:
webpackChain(chain) {
// chain.plugin(‘analyzer’)
// .use(require(‘webpack-bundle-analyzer’).BundleAnalyzerPlugin, [])
// LoDash slim configuration
/ / strange behavior, you need to set up the www.npmjs.com/package/lod…
// There is no reference to shothands, coercions, and paths in it. There is no reference to shothands, coercions, and paths
chain.plugin(‘lodash-webpack-plugin’)
.use(require(‘lodash-webpack-plugin’), [
{
shorthands: true,
cloning: true,
caching: true,
collections: true,
exotics: true,
guards: true,
memoizing: true,
coercions: true,
flattening: true,
paths: true,
}])
// Split lodash out separately (to prevent vendors. Js from getting too big)
chain.merge({
optimization: {
splitChunks: {
cacheGroups: {
lodash: {
name: ‘lodash’,
priority: 1000,
test(module) {
return /node_modules[\\/]lodash/.test(module.context)
},
},
},
},
},
})
},
CommonChunks (commonChunks) {// Add lodash public files
commonChunks.push(‘lodash’)
return commonChunks
},
Declare global variables in advance
1. Declare global variables in advance
loadsh-prepare.js
// To use loadsh must be declared
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
export default {}
2. Introduce global variables
loadsh.ts
import {} from ‘./loadsh-prepare’
import _ from ‘lodash’
export default _
Third, pay attention to
While Loadsh is convenient, we are also slimming to the maximum. But it’s still big when packed, so if you don’t have to use it, don’t use it
