如何将 Vue 3 与 Vuetify 连接起来？

Question

我使用 Vue 版本 3 初始化了一个新的空 Vue 应用程序。然后我尝试使用命令 vue add vuetify 添加插件 Vuetify --- ，但收到以下错误。关于如何解决它的任何想法？

原文由 AndrewBro 发布，翻译遵循 CC BY-SA 4.0 许可协议

Answer 1

目前可以使用 Vuetify 3 Alpha：

安装

为了正确进行安装，需要 vue-cli 4.0。 vue-cli 提供了更多说明。 （检查 vue -V ）

安装后，使用 vue-cli 4.0 使用以下命令生成项目：

 vue create my-app

出现提示时，选择 Vue 3 Preview ：

 ? Please pick a preset:
    Default ([Vue 2] babel, eslint)
  > Default (Vue 3 Preview) ([Vue 3] babel, eslint)
    Manually select features

建议此时提交或存储您的更改，以防您需要回滚更改。

 cd my-app
vue add vuetify

出现提示后，选择 v3 (alpha)：

 ? Choose a preset: (Use arrow keys)
  Default (recommended)
  Prototype (rapid development)
  Configure (advanced)
> v3 (alpha)

用法

在 Vue 3.0 中，Vue 应用程序（以及扩展的 Vuetify）的初始化过程发生了变化。使用新的 createVuetify 方法，传递给它的选项也发生了变化。有关详细信息，请参阅文档功能部分中的页面。

接下来，导航到您的项目目录并将 Vuetify 添加到您的项目中：

 import { createApp } from "vue";
import vuetify from "./plugins/vuetify";
import App from "./App";

const app = createApp(App);

app.use(vuetify);

app.mount("#app");

资源：

• https://next.vuetifyjs.com/en/getting-started/installation/#installation
• https://next.vuetifyjs.com/en/introduction/roadmap

原文由 Aldo 发布，翻译遵循 CC BY-SA 4.0 许可协议