样板 Vue 项目在路由器链接和路由器视图上失败答案

【问题标题】：Boilerplate Vue Project Fails on router-link and router-view样板 Vue 项目在路由器链接和路由器视图上失败
【发布时间】：2019-05-28 18:11:36
【问题描述】：

我使用vue create 创建了一个带有 Babel、TypeScript、路由器和单元测试的新视图项目。然后我使用 npm 安装了 axios。

在没有进行其他更改的情况下，我通过导航到 src 目录并运行 vue serve 来为应用程序提供服务。

生成的样板应用程序无法加载并出现以下错误：

[Vue 警告]：未知的自定义元素：- 你注册了吗组件正确吗？对于递归组件，请确保提供“名称”选项。

发现于

---> 在 App.vue

我自己的研究表明，这个错误通常发生在你调用 Vue.Use() 失败时。但是，我的 router.ts 文件是这样做的：

import Vue from 'vue';
import Router from 'vue-router';
import Home from './views/Home.vue';

Vue.use(Router);

export default new Router({   routes: [
    {
      path: '/',
      name: 'home',
      component: Home,
    },
    {
      path: '/about',
      name: 'about',
      // route level code-splitting
      // this generates a separate chunk (about.[hash].js) for this route
      // which is lazy-loaded when the route is visited.
      component: () => import(/* webpackChunkName: "about" */ './views/About.vue'),
    },   ], });

有人知道这里有什么问题吗？鉴于我没有更改任何内容，这可能是配置问题吗？

【问题讨论】：

标签： vue.js

【解决方案1】：

您无需导航到src 文件夹，只需导航到应用程序的根目录，然后运行npm run serve。

【讨论】：

我最初尝试过，但出现以下错误：无法在 H:\Data\ApacheDocRoot\SoftAccounts\soft-accounts 中找到条目文件。有效的入口文件应该是以下之一：main.js、index.js、App.vue 或 app.vue。

【解决方案2】：

我明白了！

问题是我以错误的方式运行服务器。我正在使用：

vue serve src/App.vue

我应该在什么时候使用：

npm run serve

更改后，它开始起作用了。

【讨论】：

实际上我确实注意到了，但认为您可能在 vue.config.js 中有一个自定义的 npm run 命令，更新了我的答案。