以下文档我无法创建 Vue.js 3 的实例 [英] Following documentation I cannot create an instance of Vue.js 3
问题描述
https://stackblitz.com/edit/vue-ttt?file=src/main.js
我正在尝试在 StackBlitz 中构建一个简单的井字游戏应用程序.这是我的 main.js 文件:
I'm trying to build a simple tic-tac-toe app in StackBlitz. This is my main.js file:
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 作为依赖:
Also note my package.json
file has vue as a dependency:
"dependencies": {
"vue": "^3.0.0"
},
所以错误意味着需要定义Vue,好吧我参考3x 文档:
So the error means Vue needs to be defined, ok so I refer to the 3x documentation:
const app = Vue.createApp({ /* options */ })
但是我得到无法读取未定义的属性createApp"
然后我尝试定义一个实例:
So then I try to define an instance:
const Vue = new Vue({});
我得到初始化前无法访问'Vue'
因此,基于对该错误的谷歌搜索,我尝试:
So, based on a google search of that error, I try:
Vue = new Vue({})
我得到 vue_1.default 不是构造函数
.
推荐答案
当你使用诸如 vue-cli、webpack 或 vite 之类的 bundler 时,你应该导入 createApp
来创建新的实例和将它用于 app.use
或 app.component
... :
When you work with bundler like vue-cli, webpack or vite ..., you should import createApp
to create new instance and use it for app.use
or app.component
... :
import { createApp } from "vue";
const app = createApp({ /* options */ })
使用 CDN 如下:
<script src="https://unpkg.com/vue@next"></script>
Vue 实例是全局可用的,因此您可以按如下方式使用它:
the Vue instance is available globally so you could use it as follows :
const app = Vue.createApp({ /* options */ })
这篇关于以下文档我无法创建 Vue.js 3 的实例的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!