Javascript 包括带有 html 和 node.js 的 js 文件

声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow 原文地址: http://stackoverflow.com/questions/14532071/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me): StackOverFlow

提示:将鼠标放在中文语句上可以显示对应的英文。显示中英文
时间:2020-08-24 17:07:47  来源:igfitidea点击:

including js files with html and node.js

javascripthtmlnode.jseval

提问by Metalskin

I am performing messaging via websockets between a HTML5 client and server running on node.js. Naturally I chose JSON as the message format and as such created common javascript code, defining the various message content types and transformation operations. The javascript code is shared between both projects.

我正在 HTML5 客户端和在 node.js 上运行的服务器之间通过 websockets 执行消息传递。当然,我选择 JSON 作为消息格式,因此创建了通用的 javascript 代码,定义了各种消息内容类型和转换操作。javascript 代码在两个项目之间共享。

I created my web client as one git project and my server as another git project. Partly because I am using phonegap to build a webkit based client for various touch based environments. It's also a nice separation of the various logic.

我将 Web 客户端创建为一个 git 项目,将我的服务器创建为另一个 git 项目。部分是因为我正在使用 phonegap 为各种基于触摸的环境构建基于 webkit 的客户端。这也是各种逻辑的一个很好的分离。

To share the common code I created a separate project for the common logic and used git's subprojects to 'import' the code into the other two projects.

为了共享公共代码,我为公共逻辑创建了一个单独的项目,并使用 git 的子项目将代码“导入”到其他两个项目中。

Now this works fine for the html5 based project, as I can just do the following to include the code:

现在这适用于基于 html5 的项目,因为我可以执行以下操作来包含代码:

<script src="common/js/comms.js" type="text/javascript"></script>

However with node I've had problems trying to get the code. to get the code, I've ended up doing the following:

但是,对于节点,我在尝试获取代码时遇到了问题。为了获得代码,我最终做了以下事情:

var fs = require('fs');
eval(fs.readFileSync('./common/js/comms.js').toString());

While the approach I have taken works, I've noticed that it's starting to get very messy when I have dependencies (as in, I need x.js, y.js and x.js if I want a.js), and I have to do it for every single node.js js file that wishes to use any of these entities.

虽然我采用的方法有效,但我注意到当我有依赖项时它开始变得非常混乱(例如,如果我想要 a.js,我需要 x.js、y.js 和 x.js),并且我必须为希望使用任何这些实体的每个 node.js js 文件执行此操作。

I'm also not comfortable using the evalapproach. I don't have a security issue with it, though I would like to use strict mode and it's my understanding that eval and strict mode go together like oil and water.

我也不习惯使用这种eval方法。我没有安全问题,尽管我想使用严格模式,我的理解是 eval 和严格模式就像油和水一样。

So my question is, what is the best method to include shared js files between html projects and node.js projects? I would prefer something that follows strict.

所以我的问题是,在 html 项目和 node.js 项目之间包含共享 js 文件的最佳方法是什么?我更喜欢严格遵循的东西。

I should note that while there are several questions that are kinda around this topic, I could not find any that address the specific issues I'm raising. I should also add that I do not wish to 'serve' the files from the 'server'. The HTML5 client is to be 'standalone'.

我应该指出,虽然有几个问题与这个主题有关,但我找不到任何解决我提出的具体问题的问题。我还应该补充一点,我不希望从“服务器”“提供”文件。HTML5 客户端是“独立的”。



To clarify, what I have in the 'common js files' is something like the following:

澄清一下,我在“常用 js 文件”中的内容如下所示:

var Comms = function (options) {
   ...
}

In HTML5 I can then just reference is via new Comms(), which is what I desire to do in node.js as well.

在 HTML5 中,我可以只引用 via new Comms(),这也是我希望在 node.js 中执行的操作。

采纳答案by Tyler Hughes

Have you researched how Node modules work? If you're developing using this pattern, it's fairly simple to use require('./common/js/comms')on the server while still including it on your client as well.

您是否研究过 Node 模块的工作原理?如果您正在使用这种模式进行开发,那么require('./common/js/comms')在服务器上使用它是相当简单的,同时仍然将它包含在您的客户端上。

This article should point you in the right direction: https://caolan.org/posts/writing_for_node_and_the_browser.html

这篇文章应该为您指明正确的方向:https: //caolan.org/posts/writing_for_node_and_the_browser.html



The following is the code that Tyler linked to in his comments below.

以下是 Tyler 在下面的评论中链接到的代码。

The example (example.js):

示例(example.js):

if(typeof exports == "undefined"){
    exports = this;
}

Example = function() {
    this.init();
};

Example.prototype = {
    init: function() {
         console.log('hello world');
    }
};

exports.Example = new Example();

The node.js usage of example.js (app.js):

example.js(app.js)的node.js用法:

example = require('./example');

The html usage of example.js (index.html):

example.js(index.html)的html用法:

<html>
    <head>
        <title></title>
    </head>
    <body>
        <script src="./example.js"></script>
    </body>

The change by the OP was to assign exports.Exampleto Exampleinstead of to an new instance. Thus the node.js logic can use the following:

OP 的更改是分配exports.ExampleExample而不是分配给新实例。因此 node.js 逻辑可以使用以下内容:

var Example = require('./example.js').Example;
var foo = new Example();

Thus the original question is solved.

这样原来的问题就解决了。

回答by talabes

Take a look at nodeJS modules.

看看nodeJS 模块

Would be in comm.js:

将在 comm.js 中:

module.exports = function(/* any dependency? */){
   // things
   // you can return some object
}

In the files you need comm.js

在你需要 comm.js 的文件中

require('./common/js/comm.js')();
// or you can assign it to a variable if it returned something

Hope that helps!

希望有帮助!