Объединение подчеркивания с jspm

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

import _ from "underscore"

var numbers = [1, 4, 6, 7, 9, 3, 22, 11, 54, 99, 100];
var evens = _.filter(numbers, x => x % 2 === 0);

document.getElementById('output').innerText = evens;

Это отлично работает в моей задаче gulp:

gulp.task('process-scripts', function(cb) {
    var builder = new Builder('Scripts', 'Scripts/config.js');
    builder.buildStatic('main.js', 'app/main.min.js', { minify: true });
    cb();
});

И с этим тегом сценария:

<script src="/app/main.min.js"></script>

Проблема в том, что я хочу вытащить подчеркивание в свой собственный скрипт. Поэтому я изменил свою задачу gulp на:

gulp.task('process-scripts', function(cb) {
    var builder = new Builder('Scripts', 'Scripts/config.js');
    builder.buildStatic('underscore', 'app/vendor.min.js', { minify: true });
    builder.buildStatic('main.js - underscore', 'app/main.min.js', { minify: true, globalDeps: {underscore: '_'} });
    cb();
});

При этом я получаю символ подчеркивания, извлеченный из основного пакета и помещаемый в пакет поставщика. В нижней части файла main.min.js пакет создает следующий код:

(function(factory) {
  factory(_);
});

И получаю ошибку: "Uncaught ReferenceError: _ не определено"

Я попробовал то же самое, используя jQuery вместо подчеркивания, и это сработало просто отлично. При просмотре кода я заметил, что при вызове кода в нижней части main в объекте окна было найдено $, поэтому ошибки не было.

Как я могу заставить основной модуль распознавать подчеркивание в сценарии поставщика?


person M Falanga    schedule 07.10.2015    source источник
comment
вы включаете app/vendor.min.js перед app/main.min.js? только приложение /vendor.min.js объявляет _ как глобальную переменную?   -  person Oleksii Rudenko    schedule 07.10.2015
comment
Да, тег сценария app/vendor.min.js стоит перед app/main.min.js. Файл vendor.min.js имеет только символ подчеркивания, который был установлен с помощью jspm install underscore. Он находится в объекте карты config.js как: .. ., map: {подчеркивание: npm:[email protected]}, ...   -  person M Falanga    schedule 07.10.2015


Ответы (1)


Если вы создаете самоисполняющийся пакет для npm:underscore, _ не добавляется к объекту окна. Поэтому ваш основной модуль не может получить к нему доступ ни через import _ from 'underscore', ни через window._.

Если вы хотите объединить свое приложение в отдельные модули, вам следует создавать только пакеты с помощью builder.bundle() в пользу самоисполняющихся пакетов. Таким образом, вы должны использовать system.js для загрузки ваших скриптов, но вы сможете получить доступ к пакету подчеркивания в вашем модуле приложения.

Например:

System.import('app/vendor').then(() => {
   System.import('app/main');
});
person brass monkey    schedule 14.10.2015
comment
Любая идея, почему _ не будет добавлен к объекту окна? jQuery $, кажется, добавляется просто отлично. Это как-то связано с тем, как упаковывается jQuery по сравнению с подчеркиванием? - person M Falanga; 15.10.2015
comment
Да. Когда вы смотрите на исходный код, вы видите, что jquery добавляется в окно при загрузке в среде браузера: if ( typeof noGlobal === strundefined ) { window.jQuery = window.$ = jQuery; } Также есть обсуждение, почему jquery делает это (github.com/jquery/jquery/pull/557). подчеркивание просто экспортирует _. Поэтому он должен быть импортирован явно. - person brass monkey; 15.10.2015