Javascript 如何组合5000+；将JS文件转换为单个JS文件以用于HTML标题部分？

我正在对一个11年前有人建立的传统网站进行现代化改造。问题在于，其中一个HTML页面的标题部分包含超过5000个JavaScript标记，如下所示：

HTML文件：

fs = require('fs');

for(i=0 ; i < 5000 ; i++){
    const currentFile = fs.readFileSync(`item${i}.js', 'utf8');
    fs.appendFileSync("fullVersion.js", "\n" + currentFile)
}

下面是item1.js（或任何itemX.js）的实际脚本的示例

item1.js:

fs = require('fs');

for(i=0 ; i < 5000 ; i++){
    const currentFile = fs.readFileSync(`item${i}.js', 'utf8');
    fs.appendFileSync("fullVersion.js", "\n" + currentFile)
}

dtHash['Item1']=“”+
“
项目A
”+
"    "+
"     "+
“
这里的一些文字毫无意义。
”+
“
”+
“项目1名称”+
""+
“废话废话
+
"";

我们可以看到一个名为

dtHash

的对象是在

中的HTML开头创建的，然后每个项目的JavaScript括号符号（例如，

dtHash['Item1']

用于布局模板

我的问题是……是否可以将所有5000多个JS（itemx.JS）文件合并成一个单一的简化JS文件，并且只在HTML标题部分执行一个http请求？我确实计划在不久的将来重新开发该网站，但需要一个关于如何提高页面性能的建议。

谢谢你的建议！

~~~~~~~~~

为什么不运行一个快速脚本来读取每个文件并将其附加到1文件中呢？您可以使用node.js在本地运行它，然后删除标记。只需确保文件的附加顺序相同，以避免依赖冲突。 node.js示例：无效代码建议：

fs = require('fs');

for(i=0 ; i < 5000 ; i++){
    const currentFile = fs.readFileSync(`item${i}.js', 'utf8');
    fs.appendFileSync("fullVersion.js", "\n" + currentFile)
}

fs=require（'fs'）；
对于（i=0；i<5000；i++）{
const currentFile=fs.readFileSync（`item${i}.js'，'utf8'）；
fs.appendFileSync（“fullVersion.js”，“\n”+currentFile）
}

~~~~~~~~~

编辑：

fs = require('fs');

for(i=0 ; i < 5000 ; i++){
    const currentFile = fs.readFileSync(`item${i}.js', 'utf8');
    fs.appendFileSync("fullVersion.js", "\n" + currentFile)
}

---

因此，正如@elazer所评论的，如果在不同的文件中使用相似的变量名和/或函数，这可能会导致非常有问题的逻辑冲突。您可能会开始考虑如何用脚本区分它们，但这将成为一项压倒性的任务，其他工具建议您可以更好更快地完成这项任务

是的，你可以把它们结合起来，但这不是最大的问题

最大的问题：变量名、函数名等会导致逻辑冲突。这个问题肯定已经发生了，特别是在

for loop

块中。分离该逻辑的一个好方法是创建名称空间来分离责任，即：

var FileOne = {
    process: function() {...}
}

var FileTwo = {
    process: function() {...}
}

FileOne.process();
.
.
.
FileTwo.process();

5000多个文件不能删除，必须为开发目的进行维护。连接它们的任务是Gulp、Grunt等必须以持续交付方式执行的步骤

我推荐以下资源：

fs = require('fs');

for(i=0 ; i < 5000 ; i++){
    const currentFile = fs.readFileSync(`item${i}.js', 'utf8');
    fs.appendFileSync("fullVersion.js", "\n" + currentFile)
}

• 这是为了持续交付，并便于执行任务以连接js文件

---

我说不出话来。我听到了。我想这是某种自动生成的CMS，不确定。疯狂！查看Gulp和

Gulp concat

以获得一种连接文件的非常简单的方法：-任务：旁注：这是香草JS，不是JQUERI我想他们的问题是问“快速脚本”是什么！是的，只是添加了一个小脚本示例：-）可能有在线解决方案，但可能是文件的数量（5000！！！）但是像我上面添加的例子那样在本地进行迭代在技术上应该很容易CPUwise不？不，这不是一个好方法。这项任务必须是连接js文件的管道的一个步骤。例如，Jenkins的一项任务，等等。@EleazarEnrique你是说构建一个流来最终保存完整的文件吗？@CodeAt30这是个问题m已经存在于这些js文件中。OP在提供一个好的解决方案方面面临着真正的挑战。