Как объединить файлы JavaScript в один файл?

Для копирования без 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 странные.

Мы создали механизм, состоящий из следующих частей:

• minfication (для js и css)
• агрегирование в пакеты
• кеширование (HTTP статус 304 материал)
• отправка исходных файлов для в режиме разработки

Это может быть слишком много для ваших нужд, но чтобы ответить на ваш вопрос, что делают другие, вот как это работает:

1. Запрос приходит, скажем, /css.aspx?package=core
2. Мы ищем имя пакета в файле конфигурации xml (который например, заявляет, что пакет "core" содержит файлы /js/mootools.js и /js/swfobject.js)
3. Проверяем, включена ли минификация. Например, в среда разработки мы не хотите, чтобы минимизированное содержимое js было подано, но вместо этого напишите оригинальные файлы. Для js это сделано по документу. написанию сценария включает, а для css пишем правила импорта.
4. Если требуется минификация (в производственной среде), мы проверяем заголовок if-modified-Since из запроса. Если у этого клиента уже есть минимизированное содержимое, мы отправляем HTTP-заголовок 304. Если клиенту действительно требуется содержимое, мы проверяем, есть ли минимизированное содержимое в кеше, и обслуживаем его. В противном случае мы минимизируем и отправляем результат.

Все это разбито на отдельные службы. В службу jsminificationwriter внедрена служба кеширования. При этом используется исходная служба минификации, которая заботится исключительно о правилах минификации.

Что хорошо в этом подходе:

• Это заставляет наши команды разработчиков думать о «пакетах» js / css и, следовательно, должным образом разделять функциональность и распределять ее по страницам, которые в них нуждаются.
• Во время разработки вы прекрасно можете отлаживать, получая нужные файлы и номера строк.
• Вы можете подключить любую другую реализацию службы минификации, такую ​​как YUI и т. д. JsMin был только нашим первым дублем.
• Это общий подход, который работает для разных типов контента.

Надеюсь это поможет. Я могу опубликовать несколько фрагментов кода, чтобы проиллюстрировать это подробнее, если хотите.

Вы также можете:

type *.js > compiled.js

Я рекомендую использовать 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>

Буду второй юикомпрессор, но использую / packer /

http://johannburkard.de/blog/programming/javascript/automate-javascript-compression-with-yui-compressor-and-packer.html

Для меня это было действительно отлично.

В asp.net AJAX вы можете использовать тег CompositeScript. Это скомбинирует все ваши скрипты в 1 большой файл js, сэкономив пропускную способность за счет уменьшения количества http 304 и, возможно, http 401.

Образец:

 <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

Вы также можете попробовать wro4j (оптимизатор веб-ресурсов для java), который можно использовать как инструмент сборки (плагин maven), решение времени выполнения (с использованием фильтра) или инструмент командной строки. Это позволяет вам легко организовывать ресурсы и обрабатывать объединение за вас с помощью десятка компрессоров для ресурсов типов ботов: js и css.

Определить объединяемые ресурсы очень просто:

<groups xmlns = "http://www.isdc.ro/wro">
  <group name = "all">
    <css>/asset/*.css</css>
    <js>/asset/*.js</js>
  </group>
</groups>  

Отказ от ответственности: я являюсь ответственным за этот проект.

Установите компрессор uglifyjs на вашу машину:

sudo npm -g install uglify-js

Затем можно использовать следующую команду для объединения и сжатия всех файлов js.

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

Это очень старый вопрос, но я хочу упомянуть, что есть также способы объединить javascript с помощью javascript! с nodejs, очевидно ... Например, есть инструменты, опубликованные как модули npm, такие как это, а также плагины хрюкать и глоток.

Я также хочу упомянуть очень, ОЧЕНЬ интересную технику, которая используется в таких огромных проектах, как jQuery и Modernizr. Оба этих проекта полностью разработаны с использованием модулей requirejs, а затем они используют оптимизатор requirejs как очень умный конкатенатор. Интересно то, что, как видите, ни jQuery, ни Modernizr не нуждаются в requirejs для работы, и это происходит потому, что они стирают синтаксический ритуал requirejs, чтобы избавиться от requirejs в своем коде. Таким образом, у них получается отдельная библиотека, разработанная с помощью модулей requirejs !. Благодаря этому они, помимо других преимуществ, могут выполнять сборку своих библиотек сокращенно. Здесь - это сообщение в блоге, в котором все это объясняется более подробно.

Я знаю, что это очень старый вопрос, но для полноты я упомяну вариант использования Browserify. Он позволяет вам строить ваш проект как разные модули, используя функцию NPM require для разрешения зависимостей, а затем он разрешает эти зависимости и объединяет весь ваш проект в один файл.

Например, предположим, что ваш проект называется FooBar, и вы хотите вывести файл с именем foobar.js. Вы должны создать файл main.js в качестве точки входа для проекта, требуя все модули, которые должны быть включены.

main.js

require("./doFoo");
require("./doBar");

Затем запустите:

browserify main.js -o foobar.js

Или, чтобы делать это автоматически каждый раз при изменении исходного файла, вы также можете использовать Смотреть.

watchify main.js -o foobar.js

Browserify также разрешит зависимости между модулями. Так, например, если doBar.js зависит от doQux.js ...

doBar.js

require("./doQux");
const doBar = ()=>{
    //Do some bar stuff.
}
exports.doBar = doBar;

Затем Browserify обязательно включит doQux.js в foobar.js, чтобы у вас не было сломанных зависимостей.