vue-router: браузер пытается открыть <router-link> как локальный файл - PullRequest
Новая
       7

vue-router: браузер пытается открыть <router-link> как локальный файл

0 голосов
/ 27 марта 2019

Я новичок в Vue-router и не могу понять, что пошло не так.Нажатие на навигационную ссылку приводит к тому, что нужный компонент на мгновение отображается, но затем браузер пытается открыть компонент, как если бы это был файл.

Например, нажав «Badger!»ссылка приводит к тому, что браузер пытается открыть локальный файл с именем file:///home/travis/.../prototype/dist/badger, что, конечно, приводит к ошибке "файл не найден".

Есть какие-нибудь идеи по этому поводу?Я старался внимательно следовать существующим примерам.

main.js: 

import Vue from 'vue';
import App from './App.vue';
import VueRouter from 'vue-router';
import Badger from './component/Badger.vue';
import Grid from './component/Grid.vue';

Vue.use(VueRouter);

const router = new VueRouter({
  mode: 'history',
  base: __dirname,
  routes: [
    { path: '/badger', component: Badger },
    { path: '/grid', component: Grid },
  ]
});

new Vue({
  el: '#app',
  router,
  render: h => h(App),
});

App.vue 

<template>
    <div id="app">
        <ul>
            <li>
                <router-link to="/badger">Badger!</router-link>
            </li>
            <li>
                <router-link to="/grid">Data!</router-link>
            </li>
        </ul>
        <router-view></router-view>
    </div>
</template>

<script>
    export default {
        mounted() {
            console.log('mounted App component')
        },
        data() {
            // ...
            }
        },
    }
</script>

<style>
    // ...
</style>

1 Ответ

1 голос
/ 27 марта 2019

Когда маршрутизатор находится в режиме history, артефакты сборки должны доставляться в браузер с http-сервера, как упоминалось @bigless.

Если ваш рабочий процесс требует открытия артефакта сборки из локальной файловой системы, это можно сделать, если удалить эти строки из объявления маршрутизатора: 

  mode: 'history',
  base: __dirname,

Это переведет вас в "режим хеширования" (состояние по умолчанию). Ваш артефакт может быть загружен либо с http-сервера, либо с локальной файловой системы.

Соответствующие документы: https://router.vuejs.org/guide/essentials/history-mode.html

...