Vuetify:导入 'vuetify/lib/framework' 与 'vuetify/lib' 之间的区别

Vuetify: Difference between import 'vuetify/lib/framework' vs 'vuetify/lib'

Vuetify 的以下导入有什么区别:

方法一:

import Vuetify from 'vuetify/lib/framework';

方法二:

import Vuetify from 'vuetify/lib';

使用方法 A,Vuetify 包的大小为 1.12MB(开发):

使用方法 B,它的大小为 1.79MB(开发):

对于生产,包大小是相同的。

我的猜测是,使用方法 A Vuetify 已经在开发中进行 tree-shaking 运行,而方法 B 的 tree-shaking 只出现在生产构建中。

您可以在 node_modules 文件夹中自行检查(如果您使用 npm)。

  • vuetify/lib/framework 导出一个 Vuetify Class,这是处理所有 vuetify 魔法的框架。

  • vuetify/lib 导出相同的 Vuetify Class,但也导出所有组件、指令和预定义颜色作为命名导出以便于访问,从而导致开发中的更大的包。

正如您在自己的结果中看到的那样,由于 treeshaking,这对生产来说真的无关紧要。但是,如果您要自定义安装,从 vuetify/lib 为 Vuetify 和所有其他相关组件进行一次导入比为颜色、组件和指令单独导入和路径更容易。