Estoy intentando configurar un vue-router para una aplicación en Vue 2/rails. Instalé vue-router a través de yarn =>
yarn add vue-router@2Ese es mi enrutador =>
import { createWebHistory, createRouter } from "vue-router" import PageHome from '../components/PageHome.vue' import TermsAndConditions from '../components/TermsAndConditions.vue' const routes = [ { path: "/", name: "PageHome", component: PageHome, }, { path: "/terms-conditions", name: "TermsAndConditions", component: TermsAndConditions } ] const router = createRouter({ history: createWebHistory(), routes }) export default routery ese es mi archivo de solicitud
import Vue from 'vue/dist/vue.esm' import router from '../router/index' Vue.use(router) import PageHome from '../components/PageHome.vue' import TermsAndConditions from '../components/TermsAndConditions.vue' const images = require.context('../images', true) require('../stylesheets/application.scss') document.addEventListener('DOMContentLoaded', () => { if(document.getElementById('v-app')) { new Vue({ el: '#v-app', store, components: { PageHome, TermsAndConditions } }) } })He agregado esas líneas en un archivo donde quiero ver los enlaces.
<router-link to="/">Home</router-link> <router-link to="/TermsAndConditions">Terms and conditions</router-link> <router-view/>Eso es lo que está en mi paquete.json =>
"vue": "^2.6.12", "vue-loader": "^15.9.6", "vue-router": "2", "vue-template-compiler": "^2.6.12", "vue-turbolinks": "^2.2.2",Desafortunadamente, recibo este mensaje de error y realmente no sé qué hacer con él.
Failed to compile. ./app/javascript/router/index.js 13:15-27 "export 'createRouter' was not found in 'vue-router'Cualquier ayuda es bienvenida !!
Para proyectos Vue 2, debe llamar a Router.
import Router from 'vue-router'; const router = new Router({ ... }) export default routercreateRouter es para proyectos Vue 3 (Vue Router v4).
No puedo encontrar documentación para VueRouter2, pero en VueRouter3 tienes que hacerlo así:
import VueRouter from 'vue-router'; ... const router = new VueRouter({ mode: 'history', routes: [ { path: '/', component: Home }, { path: '/foo', component: Foo } ] })El código que envía como pregunta es para VueRouter4 que se usa con Vue3