laravel 如何在 Vue 路由上使用多个组件
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/43109077/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
How to use multiple components on a Vue route
提问by Kim Prince
I am just starting out with Vue and am trying to use two components in a route - a navbar and some sales data. Laravel mix is bundling the assets with Webpack, and npm keeps failing.
我刚刚开始使用 Vue，并尝试在一个路由中使用两个组件 - 一个导航栏和一些销售数据。Laravel mix 正在将资产与 Webpack 捆绑在一起，而 npm 不断失败。
index.php
索引.php
<body>
<div id="app">
<router-view name="nav"></router-view>
<router-view></router-view>
</div>
<script src="{{ asset('js/app.js') }}"></script>
</body>
app.js:
应用程序.js：
import './bootstrap';
import router from './routes';
const app = new Vue({
el: '#app',
router
});
routes.js:
路线.js：
import VueRouter from 'vue-router';
import Sales from './views/employer/sales/Sales.vue';
import MainNav from './components/MainNav.vue';
let routes = [
{
path: '/sales',
components: {
default: Sales,
nav: MainNav
}
}
];
export default new VueRouter({
routes,
linkActiveClass: 'is-active'
});
Sales.vue
销售.vue
<template>
<p>This is the Sales view</p>
</template>
MainNav.vue
主导航
<template>
<p>This is the MAIN NAVIGATION</p>
</template>
The error message from npm is not particularly enlightening:
npm 的错误信息并不是特别有启发性：
Failed at the @ dev script 'node node_modules/cross-env/dist/bin/cross-env.js NODE_ENV=development node_modules/webpack/bin/webpack.js --progress --hide-modules --config=node_modules/laravel-mix/setup/webpack.config.js
It goes on to suggest that I should check I am running the latest node and npm (which I am).
它继续建议我应该检查我正在运行最新的节点和 npm（我是）。
What am I doing wrong? Curiously, before attempting to include the navigation component this way, I was registering it as a global component. It seemed to register fine, but whenever I included its element tag in a template, npm would fail in the same manner as above.
我究竟做错了什么？奇怪的是，在尝试以这种方式包含导航组件之前，我将其注册为全局组件。它似乎注册得很好，但是每当我在模板中包含它的元素标签时，npm 都会以与上面相同的方式失败。
回答by Kim Prince
Looks like node somehow became confused. I removed the node_modules directory and reinstalled it and its all good.
看起来节点不知何故变得困惑。我删除了 node_modules 目录并重新安装了它，一切都很好。
