将一个 JavaScript 函数导入到 HTML 中？

Question

我有一个名为 'test.js' 的JavaScript文件，其中包含以下代码片段;

function functionTest() {
    console.log('this works');
}

我在一个blade.php文件中的HTML头部导入了test.js，代码如下：

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

最后，在HTML的body部分的脚本标签中，我使用functionTest进行调用。

<script>
    functionTest()
</script>

然而我从来没有获得console.log。相反，这个错误是由我的HTML引发的：

未捕获的引用错误：functionTest未定义<

- ThirdGhostHand

Answer 1

您的<script>标签正在将JS文件作为模块进行导入。

因此，它必须被视为一个模块，例如，您需要导出某些内容，并在主文件中导入才能使用它。

如果您只想原样使用它，而不需要模块化工作，请从<script>标签中删除type="module"。

- Dave Newton

Answer 2

导出你的函数：

const functionTest = () => {
console.log('this works')};

导出默认的函数Test;

然后你可以将其作为模块进行导入。

- Eivydas Gricius

---

谢谢。这是几年前的事了。 - ThirdGhostHand

没问题，作为一个新手我也曾经搜索过类似的东西，所以觉得或许其他人也会觉得有用。哈哈 - Eivydas Gricius