题 如何将JavaScript文件连接到一个文件中?


我想为我的网站创建一个已编译的JavaScript文件。对于开发,我宁愿将JavaScript保存在单独的文件中,只是作为我的自动脚本的一部分将文件连接成一个并在其上运行压缩器。

我的问题是,如果我使用旧的DOS复制命令,它还会放入压缩器抱怨的EOF标记:

copy / A * .js compiled.js / Y.

其他人在做什么?


35
2017-11-19 10:13


起源


菲尔,从你对我的答案的评论,我现在可以看到你没有得到EOF标记(好吧,我得到一个带有副本,在结果文件的末尾)但确实是BOM,因为不知何故你已经编写了Unicode文件。将它们展平为Ascii,你应该摆脱它们。 - PhiLho
事实上,在我的一天中,我使用许多不同的语言在Windows,Linux和Mac上工作。 Unicode是我的常态。 - Phil Hannent


答案:


我建议使用Apache Ant和YUI Compressor。

http://ant.apache.org/

http://yui.github.com/yuicompressor/

在Ant build xml中添加这样的东西。 它将创建两个文件,application.js和application-min.js。

<target name="concatenate" description="Concatenate all js files">
    <concat destfile="build/application.js">
        <fileset dir="src/js" includes="*.js" />
    </concat>
</target>

<target name="compress" depends="concatenate" description="Compress application.js to application-min.js">
    <apply executable="java" parallel="false">
        <filelist dir="build" files="application.js" />
        <arg line="-jar" />
        <arg path="path/to/yuicompressor-2.4.2.jar" />
        <srcfile />
        <arg line="-o" />
        <mapper type="glob" from="*.js" to="build/*-min.js" />
        <targetfile />
    </apply>
</target>

35
2017-11-19 12:44



这提出了一个 Unexpected element "{}target" {antlib:org.apache.tools.ant}target 我的错误。有任何想法吗? - Jasdeep Khalsa
几年前我停止使用Ant。现在我使用Node来做这些事情。看看这个: mechanics.flite.com/blog/2012/06/19/... - David Brockman


要在没有EOF的情况下复制使用二进制模

copy /B *.js compiled.js /Y

如果生成的文件仍有EOF,则可能来自其中一个原始文件, 它可以通过以下变体修复:

copy /A *.js compiled.js /B /Y

/ A从原始文件中删除尾随EOF(如果有)和/ B阻止将EOF附加到生成的文件中。如果EOF不在最后,源文件将被截断。开关的顺序很重要。如果你写

copy /A *.js /B compiled.js /Y  

- 源文件中的EOF不会被删除,但仍然不会附加结果EOF。

自己尝试一下,这就是我得到它的地方。 DOS命令很奇怪。


11
2017-11-19 10:32



奇怪的是,/ B选项对我的文件没有任何影响 - Phil Hannent
我尝试了你的建议,但我仍然得到:作为文件加入的标记之间的标记...感谢您查看此内容。 - Phil Hannent
好像我明白了,是一个UTF8前缀字节。它应该在文件的最开头,否则它被视为数据并且您的编译器会对其进行投诉。这不是EOF问题。你不能使用副本。 - eugensk00


在asp.net AJAX中,您可以使用'CompositeScript'标记。这会将所有脚本合并为1个大js文件,通过减少http 304s和http 401s的数量来节省带宽。

样品:

 <asp:ScriptManager ID="ScriptManager1" runat="server">
        <CompositeScript>
            <Scripts>
                <asp:ScriptReference Path="~/Scripts/Script1.js" />
                <asp:ScriptReference Path="~/Scripts/Script2.js" />
                <asp:ScriptReference Path="~/Scripts/Script3.js" />
            </Scripts>
        </CompositeScript>
    </asp:ScriptManager>

有关详细信息,请参阅此处: http://msdn.microsoft.com/en-us/library/cc488552.aspx


6
2017-07-10 19:42





在您的机器上安装压缩机uglifyjs:

sudo npm -g install uglify-js

然后,以下命令可用于连接和压缩所有js文件。

cat myAppDir/*.js | uglifyjs > build/application.js

5
2017-07-14 05:11





我们创建了一个由以下部分组成的机制:

  • minfication(对于js和css)
  • 包中的聚合
  • 缓存(http状态304东西)
  • 在开发模式下发送原始文件

它可能对您的需求来说太多了,但是为了回答您的问题,其他人的行为是什么,以下是它的工作原理:

  1. 例如,请求进来 /css.aspx?package=core
  2. 我们在xml配置文件中查找packagename(其中 例如声明 包“core”包含文件 /js/mootools.js和 /js/swfobject.js)
  3. 我们检查是否启用了缩小。例如,在 我们没有开发环境 想要缩小的js内容 服务了,但改为写 原始文件。对于js,这已经完成了 通过document.writes脚本 包括,对于CSS,我们编写导入规则。
  4. 如果需要缩小(在生产环境中),我们会检查请求中的if-modified-since标头。如果此客户端已经有缩小的内容,我们发送http标头304.如果客户端确实需要内容,我们检查我们是否已在缓存中缩小内容并提供服务。否则,我们缩小并发送结果。

所有这些都在单独的服务中分解。在jsminificationwriter服务中注入了缓存服务。这利用了原始的minificationservice,它只关注缩小规则。

这种方法的好处是:

  • 它迫使我们的开发团队在js / css“包”中进行思考,从而正确地分解功能并将它们分发到需要它们的页面上。
  • 在开发过程中,您完全可以调试,获取正确的文件和行号。
  • 您可以连接任何其他缩小服务实现,例如YUI等。 JsMin只是我们的第一次拍摄。
  • 这是一种适用于不同内容类型的通用方法。

希望这可以帮助。如果你愿意,我可以发布一些代码片段来说明它。


4
2017-11-19 10:48





这是一个非常古老的问题,但我想提一下,还有一些方法可以使用javascript连接javascript!显然有nodejs ...例如,有像npm模块一样发布的工具 这个 还有 咕噜 和  插件也是。

我还想提到一个非常非常有趣的技术,它被用在像jQuery和Modernizr这样的大型项目中。这两个项目都完全使用requirejs模块开发,然后使用 requirejs优化器 作为一个非常聪明的连接器。有趣的是,正如你所看到的,jQuery和Modernizr都不需要requirejs工作,而这是因为它们删除了requirejs的合成仪式,以便在代码中摆脱requirejs。因此,他们最终得到了一个使用requirejs模块开发的独立库!由于这一点,他们能够执行其库的cutom版本,以及其他优点。 这里 是一篇博文,详细解释了所有这些。


4
2017-11-27 01:42





你也可以这样做:

type *.js > compiled.js

3
2017-11-19 11:39



我的设置一定有些奇怪,因为类型与复制方法完全相同: - Phil Hannent
BOM?你的文件是ANSI还是UTF? - GalacticCowboy
这就是答案 - jscripter