Как я могу использовать npm для интерфейсных зависимостей?

Ответ 1

Короткий ответ: вид.

В значительной степени автору модуля рекомендуется поддерживать это, но это не так. Socket.io является примером такого поддерживающего модуля, как показано на их целевой странице. Однако есть и другие решения. Это два, о которых я действительно знаю:

• http://ender.no.de/ - Ender JS, самостоятельно описываемый аналог NPM для клиентских модулей. Немного слишком причастен к моим вкусам.
• https://github.com/substack/node-browserify - Browserify, утилита, которая будет отслеживать ваши зависимости и позволяет вывести один script путем эмуляции шаблона модуля node.js, Вы можете использовать jake | cake | rake | make build script, чтобы выплеснуть ваш application.js и даже автоматизировать его, если хотите получить фантазию. Я использовал это ненадолго, но решил, что он немного неуклюж, и стал раздражать, чтобы отлаживать. Кроме того, не все модули npm с двойным окружением любят запускаться через браузер.

Лично я в настоящее время предпочитаю использовать RequireJS (http://requirejs.org/) и вручную управлять своими модулями, подобно тому, как Mozilla делает это с примером приложения BrowserQuest (https://github.com/mozilla/BrowserQuest). Обратите внимание, что это связано с тем, что необходимо иметь потенциально модулирующие модули, такие как магистраль или подчеркивание, которые удалили поддержку загрузчиков модулей стиля AMD. Вы можете найти пример того, что задействовано в shimming: http://tbranyen.com/post/amdrequirejs-shim-plugin-for-loading-incompatible-javascript

Действительно, похоже, что это повредит, несмотря ни на что, поэтому поддержка родного модуля - такая горячая тема.

Ответ 2

+1 для использования Browserify. Мы используем его здесь на diy.org и любим его. Лучшее введение и аргументы в отношении Browserify можно найти в Справочник по обозревателю. Там рассматриваются темы, такие как решения CommonJS и AMD, сборка трубопроводов и тестирование.

Основная причина, по которой Browserify работает так хорошо, прозрачно работает с NPM. Пока модуль может потребоваться, его можно обозревать (хотя не все модули созданы для работы в браузере).

Основа:

npm install jquery-browserify

main.js

var $ = require('jquery-browserify');
$("img[attr$='png']").hide();

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

browserify main.js > bundle.js

Затем включите bundle.js в ваш HTML-документ и выполним код main.js.

Ответ 3

Наша команда поддерживает инструмент Lineman для создания интерфейсных проектов. Этот инструмент основан на node, поэтому проект опирается на множество модулей npm, которые работают на стороне сервера, чтобы создавать ваши активы, но из-за-коробки он рассчитывает найти ваши клиентские зависимости в скопированных и совершенных до vendor/js.

Однако группа людей (включая меня) попыталась интегрироваться с браузером, и мы столкнулись с множеством сложностей и проблем, начиная от (а) модулей npm, поддерживаемых третьей стороной, которые либо из дату или добавить нежелательные изменения, (b) фактические библиотеки, которые начинают сбой при загрузке традиционно, когда функция верхнего уровня с именем require определена даже из-за багажа AMD/Require.js.

Моя краткосрочная рекомендация состоит в том, чтобы удерживать и придерживаться хорошей консистенции script до тех пор, пока пыль не остынет. До тех пор, пока у вас не будет достаточно больших или сложных задач, чтобы оправдать его, я подозреваю, что вы потратите больше времени на отладку и исправление своей сборки, чем в противном случае. И я думаю, что большинство из нас согласны с тем, что наилучшее использование вашего времени сосредоточено на коде приложения, а не на его инструментах сборки.

Ответ 4

Я лично использую webmake для моих небольших проектов. Это альтернатива браузерированию в том, как он приводит зависимости npm в ваш браузер, и, по-видимому, легче.

У меня не было возможности подробно сравнить браузер и webmake, но я заметил, что webmake не работает с внутренними модулями, используя глобальные переменные, такие как socket.io(который по-прежнему наполнен IMO).

Я бы с осторожностью относился к RequireJS, который был рекомендован выше. Поскольку это загрузчик AMD, ваш браузер будет загружать ваши JS файлы асинхронно. Это вызовет больше обменов между вашим клиентом и сервером и может привести к ухудшению UX людей, просматривающих мобильные сети/в условиях плохого WiFi. Более того, если вам удастся сохранить ваш JS-код простым и крошечным, асинхронная загрузка абсолютно не нужна!

Ответ 5

Возможно, вы захотите взглянуть на http://jspm.io/, который является диспетчером пакетов браузера. Также имеет хорошую поддержку ES6.