导入vue-router时显示Vue未定义错误

作者: ℘ 宋唐 ℒº ѵ ℯ楚厦
发布时间: 2025-01-02 11:55:51 (29天前)
转自：

4 条回复

0#
回复此人
NetworkAttachedStorage | 2019-08-31 10-32

<div class =“post-text”itemprop =“text”> <P> 你试过这个吗？ </p> <P> <code> import Vue from 'vue' import VueRouter from 'vue-router' </code> </p> <P> 然后用 </p> <P> <code> Vue.use(VueRouter) </code> </p> <P> 因为错误消息意味着您需要先导入vue才能使用vue-router </p> </DIV>

编辑
1#
回复此人
蜡笔小辛 | 2019-08-31 10-32

<div class =“post-text”itemprop =“text”> <BLOCKQUOTE> <P> 有什么办法可以使用main.js中导入的vue吗？ </p> </BLOCKQUOTE> <P> 不，您需要在每个使用的文件中导入它 <code> Vue </code> 。进口/需求是事物如何联系起来的。请放心，每次导入都是相同的单例实例。 </p> <P> 您可以使用Vue组件的javascript访问路由器 <code> this.$router </code> 和 <code> this.$route </code> 没有导入，或在模板内，简单地使用 <code> $router </code> 和 <code> $route </code> </p> <P> 不推荐，但是你的<strong> 能够 </强> 将Vue分配给main.js中的全局，并使用全局而不导入。 </p> <P> main.js </p> <pre> <code> import Vue from 'vue'; global.MyVue = Vue </code> </pre> <P> App.vue </p> <pre> <code> import VueRouter from 'vue-router'; MyVue.use(VueRouter); </code> </pre> <H1> 为什么 </H1> <P> 这就是ES6如何联系起来的。考虑一下 <code> wiring </code> 。如果有超过1个Vue lib可用，链接器将如何知道使用哪个？如果另一个库定义了一个名为Vue的变量或函数怎么办？也许lib使用自己的内部Vue作为事件总线或其他功能。 </p> <H1> 其他想法 </H1> <P> 显式导入还使IDE自动完成和语法突出显示更好。有些IDE可以自动添加导入，这使生活更轻松。 </p> </DIV>

编辑
2#
回复此人
林老爷的日常 | 2019-08-31 10-32

<div class =“post-text”itemprop =“text”> <P> 你做了正确的事情，你不必担心在多个文件中导入Vue。当您运送应用程序并将其构建用于生产时，您将只有一个“Vue导入”。如果你看看dist文件夹和你的捆绑 <code> .js </code> 文件你会注意到Vue只导入一次。 </p> </DIV>

编辑

登录后才能参与评论