Как использовать Browserify с внешними зависимостями?

Я пытаюсь медленно вводить Browserify на свой сайт, но я не хочу переписывать все js, и я не хочу дублировать экземпляры jquery и других библиотек в комплекте с моей сборкой Browserify.

Если я создам свой модуль, перечисляющий jquery как внешнюю зависимость, как я могу указать его на мой глобальный экземпляр jquery? Также цель состоит в том, чтобы исключить глобальный mylibs (пример ниже), поэтому я не хочу использовать его в своем модуле.

Это то, что я пытаюсь сделать (psudo-code). Это будет в моем репозитории сайта, а не в модуле. Модуль будет установлен с Bower:

var mylibs.jQuery = $.noConflict(); // global used by lots of existing code
module.exports = {
    jquery: mylibs.jQuery // can be imported by my module as require('jquery')
};

Что-то вроде того, чего я пытаюсь достичь. Возможно ли это?

Ответы

Ответ 1

Вы можете добиться этого, используя browserify-shim. Предполагая, что у вас есть модуль с именем mymodule.js, который зависит от jQuery в глобальной области со следующим содержимым:

var $ = require('jQuery');

console.log(typeof $);

  • Установить прокрутку браузера:

    npm install browserify-shim --save-dev

  • В файле package.json скажите браузеру, чтобы использовать browserify-shim как преобразование:

    {
    "browserify": {
        "transform": [ "browserify-shim" ]
    }
}

  • В файле package.json скажите браузеру-shim сопоставить jQuery с jQuery в глобальной области:

    {
    "browserify-shim": {
        "jQuery": "global:jQuery"
    }
}

  • Запустите браузеру

    browserify mymodule.js > bundle.js

Если вы посмотрите на bundle.js, вы заметите, что require('jQuery') заменяется на (window.jQuery).

Ответ 2

Browserify-shim не является транзитивным в модулях node: его можно использовать для правильного выравнивания модулей верхнего уровня (в вашем собственном пакете .json), но он не может модулировать модули в других пакетах npm (с их собственным пакетом. json).

Это неудобно при работе с модулем node, который зависит от модуля jQuery (например, плагина, который имеет одноранговую зависимость), но библиотека jQuery должна оставаться внешней.

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

  • Исключить модуль jquery из поколения bundle.js, но в противном случае построить пакет обычно.

    Установите соответствующие модули node/npm для соответствия требованиям сборки. "Внешние" модули, подлежащие исключению, не будут включены в комплект, но должны соответствовать разрешению зависимостей компиляции.

    browserify -x jquery .. > dist/bundle.js

  • Создайте файл с именем jquery.js и включите этот контент:

    module.exports = window.jQuery; // or whatever

  • Создайте shim.js, содержащий только предыдущий файл.

    browserify -r jquery.js > dist/shim.js

    Затем отредактируйте файл, чтобы использовать jQuery в качестве имени модуля.

  • В браузере загрузите jquery (внешняя зависимость), shim.js, а затем bundle.js.

    Когда файл пакета пытается загрузить модуль jquery, который он не определяет, он будет отвисеть от модуля (ранее), определенного в файле шифра, и запускать собственный код. В этом случае этот трубопровод через ранее определенный глобальный.

    Или: какой браузер-прокси-сервер "глобально": "пытается сделать, только на самом деле.. глобально.

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