根据文档，我无法创建 Vue.js 3 的实例

Question

密码

https://stackblitz.com/edit/vue-ttt?file=src/main.js

问题

我正在尝试在 StackBlitz 中构建一个简单的井字游戏应用程序。这是我的 main.js 文件：

import Vue from "vue";
import App from "./App.vue";
import TicTacToe from "./components/TicTacToe";
import Cell from "./components/Cell";

Vue.component("tic-tac-toe", TicTacToe);  // error: "cannot read property 'component' of undefined"

另请注意我的 package.json 文件将 vue 作为依赖项：

"dependencies": {
  "vue": "^3.0.0"
},

所以错误的意思是需要定义Vue，ok 所以我参考the 3x documentation:

const app = Vue.createApp({ /* options */ })

但是我得到了Cannot read property 'createApp' of undefined

然后我尝试定义一个实例：

const Vue = new Vue({});

我得到Cannot access 'Vue' before initialization

因此，根据 google 对该错误的搜索，我尝试：

Vue = new Vue({})

然后我得到 vue_1.default is not a constructor。

那我做错了什么？

Answer 1

当您使用 vue-cli、webpack 或 vite ... 等捆绑器时，您应该导入 createApp 以创建新实例并将其用于 app.use 或 app.component ... :

 import { createApp } from "vue";
 const app = createApp({ /* options */ })

像这样使用 CDN：

<script src="https://unpkg.com/vue@next"></script>

Vue 实例在全球范围内可用，因此您可以按如下方式使用它：

const app = Vue.createApp({ /* options */ })

Answer 2

您收到此错误是因为 Vue3 使用命名导出而不是默认导出。您可以阅读更多相关信息 here。

您可以通过简单地将所有命名导出导入到名为 Vue:

的对象来修复此错误

import * as Vue from 'vue';

根据文档，我无法创建 Vue.js 3 的实例

Following documentation I cannot create an instance of Vue.js 3

javascript

vue.js

vue-component

vuejs3

密码

问题

那我做错了什么？