Vuejs - 未捕获的TypeError:无法重新定义属性:$ router

Mek*_*eng 3 javascript vue.js vue-router vuejs2

我对Vuejs比较新,我现在一直坚持以下错误:(当页面加载时出现)

未捕获的TypeError:无法重新定义属性:$.
  在函数
  .下的函数.defineProperty ()处于函数.(VM2179 vue-router.esm.js:526)
  处的函数.Vue.use(vue.js:4738)
  处的eval(VM2179 vue- router.esm.js:2447)
  at at ../ node_modules/vue-router/dist/vue-router.esm.js(VM2105 app.js:1615)
  at __webpack_require __(VM2105 app.js:712)
  at fn(VM2105) app.js:95)
  eval(VM2178 index.js:3)
  at Object ../ src/router/index.js(VM2105 app.js:2415)
  at __webpack_require__(VM2105 app.js:712)

这个问题似乎没有影响webapp的可用性,我很确定我不会多次声明Vue.use(路由器)......

这是我的index.js文件:(在src/router中)

import Vue from 'vue'
import Router from 'vue-router'
import Blog from '../components/Blog.vue'
import BlogPost from '../components/BlogPost.vue'

Vue.use(Router)
Vue.config.silent = true

export default new Router({
  routes: [
    {
      path: '/blog',
      name: 'Blog',
      component: Blog
    },
    {
      path: '/blog/:slug',
      name: 'Blog-post',
      component: BlogPost
    }
  ]
})
Run Code Online (Sandbox Code Playgroud)

app.ts :(在src,主入口点)

import Vue from 'vue'
import App from './App.vue'
import router from './router'
import store from './store/simple_store'
import '../assets/app.css'
import './assets/main_logo.css'
import './assets/pages/page_header_animation.css'

new Vue({
  el: '#app',
  router,
  store,
  render: h => h(App)
})
Run Code Online (Sandbox Code Playgroud)

请帮忙!谢谢!!

Mek*_*eng 7

解决了!

在我的index.html文件中,我再次导入了vue:

<!DOCTYPE html>
<html>
  <head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width,initial-scale=1.0">
    <title>Meko Deng</title>
  </head>
  <body>
    <div id="app"></div>
    <!-- <script src="https://cdn.jsdelivr.net/npm/vue@2.5.16/dist/vue.js"></script> -->
</body>
</html>
Run Code Online (Sandbox Code Playgroud)

评论说出来了!


Phi*_*hil 3

这是由于以下代码vue-router

if (inBrowser && window.Vue) {
  window.Vue.use(VueRouter);
}
Run Code Online (Sandbox Code Playgroud)

它实际上只在您将文件包含在<script>块中时才出现(即,没有构建系统)。

删除任何<script>与 Vue 或相关组件相关的元素;使用 Webpack 时不需要它们。