はじめに
Vue3で作成したプロジェクトでvue-routerを使おうとしたが、なぜかうまくいかず
調べてもあまり情報がなかったのでここに記録することに決めた!
Vue3でvue-routerを入れると、、
npm install vue-router
main.js
import { createApp } from 'vue';
import { createRouter, createWebHistory } from 'vue-router';
import App from './App.vue';
import TeamsList from './components/teams/TeamsList.vue';
import UsersList from './components/users/UsersList.vue';
const router = createRouter({
history: createWebHistory(),
routes: [
{ path: '/teams', component: TeamsList },
{ path: '/users', component: UsersList },
]
})
const app = createApp(App)
app.use(router);
app.mount('#app');
WARNING Compiled with 2 warnings 23:00:16
warning in ./src/main.js
"export 'createRouter' was not found in 'vue-router'
warning in ./src/main.js
"export 'createWebHistory' was not found in 'vue-router'
App running at:
- Local: http://localhost:8080/
- Network: http://192.168.11.20:8080/
vue-router
がありませんよ!!っと言われる。。なんで??!
Vue3ではvue-routerも新しくしないとダメ
これらの公式ドキュメントを見ると
npm install vue-router@next
「@next」がついてる!
どうやら今のところはこのコマンドで入れないといけないようです。。。
知らんかったーーーー。エラーメッセージ とかつけといてくれよ。。。