我正在嘗試使用 vue js 啟動一個新專案。我想我透過終端擁有了所需的所有依賴項。我安裝了 npm、vue、vue-bootstrap 和 vue-router。錯誤來自 router.js、Vue.use(VueRouter) 上的第 7 行。
這是我的 main.js 的程式碼
import Vue from "vue"
import App from "./App.vue"
import router from "./router.js"
import BootstrapVue from "bootstrap-vue"
import "bootstrap/dist/css/bootstrap.css"
import "bootstrap-vue/dist/bootstrap-vue.css"
Vue.use(BootstrapVue)
Vue.config.productionTip = false
new Vue({
router,
render: h => h(App),
}).$mount('#app')
這是我的 router.js
#import Vue from "vue"
import VueRouter from "vue-router"
import Home from "@/pages/Home.vue"
import About from "@/pages/About.vue"
import Contact from "@/pages/Contact.vue"
Vue.use(VueRouter)
export default new VueRouter({
mode: 'history',
base: process.env.BASE_URL,
routes: [
{
path: '/',
name: 'home',
component: Home
},
{
path: '/about',
name: 'about',
component: About
},
{
path: '/contact',
name: 'contact',
component: Contact
}
]
})
抱歉，我將 import vue 行與程式碼指示器放在同一行，但它被切斷了，但錯誤仍然存在。
完整的錯誤是這樣的：
router.js?41cb:7 Uncaught TypeError: Cannot read properties of undefined (reading 'use')
at eval (router.js?41cb:7)
at Module../src/router.js (app.js:1261)
at __webpack_require__ (app.js:849)
at fn (app.js:151)
at eval (main.js:12)
at Module../src/main.js (app.js:1141)
at __webpack_require__ (app.js:849)
at fn (app.js:151)
at Object.1 (app.js:1274)
at __webpack_require__ (app.js:849)
eval @ router.js?41cb:7
./src/router.js @ app.js:1261
__webpack_require__ @ app.js:849
fn @ app.js:151
eval @ main.js:12
./src/main.js @ app.js:1141
__webpack_require__ @ app.js:849
fn @ app.js:151
1 @ app.js:1274
__webpack_require__ @ app.js:849
checkDeferredModules @ app.js:46
(anonymous) @ app.js:925
(anonymous) @ app.js:928
使用 vue 3 建立應用程序，您必須使用 Vue.createApp 方法，而不是建立新的 vue 實例。
new Vue({ router, }).$mount('#app')變成：
const app = Vue.createApp({ router, }) app.mount('#app')請記住，渲染 api 也發生了變化，而在 2 小時內被注入到函數 args 中，現在您必須從 vue 匯入它。例如：
import { h } from 'vue' export default { render() { return h('div') } }有關文件的更多資訊：此處.
更新。根據評論中的要求，我擴展了範例，包括如何在 vue 3 上使用外掛程式。
回到這裡的範例，如果我們想使用插件，我們需要在安裝之前添加 .use 方法。例如：
const app = Vue.createApp({ router, }) app.use(ThePluginIWantToUse) app.mount('#app')Hiws的回答：
謝謝。