JS模块在声明时投掷错误

发布于 2025-01-20 03:07:44 字数 1729 浏览 3 评论 0原文

我有一个网页（.ejs），它调用一个单独的文件来包含必要的 JS，如下所示：

<html lang="en">
  <head>

  //stuff

  </head>
  <body>

  //stuff

  <script type="module" src="/public/js/p2p_logic.js"></script>                            
  
  </body>
</html>

相应的 JS 如下所示：

//p2p_logic.js

addEventListener("load", connect);
addEventListener("load", initialize);

//stuff

function connect() {
console.log("FIRED CONNECT");    
}  //connect()

function initialize() {
console.log("FIRED INITIALIZE");
import WebRTCAdaptor from "./public/js/webrtc_adaptor.js"        
}  //initialize()

可以看出，JS 文件调用“导入”。我很难让它发挥作用。我以前从未在 JS 脚本文件（附加到 HTML/EJS 页面）中使用过“导入”。如上所述，我收到此错误：

Uncaught SyntaxError: Unexpected identifier  p2p_logic.js:27

我还尝试使用“大括号”，如下所示：

import {WebRTCAdaptor} from "./public/js/webrtc_adaptor.js"

但这似乎没有效果。如果我将 JS 文件的第一行修改为“导入”，如下所示：

//p2p_logic.js

import WebRTCAdaptor from "./public/js/webrtc_adaptor.js"   

addEventListener("load", connect);
addEventListener("load", initialize);

//stuff

function connect() {
console.log("FIRED CONNECT");    
}  //connect()

function initialize() {
console.log("FIRED INITIALIZE");
}  //initialize()

这会引发 404 错误...这表示“找不到文件”。具体来说：

Failed to load resource: the server responded with a status of 404 ()  webrtc_adaptor.js:1

这是废话，因为该文件肯定位于“./public/js”目录中...“webrtc_adapter.js”文件与“p2p_logic.js”文件位于同一目录中...但我是使用绝对路径结构，所以我不明白这有什么关系......？

我开始认为不可能以这种方式执行文件的“导入”...我以前从未遇到过将外部 JS 文件与 HTML/EJS 页面结合使用的问题...但是在那些我从未使用过“导入”声明。

有谁知道是否可以使用附加到 HTML/EJS 页面的外部 JS 文件来“导入”？

原文

I have a webpage (.ejs) that calls a separate file to contain the necessary JS, as here:

<html lang="en">
  <head>

  //stuff

  </head>
  <body>

  //stuff

  <script type="module" src="/public/js/p2p_logic.js"></script>                            
  
  </body>
</html>

With the corresponding JS as here:

//p2p_logic.js

addEventListener("load", connect);
addEventListener("load", initialize);

//stuff

function connect() {
console.log("FIRED CONNECT");    
}  //connect()

function initialize() {
console.log("FIRED INITIALIZE");
import WebRTCAdaptor from "./public/js/webrtc_adaptor.js"        
}  //initialize()

As can be seen, the JS file calls an 'import'. I am having great difficulty getting this to be operative. I have never used an 'import' within a JS script file (attached to an HTML/EJS page) before. As written above, I am receiving this error:

Uncaught SyntaxError: Unexpected identifier  p2p_logic.js:27

I have also attempted to use 'curly' brackets, as here:

import {WebRTCAdaptor} from "./public/js/webrtc_adaptor.js"

However this seems to have no effect. If I modify the JS file to 'import' on the initial line, as here:

//p2p_logic.js

import WebRTCAdaptor from "./public/js/webrtc_adaptor.js"   

addEventListener("load", connect);
addEventListener("load", initialize);

//stuff

function connect() {
console.log("FIRED CONNECT");    
}  //connect()

function initialize() {
console.log("FIRED INITIALIZE");
}  //initialize()

This throws a 404 error...which indicates a 'file not found'. Specifically:

Failed to load resource: the server responded with a status of 404 ()  webrtc_adaptor.js:1

That however is BS since the file is definitely in the './public/js' directory...the 'webrtc_adapter.js' file is in the same directory as the 'p2p_logic.js' file...but I am using an absolute path structure so I don't see how that would matter...?

I am beginning to think it is not possible to perform an 'import' of a file in this manner...I have never had an issue using an external JS file in conjunction with a HTML/EJS page before...however in those cases I never made usage of an 'import' statement.

Does anybody know if it is even possible to 'import' using an external JS file attached to a HTML/EJS page?

分享到QQ

分享到微博