角束尺寸减小的问题

Question

我正在寻求一些帮助来减少我们的项目包大小我尝试应用很多技术首先我删除了未使用的第三个库；

"lodash": "^4.17.19",
"luxon": "^1.27.0",
"minimatch": "~3.0.4",
"moment": "^2.27.0",
"moment-timezone": "^0.5.31",

优化从库的导入：

import * as yaml from 'js-yaml';
import { yaml } from 'js-yaml';

import * as uuid from 'uuid';
import { v4 as uuidv4 } from 'uuid';

但对捆绑包大小没有影响..始终相同我尝试运行

source-map-explorer

和

webpack-bundle-analyzer

但始终没有任何变化.. 所以问是否有使用缓存？

Answer 1

如果您确实想缩小捆绑包的大小，您可以尝试查看包装代码并仅获取您需要的部分。

例如，

lodash

中有很多有用的功能，但我可以假设您只使用其中的一些功能，因此您可以编辑第三方包并在您的个人存储库中重新创建它们。

这不是最好的做法，但确实有效。

此外，为了减少应用程序加载时间，您可以实现 Angulars

Lazy-loading feature

希望它有所帮助，编码愉快:)

Answer 2

您应该检查您的包裹。

安装 webpack-bundle-analyzer。

npm install --save-dev [email protected]

将其添加到您的 package.json > 脚本中。

 "build:stats": "ng build --stats-json",
 "analyze": "webpack-bundle-analyzer dist/<project>/stats.json"

运行时

analyze

，您将获得一个漂亮的 GUI，显示包大小的占用情况。

就我而言，这是在 scss 文件中广泛使用错误的 @import，这大大增加了包的大小。