如何将.js文件中的Vue对象导入html

Question

我正在使用Vue.js进行某些数据绑定和数据过滤。 我已经在.js文件中创建了Vue对象，我想将其导出，然后从html导入。

My object

我尝试用export default { testObject };导出，然后以html格式导入（我的文件在名为js /的文件夹中）。

<script type="module" src="js/testFile.js">

    var testObject = require('./js/testFile');

</script>

这似乎不起作用。

有没有办法做到这一点？

Answer 1

使用现代Javascript（export default和ES模块）功能的唯一方法是使用构建工具。

幸运的是，Vue已经有了它，并且它还具有单个文件组件。

https://cli.vuejs.org/

Answer 2

您正在使用ES6模块语法进行导出，并尝试使用commonjs模块进行导入。

您要导入类似这样的内容：

<script type="module">
import TestObject from '/js/testFile'
</script>

有关更多信息，请参见import documentation on MDN。