angular - 角度性能，具有特定路径的导入

Question

我正在尝试减小我的捆绑包大小。我跑了webpack-bundle-analyzer。

例如，在包裹上，lodash我得到以下统计信息：

• 统计大小 527.2kb
• 解析大小 69.14kb
• 压缩后的 23.67kb

Webpack 大小定义

我通过以下方式导入 lodash 方法：

import {uniq, get, flatten} from 'lodash';

问题1）

我不清楚我是否从直接导入方法中获得任何好处，例如：

import {uniq} from 'lodash/uniq';

一些基准测试文章写道，这减少了捆绑包的大小。但是，例如使用 lodash，这似乎也可以通过 webpack 插件来实现。正如在上面的示例中可以看到的那样，解析后的大小是统计数据大小的十分之一。那么这已经由角度完成了吗？

问题2）

如果 1) 减小包大小，有没有比将导入拆分为多行更好的方法——恕我直言，代码非常混乱。

import {uniq, get, flatten} from 'lodash';

=>

import {uniq, get, flatten} from 'lodash/uniq';
import {uniq, get, flatten} from 'lodash/get';
import {uniq, get, flatten} from 'lodash/flatten';

ECAM6 进口

问题 3)

如果我遵循直接导入的建议，我只会收到错误

error TS2305: Module '"./frontend/node_modules/@types/lodash/difference"' has no exported member 'difference'.

我是否需要在我的 lodash 中添加地图（可能还有我正在优化的任何其他模块）angular.json？

标签： angularwebpacklodash