我正在创建.vue组件文件，以从SPA的index.html文件中删除模板。在我将第一个组件移动到一个单独的文件后，我在控制台中得到了这个错误：Uncaught SyntaxError: Cannot use import statement outside a module。我没有使用webpack、browserify-babel或类似的工具，我只是使用javascript。我如何解决这个问题并在应用程序的主javascript文件中导入单个文件组件？
只需使用常规JavaScript文件，.vue文件仅通过vue-cli支持，因为它们是编译的。这个解决方案很有效，允许您将逻辑拆分到多个文件上，就像使用.vue模板一样。
index.html
<head>
<!-- TODO: your imports here... -->
<script src="path/to/MyComponent.js"></script>
</head>
<body>
<div id="app">
<my-component></my-component>
</div>
<script>
new Vue({
el: '#app'
});
</script>
</body>
MyComponent.js
const MyComponent = Vue.component('my-component', {
data () {
// Your data here...
},
methods: {
// Your methods here...
},
template: '<p>Hello, world!</p>'
});
更多信息可以在这里找到。