Question

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

我创建了一个仅包含HTML标题的App.vue文件（用于测试目的），以及一个带有'import'命令的main.js文件，我从未在JavaScript中使用过，但我不知道其他任何方式将模板文件的内容放入变量中，知道每个文档都是这样做的。

无论如何，使用这个'import'命令我收到此错误： “未捕获的SyntaxError：意外的令牌导入”

这是导入行：“从'../ 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”，要么使用require而不是import

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

更新：如果您没有安装模块捆绑包，也可能出现此错误，例如Webpack接受带有依赖项的模块并生成表示这些模块的静态资产。从这里安装：https://webpack.js.org/guides/installation/