为什么 vue-cli 明白我已经安装了 vue-cli-plugin-vuetify 和 vuetify-loader？答案

【问题标题】：Why vue-cli understand I've installed vue-cli-plugin-vuetify and vuetify-loader?为什么 vue-cli 明白我已经安装了 vue-cli-plugin-vuetify 和 vuetify-loader？
【发布时间】：2021-02-28 07:49:32
【问题描述】：

当我通过这个命令创建一个新的vue-cli 项目时

vue create hello-word

这个命令安装vuetify

vue add vuetify

然后我看到我的 git 变化是这样的

在package.json 中安装了两个新的依赖项。

vue-cli-plugin-vuetify
vuetify-loader

乍一看，我以为vue.config.js指定了使用这两个，但它的内容只有这些代码。

module.exports = {
  "transpileDependencies": [
    "vuetify"
  ]
}

那么，vue-cli 怎么知道我安装了这个新的 vuetify 加载器？

它会自动拾取这些吗？

【问题讨论】：

您找到解决方案了吗？我有同样的问题，无法使用 vuetify

标签： vuetify.js vue-cli vue-cli-3 vue-cli-4 vuetify-loader

【解决方案1】：

vuetify-loader 是一个用于 Webpack 的 treeshaking 插件。当您使用“vue add vuetify”安装 Vuetify 时，它会自动安装。

因此，Webpack 使用 vuetify-loader 对 Vuetify 组件进行树状抖动，以仅包含您在应用程序中导入的组件。这样，Webpack 应该能够通过仅导入所需的组件而不是所有 Vuetify 组件来降低构建大小。

见Vuetify Treeshaking

这是vuetify-loader project on Github

【讨论】：