Javascript 无法访问HTML中的外部JS函数

Javascript 无法访问HTML中的外部JS函数,javascript,html,node.js,module,philips-hue,Javascript,Html,Node.js,Module,Philips Hue,您好,我尝试用HTML和JS为我的Philips Hue Lights和huejay()编写自己的GUI 当我尝试在HTML文件中的按钮上使用my main.JS中的JS函数“LightOn()”时,出现错误: “未捕获引用错误:未定义LightOn onclickfile:///C:/Users/noName/Desktop/Hue/index.html:1" 当我使用Message.js中“Message()”的确切代码时,它工作正常 我转换了让huejay=require('huejay'

您好,我尝试用HTML和JS为我的Philips Hue Lights和huejay()编写自己的GUI

当我尝试在HTML文件中的按钮上使用my main.JS中的JS函数“LightOn()”时,出现错误: “未捕获引用错误:未定义LightOn onclickfile:///C:/Users/noName/Desktop/Hue/index.html:1"

当我使用Message.js中“Message()”的确切代码时,它工作正常

我转换了
让huejay=require('huejay')
从“huejay”导入{huejay}这是正确的吗?我知道main.js中的导入huejay有问题,但我不知道如何正确处理。我试图在标签上设置type=“module”

当我从终端手动运行代码时,一切正常,我的灯亮起

请帮忙

这是我的密码:

index.html

<!DOCTYPE html>
<html lang="de">
  <head>
    <meta charset="utf-8">
    <title>Hue Lights</title>
  </head>
  <body>
    <script type="module" src="main.js"></script>
    <button onclick="LightOn()">Light On!</button>

    <script type="text/javascript" src="message.js"></script>
    <button onclick="Message()">TEST</button> 
  </body>
</html>
message.js

function Message() {
    alert('External JS loaded');
}

在LightOn()前面添加导出:

阅读更多:

在LightOn()前面添加导出:

阅读更多:

js文件是否从浏览器加载?您应该从本地Web服务器为您的文件提供服务器。你有没有使用像webpack这样的模块绑定器?没有,我没有使用任何绑定器。我将尝试使用webpack。谢谢,js文件是否从浏览器加载?您应该从本地Web服务器为您的文件提供服务器。你有没有使用像webpack这样的模块绑定器?没有,我没有使用任何绑定器。我将尝试使用webpack。谢谢你的帮助。我尝试导出,但仍然出现相同的错误。尝试将脚本类型更改为“text/javascript”,而不是模块。只是想看看是否出现另一个错误。您已将脚本声明为Module类型,但没有在任何地方导入它。那可能是你的问题。您需要这样的东西:从'main.js'导入{LightOn};然后你还需要我之前写过的导出,比如:
import{LightOn}from'main.js'?您是否尝试将脚本类型更改为“text/javascript”而不是模块?嘿,谢谢您的帮助。我尝试导出,但仍然出现相同的错误。尝试将脚本类型更改为“text/javascript”,而不是模块。只是想看看是否出现另一个错误。您已将脚本声明为Module类型,但没有在任何地方导入它。那可能是你的问题。您需要这样的东西:从'main.js'导入{LightOn};然后你还需要我之前写过的导出,比如:
import{LightOn}from'main.js'?您是否尝试将脚本类型更改为“text/javascript”而不是模块?
function Message() {
    alert('External JS loaded');
}
export function LightOn()