我有一个正在运行的 Node.js 服务器,其中有一个静态内容文件夹。我有模型代码,我希望服务器和客户端都有,所以我将其放在静态内容文件夹中。我用过module.exports = {MyClass}
这样在服务器上,我可以使用 const MyClass = require('./static-content/MyClass.js');
导入它。这适用于服务器,但是客户端无法执行 require
如果我将脚本放在 html 中 <script language="javascript" src="MyClass.js" > </script>
,然后我收到错误:
ReferenceError: module is not defined
有没有办法让客户端和服务器都使用 JavaScript 文件而不创建模型代码的重复项?上下文是我在服务器上有一个对象需要在服务器和客户端之间来回传递。由于它具有循环引用和函数,我不能简单地 JSON.stringify
对象,因此我手动获取它的状态,将其转换为 JSON 对象,通过 WebSocket 发送它并在客户端上反转它。
最佳答案
您可以简单地检查范围内是否存在module
。如果是,则将其导出,否则什么都不做。考虑以下示例:
静态/Testclass.js
class TestClass {
constructor(someParam = 'initial state') {
this.someField = someParam;
}
doStuff() {
return `${this.someField}`;
}
}
const testClassInstance = new TestClass('some other state');
if (typeof (module) !== 'undefined' && module.exports) {
module.exports = {
TestClass,
testClassInstance
};
}
静态/test.html
<!DOCTYPE html>
<head>
<script src="/static/TestClass.js"></script>
</head>
<body>
<p id="test"></p>
<p id="test2"></p>
<script>
document.getElementById("test").innerText = new TestClass().doStuff();
document.getElementById("test2").innerText = testClassInstance.doStuff();
</script>
</body>
服务器.js
const TestClass = require('./static/TestClass').TestClass;
const testClassInstance = require('./static/TestClass').testClassInstance;
let testObj = new TestClass();
console.log(testObj.doStuff());
console.log(testClassInstance.doStuff());
const express = require('express')
const app = express()
const port = 3000
app.use('/static', express.static('static'));
app.listen(port);
这会记录
initial state
some other state
服务器启动时到控制台,html页面上的两个段落也将包含这些内容。
关于javascript - 在客户端和nodejs服务器上使用静态javascript文件,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/55460636/