優(yōu)化在開發(fā)時(shí)的編程體驗(yàn),減少在部署時(shí)的體積。
開發(fā)時(shí) import _ from "lodash";
這種方式依賴清晰,可讀性好,強(qiáng)烈推薦。
您可能覺得每次使用lodash寫一下這句話很麻煩,相信我,這樣是值得的。
部署時(shí)優(yōu)化
為了import _ from "lodash"; 也能夠按需打包,需要安裝
npm i --save-dev lodash-webpack-plugin babel-core babel-loader babel-plugin-lodash babel-preset-env webpack
接著修改 vue.config.js
const LodashModuleReplacementPlugin = require("lodash-webpack-plugin");
const production = process.env.NODE_ENV === "production";
module.exports = {
chainWebpack: config => {
if (production) {
config.plugin("loadshReplace").use(new LodashModuleReplacementPlugin());
//生產(chǎn)環(huán)境才開啟 不然開發(fā)時(shí)lodash函數(shù)不起作用 也不報(bào)錯(cuò)
}
},
};
我的項(xiàng)目用了reduce這個(gè)函數(shù),打包體積變?yōu)?.1KB

image.png
沒看到效果,建議關(guān)掉重啟再試一下。
github 地址 : https://github.com/xiaodun/sf-time-killer
好文推薦: