bower init - разница между amd, es6, глобалами и узлами

291

Я создаю свой первый компонент Bower. После запуска bower initсценария спрашивает меня «какие типы модулей предоставляет этот пакет?» с этими опциями:

драм
ES6
глобалы
узел

В чем разница между этими вариантами?

— pherris
источник

121

Если вы не знаете, вполне вероятно, что глобальные ответы - правильный ответ для вас.

В любом случае, вы должны понимать:

[ОБНОВИТЬ]

Эта функция была введена совсем недавно в беседке и еще не документирована (AFAIK). По сути, он описывает moduleType, в каком состоянии для какой модульной технологии предполагается использовать пакет (см. Выше).

Прямо сейчас, это не имеет никакого эффекта кроме установки moduleTypeсвойства в bower.jsonфайле пакета.

См. Https://github.com/bower/bower/pull/934 для оригинального запроса на извлечение.

[ОБНОВЛЕНИЕ № 2]

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

прямо сейчас AFAIK нет проверки на moduleTypeсобственность - это означает, что людям технически разрешено использовать любое значение, которое они хотят для него, в том числе, angularjsесли они чувствуют склонность сделать это
Комитет по беседе, похоже, не заинтересован в добавлении дополнительных non-interoperable/proprietary moduleTypes(например, композитора, ангуляров и т. д.) - что легко понять, но опять же, ничто не мешает людям использовать moduleTypeценность, которую они хотят
Исключением из предыдущего является (несколько) недавнее включение yui moduleType, поэтому есть «исключения», которые необходимо сделать, предполагая, что они являются частью согласованного плана.

Что бы я сделал, если бы написал пакет для менеджера пакетов, не включенного в список, и опубликовал бы его на bower?

Я хотел бы написать модуль es6 и использовать / patch es6-transpiler для вывода нужного мне формата пакета. Тогда я бы либо / и:

Прошу прощения, чтобы ребята включили мою технологию пакетов в качестве выбора (исходя из того факта, что она поддерживается es6-транспортером в качестве цели)
опубликуйте мой пакет, включающий в себя как его версию для модуля es6, так и версию XXX для трансплантации, и используйте его es6какmoduleType

Отказ от ответственности: у меня нет реального опыта создания модулей angularjs.

— Мангл Дойц
источник

4

будет ли глобальный правильный ответ для создания модуля / пакета AngularJS?

1

Я обновил свой пост, добавив дополнительные соображения по вопросу «что делать с неподдерживаемыми менеджерами пакетов» - но опять же, это поле не является обязательным или используется для чего-либо прямо сейчас - его значение является только информативным. Что касается angularjsсамо по себе, я мог бы использовать globals, да, но прочитать мое обновление. Надеюсь, это поможет.

— Изувеченный Deutz

Я использую узел. Означает ли это, что я выставляю модули узлов? Я также использую angular, который я устанавливал с помощью bower, когда заметил, что у меня есть сообщение о том, что у меня нет файла bower.json для сохранения, используйте bower init для его создания ». (Или, если это отдельный вопрос, я могу написать вопрос. Я подумал, что, возможно, этот комментарий уместен здесь, поскольку он относится к вашему ответу. Спасибо!)

— PrairieProf

27

начальный

Я использую bower initв первый раз тоже.

Параметры должны ссылаться на различные способы модуляции некоторого кода JavaScript:

amd: используя AMD define, как requirejs.
узел: с помощью Node.js require.
globals: использование шаблона модуля JavaScript для предоставления глобальной переменной (например, window.JQuery).
es6: использование новой функции модуля EcmaScript6.

В моем случае я написал модуль dflow Node.js, но я использую browserify для создания файла dist / dflow.js, который экспортирует глобальный переменный dflow : поэтому я выбрал глобальные переменные .

Другие обновления

Команда, которую я использовал, чтобы просмотреть dflow как глобальный объект окна, была

browserify -s dflow -e index.js -o dist/dflow.js

Я изменил его, потому что я предпочитаю использовать require и внутри браузера, так что теперь я использую

browserify -r ./index.js:dflow -o dist/dflow.js

и поэтому я изменил bower.moduleType на узел в моем файле bower.json .

Основная мотивация заключалась в том, что если в имени моего модуля есть тире, например, представление потока проекта , мне нужно вербализировать глобальное имя в flowView .

Этот новый подход имеет два других преимущества:

Узел и интерфейс браузера одинаковы. Использование require как на стороне клиента, так и на стороне сервера, позвольте мне написать только один раз примеры кода и легко использовать их в обоих контекстах.
Я использую сценарии npm и, таким образом, могу использовать ${npm_package_name}переменные и писать один раз сценарий, который я использую для просмотра.

Это еще одна тема, но действительно стоит задуматься о том, насколько полезно последнее преимущество: позвольте мне поделиться npm.scripts.browserifyатрибутом, который я использую в моем package.json.

"browserify": "browserify -r ./index.js:${npm_package_name} -o dist/${npm_package_name}.js"

— Gianluca Casati
источник

1

вы можете использовать require внутри define для ex:

define(function(require, exports, module) {   "use strict";    module.exports = {     Collection: require("./collection"),     View: require('./view')   }; });

— Doron Segal

7

Просто для справки, это именно то, что Бауэр указывает в отношении типов модулей:

Тип модуля, определенный в mainфайле JavaScript. Может быть одной или массивом из следующих строк:

globals: Модуль JavaScript, который добавляет в глобальное пространство имен, используя window.namespaceили this.namespaceсинтаксис

amd: Модуль JavaScript, совместимый с AMD, как и RequireJS , с использованием define()синтаксиса

node: Модуль JavaScript, совместимый с узлом и CommonJS с использованием module.exportsсинтаксиса

es6: Модуль JavaScript, совместимый с модулями ECMAScript 6 , использование exportи importсинтаксис

yui: Модуль JavaScript, совместимый с модулями YUI с использованием YUI.add()синтаксиса

Соответствующая ссылка: https://github.com/bower/spec/blob/master/json.md#moduletype

— Wtower
источник