Как требовать модули CommonJS в браузере?

каков наилучший способ загрузки модулей CommonJS в качестве клиентского javascript в браузере?

модули CommonJS помещают свою функциональность в module.exports пространство имен и обычно включаются с помощью require(pathToModule) в сценарии на стороне сервера. Загрузка их на клиент не может работать одинаково (требуется замена, асинхронность должна учитываться и т. д.)

Я нашел загрузчики модулей и другие решения: Browserify, RequireJS, yabble и т. д. или способы просто измените модули. Что вы считаете лучше и почему?

6 ответов


Я использовал помощью RequireJS много в прошлом (реализация на Би-би-си iPlayer от в 2010 году) и он работает хорошо. Он может обрабатывать модули CommonJS, но ему нужна дополнительная обертка, которая меня раздражает. Если вы хотите использовать эти модули в узел.js также, вам нужно использовать requirejs на стороне сервера, что мне не нравится, так как это не идиоматический узел.в JS и JavaScript.

Я использовал webmake и browserify в прошлом году по нескольким проектам. Первоначально этап компиляции меня отпугнул, но, широко использовав его в этом году, я могу сказать, что это не проблема.

Browserify имеет функцию часов, которая работает очень хорошо. Webmake можно подключить к наблюдателю (например,watchr) или, вы можете использовать webmake-промежуточное модуль, который можно использовать как часть приложения express или connect. Это имеет то преимущество, что скорее чем компиляция JavaScript при каждом сохранении, он компилируется только тогда, когда вы его фактически запрашиваете. подключиться делает тривиальным создание сервера (также статического), поэтому вы можете создать крошечный статический узел.JS-сервер для обслуживания ваших файлов, если вы хотите разработать свой интерфейс без бэкэнда.

бонус: нет необходимости в скрипте сборки, поскольку вы всегда имеете дело со встроенным кодом.


вот полный список ваших текущих опций, упорядоченных по их соответствующей популярности (количество наблюдателей) на GitHub:

опции для использования require () в браузере (архив машины Wayback)


насчет Browserify? Его описание: "на стороне браузера требуется () для ваших модулей узлов и пакетов npm", что звучит так, как вам нужно.


Компилятор CommonJS https://github.com/dsheiko/cjsc Почему? Он отлично работает с модулями nodejs (CommonJs) /обрабатывает модуль точно так же, как nodejs/ и с UMD, приносит минимальный дополнительный код в скомпилированный JavaScript, позволяет экспортировать глобалы сторонних библиотек, не касаясь их кода, исходных карт и трюка, который другие не могут сделать:

var str = require( "lorem-ipsum.txt" );
console.log( str );

выход:

 Lorem ipsum dolor 
 sit amet, consectetur 
 adipiscing elit. Morbi...

здесь слайды https://speakerdeck.com/dsheiko/modular-javascript-with-commonjs-compiler


Webmake это один из вариантов. Я использую его для упаковки приложения, которое строится из более чем 200 модулей из более чем 20 пакетов. Это работает.

Если вы хотите увидеть какой-то пример, проверьте: Менеджер Плейлистов SoundCloud, это строго на стороне клиента и построено с Webmake


Не могу сказать, что я пробовал другие, которые вы перечислили здесь, но мне нравится RequireJS, потому что:

  • он работает аналогично CommonJS
  • легко использовать
  • он реализует некоторые из предстоящих новых стандартов
  • вы можете использовать его в NodeJS, чтобы вы могли использовать те же файлы на сервере и клиенте
  • Он включает в себя minifier / packer для развертывания в producion
  • Он имеет Плагины. Текстовый плагин, который позволяет загружать HTML файлы, очень полезно для больших приложений.