Question

我已经使用vue-cli'vue init webpack-simple my-app'命令创建了一个新项目。在该全新安装副本中，我尝试将vue-router导入默认情况下创建的App.vue组件中。但这给我一个错误：'Uncaught ReferenceError: Vue is not defined'。如果我再次在App.vue中导入Vue，则该应用程序运行正常。但是我已经将vue导入了main.js中，那么为什么需要再次将其导入App.js中呢？有什么办法可以使用从main.js导入的vue？这是我的代码：

main.js：

import Vue from 'vue'
import App from './App.vue'

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

App.vue：

<template>
  <div id="app">
    <router-view></router-view>
  </div>
</template>

<script>
  import Vue from 'vue';   //**why I need to import it again? I already imported it in main.js
  import VueRouter from 'vue-router';
  Vue.use(VueRouter);

  import QuestionOne from './components/QuestionOneTemplate';

  const routes = [
    { path: '/', name: 'QuestionOne', component: QuestionOne },
  ];

  const router = new VueRouter({
    routes
  });

  window.router = router;

  export default {
    router,
    name: 'app',
    data () {
      return {
      }
    }
  }
</script>

<style lang="scss">
</style>

Answer 1

您尝试过这个吗？

import Vue from 'vue' import VueRouter from 'vue-router'

然后使用

Vue.use(VueRouter)

因为错误消息意味着您需要先导入vue才能使用vue-router

Answer 2

您做对了，您不必担心会在多个文件中导入Vue。运送应用程序并将其构建用于生产时，将只有一个“ Vue导入”。如果查看dist文件夹和捆绑的... 10:00:32 [INFO] --- javafx-maven-plugin:8.8.3:native (default-cli) @ javafx-gui --- 10:00:32 [INFO] Building Native Installers 10:00:32 [INFO] Add /Users/jenkins/workspace/(Mac) EasyClient dev CreateInstaller/./javafx-gui/target/jfx/app/config.xml file to application resources. ... 10:00:32 [INFO] Add /Users/jenkins/workspace/(Mac) EasyClient dev CreateInstaller/./javafx-gui/target/jfx/app/config.xsd file to application resources. 10:00:32 [INFO] Skipping 'Mac Application Image' because of configuration error 'Cannot determine which JRE/JDK exists in the specified runtime directory.' 10:00:32 Advice to fix: Point the runtime directory to one of the JDK/JRE root, the Contents/Home directory of that root, or the Contents/Home/jre directory of the JDK. 10:00:32 [INFO] Skipping 'DMG Installer' because of configuration error 'Cannot determine which JRE/JDK exists in the specified runtime directory.' 10:00:32 Advice to fix: Point the runtime directory to one of the JDK/JRE root, the Contents/Home directory of that root, or the Contents/Home/jre directory of the JDK. 10:00:32 [INFO] Skipping 'PKG Installer' because of configuration error 'Cannot determine which JRE/JDK exists in the specified runtime directory.' 10:00:32 Advice to fix: Point the runtime directory to one of the JDK/JRE root, the Contents/Home directory of that root, or the Contents/Home/jre directory of the JDK. 10:00:32 [INFO] Skipping 'Mac App Store Ready Bundler' because of configuration error 'Cannot determine which JRE/JDK exists in the specified runtime directory.' 10:00:32 Advice to fix: Point the runtime directory to one of the JDK/JRE root, the Contents/Home directory of that root, or the Contents/Home/jre directory of the JDK. 10:00:32 [INFO] Skipping 'WebStart JNLP Bundler' because of configuration error 'No OutFile Specificed' 10:00:32 Advice to fix: Please specify the name of the JNLP Outut file in 'jnlp.outfile' 10:00:32 [INFO] ------------------------------------------------------------------------ 10:00:32 [INFO] BUILD SUCCESS 10:00:32 [INFO] ------------------------------------------------------------------------ 10:00:32 [INFO] Total time: 5.919 s 10:00:32 [INFO] Finished at: 2018-09-11T10:00:32+02:00 10:00:32 [INFO] ------------------------------------------------------------------------ 10:00:32 Finished: SUCCESS文件，您会注意到Vue仅导入一次。

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

2 个答案: