当使用 vue-cli 开始一个新项目时，它会询问几个问题来自定义设置。一般项目名称，描述，是否使用 eslint 进行 linting，karma 和 mocha 进行测试等。这次它问我
? Use a-la-carte components?
我在 vue-cli 文档中搜索了它，但没有找到任何东西。 那么谁能告诉我什么是“点菜组件”以及我是否应该使用它？
【问题讨论】：
a-la-carte 意味着你从一个更大的东西中得到了一些东西。最简单的例子是 John Leider 的 vuetify，您可以获取整个库，也可以通过仅获取所需的组件而不获取全部内容来执行 a-la-carte。比如说，您只需要按钮组件和文本字段组件。我希望它有所帮助。
标签： webpack vuejs2 vuetify.js vue-cli-3
À la carte 是英语借用短语，意思是“根据 到菜单。”它指的是“可以单独订购的食物 项目，而不是套餐的一部分。”
因此，如果您使用点菜组件，则意味着您只包含您需要（想要）使用的组件，而不是获取所有组件
Vuetify 让您可以轻松地只导入您需要的内容，从而大大减少其占用空间。
import {
Vuetify,
VApp,
VNavigationDrawer,
VFooter,
VList,
VBtn
} from 'vuetify'
Vue.use(Vuetify, {
components: {
VApp,
VNavigationDrawer,
VFooter,
VList,
VBtn
}
})
编辑 2018 年 11 月 14 日：
由于vuetify 1.3.0，vuetify-loader（包含在 vuetify cli 安装中）
自动处理您的应用程序的点菜需求，这意味着它会在您使用时自动导入所有 Vuetify 组件。
【讨论】：
首先，您在文档中没有找到该选项，因为它实际上是 vuetify plugin 选项。当启用“a-la-carte”组件时，文件/plugins/vuetify.js 应包含：
import Vue from 'vue'
import {
Vuetify,
VApp,
//other vuetify components
} from 'vuetify'
Vue.use(Vuetify, {
components: {
VApp,
//other vuetify components
}
})
并且应该更改您的 babel.config.js 文件以防止使用“transform-imports”插件进行完整的 vuetify 导入。
其次，在 vuetify v1.3.0-alpha.0 之前，如果您想最小化 webpack 供应商捆绑包，“点菜”很有用，但是必须有选择地导入 vuetify 组件非常乏味，尤其是在开发过程中。此外，自从引入“点菜组件”以来，Webpack 已经发展了很多。
出于这些原因，从 vuetify 1.3.0-alpha.0 开始，开发团队正在努力通过使用 Webpack 4 tree shaking 功能（AKA 死代码消除）完全消除对点菜组件的需求通过vuetify-loader。这些功能预计将被添加到 vuetify 官方插件中，以获得自动“点菜组件”。
所以，要解决您的第二个问题（如果您应该使用点菜），答案是不，不再。 以下是您自己设置 vue-cli 3 项目以使用此功能的方法：
npm install -D vuetify-loader
'vuetify/lib' 而不是 'vuetify' 导入 vuetify。代码：
import Vue from 'vue'
import Vuetify from 'vuetify/lib'
Vue.use(Vuetify)
vue.config.js 文件中将 vuetify-loader 注册为 webpack 插件（如果不存在，请在项目的根目录中创建该文件）。代码：
const VuetifyLoaderPlugin = require('vuetify-loader/lib/plugin')
module.exports = {
configureWebpack: {
plugins: [
new VuetifyLoaderPlugin(),
]
}
// ...other vue-cli plugin options...
}
如果您已经在使用 a-la-carte，请确保从您的 babel 插件列表（通常在 babel.config.js 中找到）中删除“transform-imports”
李> 1234563减少希望对你有帮助
【讨论】：