使用vue-router意外导入令牌

Question

我想将我的Vue模板存储到变量中，这样我就可以路由它们。

我创建了一个只包含一个超文本标记语言标题的App.vue文件(用于测试目的)，以及一个带有'import‘命令的main.js文件，我从未在JavaScript中使用过这个命令，但我不知道有任何其他方法可以将模板文件的内容放入一个变量中，因为我知道每个文档都会这样做。

无论如何，使用这个'import‘命令，我得到了这个错误："Uncaught : Unexpected import“

下面是导入行："import App from '../vues/App';“

我检查了路径，没有问题，但如果您知道将模板文件的内容放入JS变量的任何其他方法，请让我知道。

感谢您的关注。

编辑: main.js

import App from '../vues/App';

new Vue({
    el: '#app',
    template: '<App/>',
    components: { App }
});

App.vue：

<template>
    <h1>Hello World!</h1>
</template>

<script>
    export default {}
</script>

Answer 1

您正在使用es6语法(导入)，而您的环境仅支持es5语法。因此，要么在您webpack中配置"babel“，要么使用请求而不是导入

var App = require( "../vues/App" );

更新:如果您没有安装模块捆绑程序，也可能会出现此错误，例如使用具有依赖关系的模块并生成表示这些模块的静态资产的Webpack。从这里安装：https://webpack.js.org/guides/installation/