Angular: Пакет UMD нельзя использовать для RxJS

Созданный на 20 июн. 2016  ·  111Комментарии  ·  Источник: angular/angular

Я отправляю ... (отметьте "x")

[x] bug report
[ ] feature request
[ ] support request => Please do not submit support request here, instead see https://github.com/angular/angular/blob/master/CONTRIBUTING.md#question

Текущее поведение
Я обновил файл system-config.ts, чтобы загрузить файл umd для rxjs, т.е. rxjs \ bundles \ Rx.umd.js. Это сработало. Но я все еще вижу в инструментах разработки много отдельных JS, которые загружаются, например rxjs \ Observer.js.

Ожидаемое / желаемое поведение
При использовании UMD для rxjs не следует загружать отдельные файлы

Воспроизведение проблемы
Посмотрите на этот плункер, когда вы запускаетесь в полноэкранном режиме и наблюдаете, как файлы загружаются в инструментах разработчика. http://plnkr.co/edit/TvjW2YK3NVJ7sDb7cHV4?p=preview

Нет ответа сообщества на вопрос: http://stackoverflow.com/questions/37881825/using-rxjs-umd-bundles

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

Какова мотивация / вариант использования для изменения поведения?
Чтобы уменьшить запрос нагрузки при запуске приложения angular

Расскажите, пожалуйста, о вашей среде:

  • Угловая версия: 2.0.0-rc.2
  • Браузер: [все | Хром XX | Firefox XX | IE XX | Safari XX | Мобильный Chrome XX | Веб-браузер Android XX | iOS XX Safari | iOS XX UIWebView | iOS XX WKWebView]
    Проверено только на хроме
  • Язык: [все | TypeScript XX | ES6 / 7 | ES5 | Дарт]
    Протестировано только с помощью Typescript
packaging bufix

Самый полезный комментарий

Чтобы решить эту проблему, нам нужно самостоятельно сгенерировать пакет Rx SystemJS

const Builder = require("systemjs-builder");
// SystemJS build options.
var options = {
    normalize: true,
    runtime: false,
    sourceMaps: true,
    sourceMapContents: true,
    minify: false,
    mangle: false
};
var builder = new Builder('./');
builder.config({
    paths: {
        "n:*": "node_modules/*",
        "rxjs/*": "node_modules/rxjs/*.js",
    },
    map: {
        "rxjs": "n:rxjs",
    },
    packages: {
        "rxjs": {main: "Rx.js", defaultExtension: "js"},
    }
});

builder.bundle('rxjs', 'node_modules/.tmp/Rx.js', options),

Это сгенерирует пакет, готовый к использованию SystemJS.

Вставить <script src="node_modules/.tmp/Rx.js"></script> в HTML

Таким образом, любые операторы импорта rxjs/* (например, import rxjs/Observable ) не вызовут более 50 запросов от SystemJS.

`` `` ` **Important**! In your systemjs.config should be nothing related to rxjs`, если будет
Например:

map = {
     "rxjs": "n:rxjs",
};

Это вызовет снова 50+ запросов ...
`` `` `

Все 111 Комментарий

+1. У меня была такая же проблема

Существует прямой импорт подмодуля Rx в @ anguard / http, который может привести к этой проблеме. Если @ angular / http начинают использовать rxjs из модуля umd, это может быть решено.

@robwormald это может быть более

Одно из решений, которое я придумал, - это загрузка Rx.umd.js через тег скрипта и удаление всех записей, связанных с RxJS из system-config .
Это может решить вашу проблему.

@pavandv Это решение, похоже, не работает; systemjs все еще пытается загрузить отдельные файлы сценариев.

@pavandv @jalkanen, тогда вам нужно будет получить доступ к rxjs через window.Rx, верно?

Есть ли что-то новое, связанное с проблемой использования пакета RxJS?

Есть ли обходной путь, пока проблема не будет устранена. Я попытался загрузить через скрипт и удалить все записи rxjs в файле systemjs. Тем не менее, systemjs пытается загрузить отдельные файлы операторов rxjs. Это влияет на производительность начальной загрузки

Следует использовать импорт отдельных операторов (глубокий импорт). Это уменьшит количество запросов до 70-80 (в зависимости от того, насколько активно вы используете RxJS) с 275 по пакету, например import

Привет! Когда мы сможем исправить это?

@robinkedia ,

Это важный этап, связанный с предстоящим выпуском RC5.

Я не думаю, что в любом случае стоит использовать umd-бандл. Похоже, что люди Rxjs разбили компоненты на более мелкие части, тогда вам нужно явно указать, что вы хотите использовать. Это значительно уменьшило количество загружаемых файлов по сравнению с предыдущими версиями.

В моей компании я перешел на другой подход, при котором я копирую все файлы .js из папки npm в папку поставщика с помощью задачи gulp:

const source = './node_modules/rxjs/**/*.js';
const dest = './wwwroot/vendor/rxjs';
module.exports.dep = function (gulp, plugins) { return function () { return plugins.del (dest); }; };
module.exports.task = function (gulp, plugins) {
return function () {
return gulp.src(source)
.pipe(gulp.dest(dest));
};
};

А затем сопоставьте его с помощью system.js.config:
var map = { ... 'rxjs': './vendor/rxjs' ... }

Решение мне сначала не понравилось, но потом оказалось приемлемым.

Я не думаю, что в любом случае стоит использовать umd-бандл. Похоже, что люди Rxjs разбили компоненты на более мелкие части, тогда вам нужно явно указать, что вы хотите использовать. Это значительно уменьшило количество загружаемых файлов по сравнению с предыдущими версиями.

Согласовано. Загрузка отдельных файлов - проблема только в режиме разработки с загрузчиком SystemJS. Для производства мы объединяем их в один файл для быстрой загрузки. Но даже если мы заставим это работать (Rx UMD), нам все равно придется иметь дело с сотнями файлов (машинный текст на лету). Поэтому я считаю, что окончательный ответ на все это - переход на webpack и angular-cli (я надеюсь на это).

TLDR: rxjs UMD не полезно

Пожалуйста, помогите предоставить временное решение, если контрольная точка изменилась с RC5 на 2.0.1. Ценю твою поддержку. Благодаря!

В качестве обходного пути я использую пакет rxjs SystemJS в теге скрипта. Вроде работает. Отдельные файлы rxjs не загружаются. Есть ли недостатки у этого подхода (как обходной путь до тех пор, пока umd не будет использоваться)?

Да, выглядит неплохо. Я попробовал Rx.min.js из каталога "bundles" и никаких проблем.

Тег включения через скрипт работает, только если вы сами не импортируете rxjs.

Кажется, есть проблема с новым маршрутизатором v3 и rxjs, который раньше указывал ниже в «пути», и он работал:

 "rxjs/*": "node_modules/rxjs/bundles/Rx.umd.min.js"

как-то связано с "of" и "ArrayObservable", просто не знаю почему ....

Что за проблема? Мы полностью удалили rxjs из конфигурации system.js и загружаем его только через тег скрипта. Мы используем роутер V3 и никаких проблем не возникло.

Хм, "of" и "ArrayObservable", спасибо. Будем смотреть.

Самостоятельная сборка rxjs с помощью systemjs-builder в основном решила мою проблему. все еще получаю ~ 40 запросов, хотя не совсем уверен, почему. Вот как я связал с gulp и systemjs-builder

gulp.task('ng-bundle-rxjs', function(done) {

    var builder = new Builder('./', './systemjs.config.js');
    builder
        .bundle([
            'node_modules/rxjs/add/**/*.js',
            'node_modules/rxjs/observable/**/*.js',
            'node_modules/rxjs/operator/**/*.js',
            'node_modules/rxjs/scheduler/**/*.js',
            'node_modules/rxjs/symbol/**/*.js',
            'node_modules/rxjs/util/**/*.js',
            'node_modules/rxjs/*.js'
        ], 'bundles/rxjs.min.js', {
            minify: true,
            sourceMaps: true,
            mangle: false
        })
        .then(function() {
            console.log('Build complete');
            done();
        })
        .catch(function(err) {
            console.log('Build error');
            console.log(err);
            done();
        });
});

и в systemjs.config.js

bundles: [
    "bundles/rxjs.min.js": ["rxjs/*"]
]

@damiandennis Я использовал ваш подход, и он хорошо работает как временное решение. Я думаю, вам следует заменить utils на util.

@karlhaas спасибо, что уменьшили еще ~ 20 запросов

@damiandennis спасибо за предложенное решение. Я смог самостоятельно связать rxjs, однако не смог правильно настроить systemjs.

Я имею в виду, что, несмотря на использование пакета для rxjs, модули angular (http, маршрутизатор и т. Д.) Все еще пытаются загрузить отдельные библиотеки rxjs.

Может я что-то забываю? Спасибо

@damiandennis Я могу подтвердить, что новый маршрутизатор v3.0.0-rc.1 нарушает решение пути

"rxjs/*": "node_modules/rxjs/bundles/Rx.umd.min.js"

Я получил:
TypeError: Cannot read property 'apply' of undefined

@ mlc-mlapis При загрузке через тег скрипта, как правильно набирать текст при использовании типов rxjs (таких как Subject <> или Observable <>) в собственном коде?

В веб-браузере это не играет никакой роли. Ввод текста является важным фактором для редактора TS, компилятора ... Я полагаю, что вы используете статическую компиляцию, а не динамическую прямо в браузере.

Я делаю собственную сборку веб-пакетов из пакетов RxJS и angular umd, которые работают вместе.

Это удаляет все запросы, кроме одного, похоже, подстановочный знак не работает.

bundles: [
    "bundles/rxjs.min.js": [
        "rxjs/*",
        "rxjs/operator/*",
        "rxjs/observable/*",
        "rxjs/add/operator/*",
        "rxjs/add/observable/*",
        "rxjs/util/*"
    ]
]

@ animayor013 это вызывает импорт rxjs / operator / *, который не разрешается в этом правиле

До RC.6 я использовал rxjs / bundles / rx.min.js в index.html для загрузки одного файла. С апгрейдом RC6 больше не вижу. Я просто вижу rx.umd.js. Если я использую это, я получаю кучу ошибок 404. Несмотря на то, что я подавил rxjs в systemjs, он все равно пытается загрузиться. Это работало для меня в .rc5

@karlhaas, не могли бы вы поделиться своим решением? столкнувшись с той же проблемой, не могу найти способ запустить ее. Спасибо.

@bahodirk Я использую решение @damiandennis . Нам пришлось изменить импорт с «rxjs» на «rxjs / Rx» в нашем проекте.

Лучше всего перейти на веб-пакет

В понедельник, 5 сентября 2016 г., karlhaas [email protected] написал:

@bahodirk https://github.com/bahodirk Я использую решение
@damiandennis https://github.com/damiandennis . Нам пришлось изменить
импорт из rxjs в rxjs / Rx в нашем проекте.

-
Вы получаете это, потому что вас упомянули.
Ответьте на это письмо напрямую, просмотрите его на GitHub
https://github.com/angular/angular/issues/9359#issuecomment -244744673,
или отключить поток
https://github.com/notifications/unsubscribe-auth/AJ6mG8ykN0MQrPmZFtePaAFrjvny1KXOks5qnBaNgaJpZM4I5Yvv
.

Ура!

@robinkedia Если бы пример быстрого

Эй, подождите минутку, я прочитал между строк, что не могу использовать новый маршрутизатор, не переключив всю среду сборки на webpack?

Сначала мне пришлось переключиться с «решения тега сценария» на «решение пути», потому что сейчас мы используем в нашем коде материал RxJS. Когда я захотел начать работу с новым маршрутизатором, я сразу получил:

core.umd.js:5995 EXCEPTION: Uncaught (in promise): TypeError: Cannot read property 'apply' of undefined

Прочитав все это, я все еще не вижу рабочего решения с использованием пакета RxJS umd, верно?

@ woppa684 просто создайте свою собственную версию rxjs, используя конструктор systemjs, как показано выше.

Хм, хорошо, спасибо! Никогда не использовал systemjs-builder, но посмотрю, смогу ли я узнать, как он работает. Надеюсь, мне не придется менять нашу систему сборки / развертывания каждый раз, когда выходит новая версия чего-то.

В моей компании (Canon) мы придерживаемся Visual Studio для разработки, поэтому я был очень рад, когда Angular2 был объявлен на TypeScript. Поскольку вся наша сборка построена на MSBuild, мне пришлось создать множество целевых объектов MSBuild, чтобы фактически разделить рабочее веб-приложение. Использование сторонних компонентов, таких как Angular и RxJS в качестве пакетов, действительно помогло (поскольку мы не можем использовать npm, gulp и т. Д.). Поскольку RxJS больше не доставляет пакет, мне нужно посмотреть, как я могу это исправить снова ...

Поскольку Visual Studio автоматически используетв качестве задачи сборки для ts файлов, кстати, я также не понимаю, как я собираюсь использовать новую компиляцию AoT. Ну что ж, думаю, еще один вызов! :)

Кстати, для последней беты (12) rxjs они снова удалили пакет UMD ...

@ woppa684 Visual Studio очень хорошо обучаем людей этому. Однако у него нет всего того, что ему нужно. В конечном итоге вам, с вероятностью 99%, потребуется запустить необходимые инструменты на основе Node в среде Visual Studio. Новые версии Visual Studio делают это еще проще.

(Использование A2 без участия Node в инструментах сборки - это может быть сложно.)

@kylecordes Да, это то, что мы делаем ... нам нужно поддерживать системы в полевых условиях в течение 10 лет после последней продажи, поэтому у нас есть много деревьев обслуживания, где нам нужно сохранить инструменты сборки, как это было в то время. Поэтому все сторонние материалы, которые мы используем, регистрируются в TFS (либо в двоичном формате, либо по источнику). Тем не менее, у нас ДЕЙСТВИТЕЛЬНО доступны некоторые инструменты для работы с узлами, но они также строго версируются и хранятся вместе с деревьями в обслуживании. Кроме того, нашим серверам сборки не разрешен доступ в Интернет, поэтому нам все равно понадобятся локальные репозитории ...

Например, сама npm, typescript, karma, jasmine и т. Д. Считаются средой разработки, однако angular и rx считаются сторонними библиотеками. Следовательно, версии первых устанавливаются установщиками, которые мы создаем сами (для установки на компьютеры разработчиков), а последние регистрируются в TFS вместе с нашим кодом в стороннем разделе.

Мы также запрещаем инженерам создавать свою собственную конфигурацию сборки или рабочий процесс сборки, поэтому у нас нет таких файлов, как package.json, tsconfig.json, karma.js и т. Д. В наших папках проекта. Для karma и webpack у нас есть общий инструмент сборки, который должен работать для всех проектов.

Я почти уверен, что мы должны когда-нибудь изменить эту систему, но изменение подобных вещей в действительно большой компании требует времени ... На данный момент мы очень довольны A2, и мы создали довольно хороший прототип для нового пользовательского интерфейса. наших принтеров, но необходимость выяснять с каждым выпуском A2, zone.js или rxjs, как пакеты изменились и как наша система сборки / сборки должна измениться, чтобы исправить это снова, очень, очень утомительно ... :)

Короче говоря, если кто-нибудь знает, как настроить SystemJS для загрузки всего, что мне нужно, из пакета Rx.min.js, поставляемого с RxJS 5.0.0-beta.12, я был бы очень рад, если нет, я начну исследовать, как изменить наша система сборки / развертывания, чтобы преодолеть это :)

с такой же (или похожей) проблемой. использовал rxjs через конфигурацию systemjs до RC5, и он работал нормально. В RC5 пришлось изменить тег скрипта в index.html, чтобы включить Rx.min.js. теперь, когда я обновился до RC7 (а теперь и до 2.0.0), включение index.html больше не работает. Я вернулся к файлу конфигурации systemjs с:

paths: { 'rxjs/*': 'node/rxjs/Rx.min.js', },

но теперь у меня в роутере ошибки:

core.umd.min.js: 21 Ошибка: не перехвачено (в обещании): TypeError: не удается прочитать вызов свойства undefined
в l (zone.min.js: 1)
в l (zone.min.js: 1)
в eval (zone.min.js: 1)
в e.invokeTask (zone.min.js: 1)
в Object.onInvokeTask (core.umd.min.js: 29)
в e.invokeTask (zone.min.js: 1)
в n.runTask (zone.min.js: 1)
в (zone.min.js: 1)
в XMLHttpRequest.invoke (zone.min.js: 1) ErrorHandler.handleError @ core.umd.min.js: 21next @ core.umd.min.js: 29generatorOrNext.object.schedulerFn @ [...]
zone.min.js: 1 Отклонение необработанного обещания: невозможно прочитать свойство «call» неопределенного значения; Зона: угловая; Задача: Promise.then; Значение: TypeError: Невозможно прочитать «вызов» свойства undefined (…) TypeError: Невозможно прочитать «вызов» свойства undefined
в ApplyRedirects.expandSegmentGroup (http: // localhost: 5000 / node / angular2 / router / router.umd.min.js: 20: 8956)
в ApplyRedirects.apply (http: // localhost: 5000 / node / angular2 / router / router.umd.min.js: 20: 7499)
в applyRedirects (http: // localhost: 5000 / node / angular2 / router / router.umd.min.js: 6: 7976)
в eval (http: // localhost: 5000 / node / angular2 / router / router.umd.min.js: 20: 29638)
в новом e (http: // localhost: 5000 / node / zone / zone.min.js: 1: 18127)
в Router.runNavigate (http: // localhost: 5000 / node / angular2 / router / router.umd.min.js: 20: 29443)
в eval (http: // localhost: 5000 / node / angular2 / router / router.umd.min.js: 20: 28999)
в e.invoke (http: // localhost: 5000 / node / zone / zone.min.js: 1: 15913)
в Object.onInvoke (http: // localhost: 5000 / node / angular2 / core / core.umd.min.js: 29: 16609)
в e.invoke (http: // localhost: 5000 / node / zone / zone.min.js: 1: 15864)

это нас полностью блокирует и является серьезной проблемой.

из-за нашей модели разработки мы не хотим в ближайшее время переходить на веб-пакет. Systemjs с транспиляцией в браузере идеально подходит для нас в разработке. в prod мы просто переходим на скомпилированный js. Для нас внутренняя проблема не составляет никакого труда.

благодаря

edit: просто заменил пакет Rx.min.js полным пакетом, указав вместо этого на Rx.js, и теперь он работает, поэтому проблемы определенно вызваны пакетом Rx.min.js. Текущее решение действительно не идеально, потому что оно добавляет почти 50 вызовов ко времени загрузки. как мы можем использовать пакет в 2.0.0?

Чтобы решить эту проблему, нам нужно самостоятельно сгенерировать пакет Rx SystemJS

const Builder = require("systemjs-builder");
// SystemJS build options.
var options = {
    normalize: true,
    runtime: false,
    sourceMaps: true,
    sourceMapContents: true,
    minify: false,
    mangle: false
};
var builder = new Builder('./');
builder.config({
    paths: {
        "n:*": "node_modules/*",
        "rxjs/*": "node_modules/rxjs/*.js",
    },
    map: {
        "rxjs": "n:rxjs",
    },
    packages: {
        "rxjs": {main: "Rx.js", defaultExtension: "js"},
    }
});

builder.bundle('rxjs', 'node_modules/.tmp/Rx.js', options),

Это сгенерирует пакет, готовый к использованию SystemJS.

Вставить <script src="node_modules/.tmp/Rx.js"></script> в HTML

Таким образом, любые операторы импорта rxjs/* (например, import rxjs/Observable ) не вызовут более 50 запросов от SystemJS.

`` `` ` **Important**! In your systemjs.config should be nothing related to rxjs`, если будет
Например:

map = {
     "rxjs": "n:rxjs",
};

Это вызовет снова 50+ запросов ...
`` `` `

@unlight

ваше решение отлично работает. Спасибо огромное!

После тестирования других решений @unlight ваше решение определенно работает нормально. благодаря!!

Спасибо @unlight, отлично работает! Я поэкспериментировал и добавил в скрипт минификацию:

var compressor = require('node-minify');

...

builder.bundle('rxjs', 'node_modules/.tmp/Rx.js', options)
    .then(function() {

    new compressor.minify({
        type: 'uglifyjs',
        fileIn: 'node_modules/.tmp/Rx.js',
        fileOut: 'node_modules/.tmp/Rx.min.js',
        callback: function(err, min){
            if (err) {
                console.log(err);
            }
        }
    });
});

Другие компрессоры node-minify (gcc, yui) выдавали ошибки, но uglifyjs работает. Размер увеличился с 766K до 394K.

@subsite
systemjs-builder имеет параметр minify и относится к минификации mangle .
См. Https://github.com/systemjs/builder#minification --source-maps

@unlight
Извините, недостаточно внимательно прочитал. И спасибо, протестировал конструкторский вариант minify и он тоже работает, не нужно ничего усложнять.

@unlight , я, наверное, никогда тебя не встречу, но ты мой новый лучший друг. Благодаря вам я успешно объединяю RxJS, и это резко сократило количество HTTP-запросов. Я до сих пор не могу поверить, насколько мучительно объединять, минимизировать и развертывать приложения Angular 2 из Visual Studio 2015, но ваш пост помог мне сделать большой шаг вперед. Еще раз спасибо.

Я не уверен, является ли это ошибкой в ​​SystemJs, RxJS или Angular 2. Но это действительно раздражает. Приведенный выше обходной путь у меня не сработал. Это могло быть из-за неправильной конфигурации SystemJs.
Я даже пытался создать пакет SFX, но в итоге получилась та же ошибка, что и в исходном пакете. Дело не в том, что я столкнулся с этим из-за особого крайнего случая. Я сделал туториал со своим собственным скриптом gulp.
На данный момент я копирую все js-файлы rxjs в свой каталог сборки и позволяю SystemJs загружать их один за другим, пока не будет найдено реальное решение проблемы.

В настоящее время PyCharm / WebStorm предлагает импорт import {Observable} from 'rxjs'; для Observable rxjs. В самостоятельной версии rxjs SystemJS не находит rxjs. Я получаю следующую ошибку:

Uncaught (in promise) Error: (SystemJS) XHR error (404 Not Found) loading http://localhost:3000/build/ee/ui/ca2/node_modules/rxjs.js
    Error: XHR error (404 Not Found) loading http://localhost:3000/build/ee/ui/ca2/node_modules/rxjs.js

Есть ли у кого-нибудь конфигурация SystemJS, которая решает эту проблему?

Он работает с import {Observable} from 'rxjs/Rx'; но очень неудобно изменять импорт вручную или обнаруживать проблему при столкновении с вышеуказанной ошибкой.

Я создал плункер, который показывает проблему. Это форк экскурсии по живому примеру маршрутизатора heros в трех модификациях.
Ссылка: http://plnkr.co/edit/sxyxnsszm9cM0vDnZu66?p=preview

@unlight Действительно отличный совет. Он работает на Angular 2.1.0, а размер повторно упакованного Rx.js составляет 377 КБ.

Проблема все еще существует с angular 2.1.1 и router 3.1.1
@vicb вы можете обновить ярлыки, я не думаю, что они точны. На мой взгляд, эта ошибка является серьезной проблемой, поскольку она возникает даже в учебнике, если вы используете связанный файл rxjs. Или убедитесь, что это ошибка rxjs.

@ mh-dev ... у вас работает перепакованный файл? Просто чтобы быть уверенным.

Я цитирую себя: «Приведенный выше обходной путь у меня не сработал. Это могло быть из-за неправильной конфигурации SystemJ». Я не заблокирован ошибкой, так как я обходной путь, загружая каждый субфайл. Но это не означает, что это проблема, и она неправильно обозначена.

@ mh-dev Конечно, я просто хотел знать. У меня нет этой проблемы. Моя конфигурация SystemJS вообще не содержит RxJS, и я просто загружаю повторно упакованный rx.min.js через тег скрипта в моем index.html. Так что интересно, где проблема на вашей стороне из-за простоты этого.

Можете ли вы загрузить свой восстановленный файл? Затем я могу проверить, не сделали ли вы что-то не так с созданием пакета, когда я вернусь домой. (Я создал пакет самостоятельно, и во время тестирования в файле system.js не было ничего, связанного с rxjs, и проблема все еще была)

@ mh-dev Вот она (версия "5.0.0-beta.12"). Я использовал только «minify» (377 кБ), а не «mangle» (изначально 223 кБ), так что, возможно, в этом разница.
Rx.zip

Кажется, я упускаю кое-что, что нужно сделать с помощью этого файла.
Я создал плункер на основе живого примера руководства по маршрутизатору, который добавляет этот файл и отключает rxjs в конфигурации system js.
См. Http://plnkr.co/edit/WL7jesqDp6o81WUvgOU6?p=preview

Вы не комментировали строки 52, 53, 54 в systemjs.config.js:

rxjs: {
   defaultExtension: 'js'
},

Я их прокомментировал, и планка работает.

Хорошо, теперь я могу использовать это исправление. Проблема в моей локальной настройке имела параметр в пакете для '', который затем запускал значение по умолчанию для rxjs. Спасибо за помощь (на мой взгляд, ошибка остается открытой)

Да, конечно. Я думаю, что проблема в исходном пакете Rx.min.js где-то из-за искажения.

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

У меня есть еще одна проблема, напрямую связанная с этой веткой. Я использую в своем приложении только пакеты, начиная с dev. В частности, я использую пакет http-testing вместе с пакетом rxjs для своих модульных тестов. Проблема в том, что http-тестирование напрямую импортирует 'rxjs / operator / take', который не экспортируется из пакета rxjs, поэтому я получил следующую ошибку:

TypeError: undefined is not an object (evaluating 'rxjs_operator_take.take.call') (line 20)
MockConnection
createConnection
httpRequest
request
query

Я исправил это так:

  • 'реэкспортируйте' его обратно в один из моих исходных файлов:
import {Observable} from 'rxjs';
export const take = Observable.prototype.take;
  • сопоставьте этот экспорт в конфигурации system.js:
map: {
    ......
    'rxjs/operator/take': 'testing/ng2-http-testing-import-fix'
}

Это сработало хорошо, но все же я считаю, что этот импорт должен быть исправлен в коде /modules/@angular/http/testing/mock_backend.ts .

@ mlc-mlapis привет Я просто запустил приложение plunk и нашел индивидуальный запрос на rxjs точно так же , я пропустил что-то важное
snap

@jiminsc Привет, что ты имеешь в виду?

@ mlc-mlapis спасибо за ваш ответ. он здесь: http://plnkr.co/edit/WL7jesqDp6o81WUvgOU6?p=preview

@jiminsc Привет, ты не внимательно прочитал предыдущий разговор. Необходимо прокомментировать строки 52, 53, 54 в файле systemjs.config.js, чтобы исключить связь с RxJS. Я попробовал, и plunk работает как положено.

У меня такая же проблема, когда я использую файл node_module/rxjs/bundles/Rx.js в сочетании со связанными модулями Angular UMD (например: node_module/@angular/router/bundles/router.umd.js ).

Однако мне очень не нравится изобретать колесо заново и создавать свой собственный файл пакета. Я предпочитаю использовать файлы, предоставленные поставщиком, потому что эти файлы предположительно были протестированы «поставщиком». Итак, я покопался в SystemJS и нашел решение, используя специальный загрузчик для частей RxJS.

https://gist.github.com/nros/311962c6e0ffb67b4e6aada67e1821f0

Оба файла можно объединить в один файл, чтобы сохранить дополнительный HTTP-запрос.
(отказ от ответственности: он еще не прошел тщательного тестирования и еще не готов к производственному использованию!)

Хм, не уверен, что это лучше, чем перепаковка.

@ mlc-mlapis Да, работает. Большое спасибо.

@ mlc-mlapis ИМХО, хорошо иметь выбор.

Кто предпочитает индивидуальную сборку, сможет! Я думаю, оно того стоит. Тем не менее, использовать файлы, предоставленные поставщиком, намного проще. Я все еще борюсь с webpack, чтобы создать собственный пакет так, как я хочу. Мне кажется, не так-то просто выполнить мои требования ...

Прочитав много обсуждений, я наконец получил работоспособное идеальное решение, сначала используйте systemjs-builder для сборки пакета rxjs systemjs:

    const Builder = require("systemjs-builder");
    var builder = new Builder('./');
    builder.config({
        paths: {"rxjs/*": "node_modules/rxjs/*.js"},
        map: {"rxjs": "node_modules/rxjs"},
        packages: { "rxjs": {main: 'Rx.js', defaultExtension: "js"} }
    });

    builder.bundle('rxjs', 'your-own-path/Rx.min.js', {
        sourceMaps: true,
        minify: true,
        mangle: true
    });

затем в вашем файле system.config.js удалите все, что связано с rxjs, а затем добавьте такой пакет

        bundles: {
            "your-own-path/Rx.min.js": [
                "rxjs/*",
                "rxjs/operator/*",
                "rxjs/observable/*",
                "rxjs/add/operator/*",
                "rxjs/add/observable/*",
                "rxjs/util/*"
            ]
        }

то нет необходимости делать дополнительную работу и не нужно включать Rx.min.js в тег скрипта в html, systemjs автоматически загружает только Rx.min.js.

после этого количество запросов моего приложения simpe уменьшилось с 500 до 86 (более половины из них - изображения, другие скрипты и файлы css). а окончательный Rx.min.js - всего 258 КБ.

это пока что близко к идеальному решению. и спасибо @unlight и @damiandennis.

@ steve3d Отлично, вопрос только в том, почему оригинальный Rx.min.js не работает таким же образом.

Приведенные выше фрагменты от @ steve3d очень полезны. В ситуации, когда полезно загружать как можно больше через системный JS во время выполнения, я использовал что-то похожее, но более грубое, и вскоре обновлюсь до этой настройки.

закрывая это, так как есть ряд полезных решений, и эту проблему нельзя исправить с помощью angular. спасибо за помощь @unlight @damiandennis @ steve3d 👍

@ mlc-mlapis, ну это было бы вне моих знаний .... извините, я не могу на это ответить.

но одно можно сказать наверняка: размер Rx.min.js в комплекте с rxjs составляет всего 139 КБ, а у неминфицированного Rx.js - 542 КБ, но systemjs-builder создает полный Rx.js размером более 700 КБ, а также минимизирует и искажает Rx.min. js 253 КБ. это может быть проблемой, я не верю, что пакет systemjs просто добавит более 200 КБ в пакет. поэтому вопрос только в том, что Rx.js, поставляемый с rxjs, не предназначен для systemjs.

@ steve3d ... ну, у меня то же самое, поэтому я создал проблему в репозитории RxJS (https://github.com/Reactive-Extensions/RxJS/issues/1386), и, возможно, есть кто-то, кто знает ответ. Посмотрим.

Причина, по которой системный пакет больше, та же, по которой существует эта проблема:

Пакет UMD не раскрывает все свои внутренние модули (поэтому вы не можете выполнить глубокий импорт в пакет UMD), и поэтому он может сгладить / удалить всю упаковку модулей)

System.register пучок делает разоблачить все модули (именно поэтому вы можете глубоко импортировать из них), и существует значительное количество накладных расходов для поддержания этой структуры.

Роб, вы говорите нам, что файлы Rx.min.js и Rx.js из каталога bundles модуля узла RxJS являются файлами с внутренней структурой UMD? Насколько я помню, некоторое время назад в этом каталоге были файлы Rx.umd.js, Rx.min.js, Rx.js, а из какой-то версии RxJS исчез Rx.umd.js.

Если это правда, то это действительно смешно, потому что ваш ответ очевиден, но здесь об этом никто не упомянул, и я тоже этого не осознавал.

Интересно, можно ли настроить системный сборщик или другой инструмент для получения такого пакета:

  • Формат системного пакета
  • С модулями точки входа, представленными как системные модули, так что он действительно может работать
  • Но со всеми многочисленными другими внутренними модулями, сжатыми в каплю с помощью свертки или чего-то подобного, чтобы не быть больше, чем необходимо

Мне кажется, что такая вещь была бы идеальным способом распространения RxJS в виде пакета для использования в тех случаях, когда связывание на уровне приложения не подходит.

Я пробовал подход @ steve3d, но не работает. Произошла следующая ошибка

Error: (SystemJS) Unexpected token < SyntaxError: Unexpected token < at eval (<anonymous>) Evaluating http://localhost:10350/rxjs/Subject.js Error loading http://localhost:10350/main.js at eval (<anonymous>) Evaluating http://localhost:10350/rxjs/Subject.js Error loading http://localhost:10350/main.js

Я использовал задачу grunt для сборки Rx (я также установил systemjs-builder через npm):
`

var Builder    = require("systemjs-builder");

gulp.task("rxjs", () => {

    var builder = new Builder('./');

    builder.config({
        paths: {"rxjs/*": "node_modules/rxjs/**/*.js"},
        map: {"rxjs": "node_modules/rxjs"},
        packages: { "rxjs": {main: 'Rx.js', defaultExtension: "js"} }
    });

    builder.bundle('rxjs', 'public/lib/rxjs/Rx.min.js', {
         sourceMaps: true,
        minify: true,
        mangle: true
    });
});

`

и мой system.config.js (я поместил весь файл, чтобы доказать, что нет ничего о работе rx):
`

(function (global) {
  System.config({
    typescriptOptions: {
      tsconfig: true
    },
    meta: {
      'typescript': {
        "exports": "ts"
      }
    },
    paths: {
      'npm:': 'lib/'
    },
    bundles: {
        "npm:rxjs/Rx.min.js": [
            "rxjs/*",
            "rxjs/operator/*",
            "rxjs/observable/*",
            "rxjs/add/operator/*",
            "rxjs/add/observable/*",
            "rxjs/util/*"
        ]
    },

    map: {
      app: '',

      // angular bundles
      '@angular/core': 'npm:@angular/core/bundles/core.umd.js',
      '@angular/common': 'npm:@angular/common/bundles/common.umd.js',
      '@angular/compiler': 'npm:@angular/compiler/bundles/compiler.umd.js',
      '@angular/platform-browser': 'npm:@angular/platform-browser/bundles/platform-browser.umd.js',
      '@angular/platform-browser-dynamic': 'npm:@angular/platform-browser-dynamic/bundles/platform-browser-dynamic.umd.js',
      '@angular/http': 'npm:@angular/http/bundles/http.umd.js',
      '@angular/router': 'npm:@angular/router/bundles/router.umd.js',
      '@angular/forms': 'npm:@angular/forms/bundles/forms.umd.js',
      '@angular/upgrade': 'npm:@angular/upgrade/bundles/upgrade.umd.js',

      // angular testing umd bundles
      '@angular/core/testing': 'npm:@angular/core/bundles/core-testing.umd.js',
      '@angular/common/testing': 'npm:@angular/common/bundles/common-testing.umd.js',
      '@angular/compiler/testing': 'npm:@angular/compiler/bundles/compiler-testing.umd.js',
      '@angular/platform-browser/testing': 'npm:@angular/platform-browser/bundles/platform-browser-testing.umd.js',
      '@angular/platform-browser-dynamic/testing': 'npm:@angular/platform-browser-dynamic/bundles/platform-browser-dynamic-testing.umd.js',
      '@angular/http/testing': 'npm:@angular/http/bundles/http-testing.umd.js',
      '@angular/router/testing': 'npm:@angular/router/bundles/router-testing.umd.js',
      '@angular/forms/testing': 'npm:@angular/forms/bundles/forms-testing.umd.js',

      // other libraries
      //'rxjs':                      'npm:rxjs',
      'angular2-in-memory-web-api':'npm:angular2-in-memory-web-api',
      'angular2-jwt':              'npm:angular2-jwt/angular2-jwt.js',
      //'ts':                        'npm:plugin-typescript/lib/plugin.js',
      //'typescript':                'npm:typescript/lib/typescript.js',
      'angular2-text-mask':        'npm:angular2-text-mask/dist',
      'angular2-datatable':        'npm:angular2-datatable',
      'lodash':                    'npm:lodash',
      'ng2-completer':             'npm:ng2-completer/bundles/ng2-completer.min.js',
      'ng2-slim-loading-bar':      'npm:ng2-slim-loading-bar/bundles/index.umd.js',
      'ng2-translate':             'npm:ng2-translate/bundles/index.js'
    },
    // packages tells the System loader how to load when no filename and/or no extension
    packages: {
      app: {
        main: './main.js',
        defaultExtension: 'js'
      },
      //'rxjs'                      : {main: "Rx.min.js", defaultExtension: 'js'},
      'angular2-in-memory-web-api': {defaultExtension: 'js'},
      'angular2-jwt'              : {defaultExtension: 'js'},
      'ng2-slim-loading-bar'      : {defaultExtension: 'js'},
      'ng2-translate'             : {defaultExtension: 'js'},
      'ng2-completer'             : {format: 'cjs' },
      'lodash'            : {main:'index.js'            , defaultExtension:'js'},
      'angular2-datatable'        : {main: 'index.js'           , defaultExtension: 'js'},
      'angular2-text-mask'        : {main: 'angular2TextMask.js', defaultExtension: 'js' }
    }
  });
})(this);

`

Я использую

  • угловой v ~ 2.1.2,
  • rxjs v5.0.0-beta.12,
  • systemjs-builder версии ^ 0.15.34

Кто-нибудь знает, что не так в моем коде?

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

Было ли для этого согласованное, общее решение? Хотел бы перестать тянуть отдельные файлы.

@ mh-dev я изменил папку приложения, но она тоже не работает. :(

PS: я переместил все файлы в папку приложения (кроме index и system.config.js), затем я поместил app: 'app' в system.config.js

@tigredonorte

попробуйте использовать относительный путь вместо npm: в части bundles .

это мой system.config.js, работает очень хорошо:

'use strict';

(function (global) {
    System.config({
        "defaultJSExtensions": true,
        // map tells the System loader where to look for things
        map: {
            // our app is within the app folder
            app: 'scripts',
            modules: 'scripts/modules',
            // angular bundles
            '@angular/core': 'assets/global/plugins/@angular/core/bundles/core.umd.min.js',
            '@angular/common': 'assets/global/plugins/@angular/common/bundles/common.umd.min.js',
            '@angular/compiler': 'assets/global/plugins/@angular/compiler/bundles/compiler.umd.min.js',
            '@angular/platform-browser': 'assets/global/plugins/@angular/platform-browser/bundles/platform-browser.umd.min.js',
            '@angular/platform-browser-dynamic': 'assets/global/plugins/@angular/platform-browser-dynamic/bundles/platform-browser-dynamic.umd.min.js',
            '@angular/http': 'assets/global/plugins/@angular/http/bundles/http.umd.min.js',
            '@angular/router': 'assets/global/plugins/@angular/router/bundles/router.umd.min.js',
            '@angular/forms': 'assets/global/plugins/@angular/forms/bundles/forms.umd.min.js',
            'moment': "assets/global/plugins/moment.min.js"
        },
        bundles: {
            "assets/global/plugins/Rx.min.js": [
                "rxjs/*",
                "rxjs/operator/*",
                "rxjs/observable/*",
                "rxjs/add/operator/*",
                "rxjs/add/observable/*",
                "rxjs/util/*"
            ]
        }
    });
})(this);

Если это не работает для вас, то я уверен, что проблема только в вас. и попробуйте обновить rxjs до rc.4, после beta.12 кое-что изменилось.

вот моя спецификация:
угловой 2.3.1
rxjs 5.0.rc4
systemjs 0.19.38
systemjs-builder 0.15.34

@unlight thx - мне тоже from 'rxjs/Rx' .

С точки зрения новичков JS, это своего рода облом, поскольку руководство по Angular ведет прямо к Observables, и код действительно работает, но с этим импортом / зависимостью нужно возиться.

Обновленная версия конфигурации system.config.js -> необходимо добавить строку "rxjs / symbol / *" в:

bundles: {
            "assets/global/plugins/Rx.min.js": [
                "rxjs/*",
                "rxjs/operator/*",
                "rxjs/observable/*",
                "rxjs/add/operator/*",
                "rxjs/add/observable/*",
                "rxjs/symbol/*",
                "rxjs/util/*"
            ]
        }

для спецификации:

angular 2.4.6
rxjs 5.1.0
systemjs 0.19.46
systemjs-builder 0.16.2

@ mlc-mlapis Откуда берется файл _assets / global / plugins / Rx.min.js_ (объявленный в конфигурации пакетов systemjs)? Это файл, входящий в пакет npm, или это файл, перестроенный самостоятельно с помощью SystemBuilder?

Второй правильный. Это файл, который представляет собой перекомпонованную версию RxJS. Вы можете сохранить его где хотите. Я сохраняю его в «assets / rxjs-bundle / Rx.min.js».

для решений, использующих systemjs-builder, является ли отчасти причиной того, что скомпилированный файл настолько велик, потому что в него включена папка node_modules / rxjs / bundles, или эти файлы не влияют на конечный результат?

Здесь все перепробовали. У меня ничего не работает.
Вот моя структура:
приложение/
app.module.ts
...
node_modules /
ваш-собственный-путь /
Rx.min.js
index.html
systemjs.config.js
...

Я построил Rx.min.js, как было предложено.
Вот мой systemjs.config.js

(function (global) {
    SystemJS.config({
        bundles: {

            "your-own-path/Rx.min.js": [
                "rxjs/*",
                "rxjs/operator/*",
                "rxjs/observable/*",
                "rxjs/add/operator/*",
                "rxjs/add/observable/*",
                "rxjs/symbol/*",
                "rxjs/util/*"
            ]

        },
        paths: {
            // paths serve as alias
            'npm:': 'node_modules/'
        },

        // map tells the System loader where to look for things
        map: {
            // our app is within the app folder
            app: 'app',

            // angular bundles
            '@angular/core': 'npm:@angular/core/bundles/core.umd.js',
            '@angular/common': 'npm:@angular/common/bundles/common.umd.js',
            '@angular/compiler': 'npm:@angular/compiler/bundles/compiler.umd.js',
            '@angular/platform-browser': 'npm:@angular/platform-browser/bundles/platform-browser.umd.js',
            '@angular/platform-browser-dynamic': 'npm:@angular/platform-browser-dynamic/bundles/platform-browser-dynamic.umd.js',
            '@angular/http': 'npm:@angular/http/bundles/http.umd.js',
            '@angular/http/testing': 'npm:@angular/http/bundles/http-testing.umd.js',
            '@angular/router': 'npm:@angular/router/bundles/router.umd.js',
            '@angular/forms': 'npm:@angular/forms/bundles/forms.umd.js',

            // other libraries
            'angular-tree-component': 'node_modules/angular-tree-component/dist/angular-tree-component.umd.js',
            //color picker
            'angular2-color-picker': 'node_modules/angular2-color-picker'

        },
        // packages tells the System loader how to load when no filename and/or no extension
        packages: {
            app: {
                main: './main.js',
                defaultExtension: 'js'
            },
            'angular2-color-picker': {
                main:'index.js',
                defaultExtension: 'js',
            }
        }
    });
})(this);

Вот что я получаю на выходе:
[1] 17.03.24 21:54:38 200 GET /your-own-path/Rx.min.js
[1] 17.03.24 21:54:39 ​​404 GET /node_modules/systemjs/dist/Rx.min.js.map
[1] 17.03.24 21:54:39 ​​404 GET / rxjs

Что я делаю неправильно?

@ guest73 Здесь вы можете увидеть точную конфигурацию, которую я использую для создания системного пакета RxJS:

https://github.com/OasisDigital/rxjs-system-bundle

Вы можете увидеть его в использовании здесь:

https://plnkr.co/edit/Fy0jvu?p=preview

Навскидку, основная разница, которую я вижу между моей конфигурацией и вашей, заключается в конфигурации systemjs:

    rxjs: {
      defaultExtension: false
    }

... но, конечно, могло быть что-то еще.

Спасибо @kylecordes , это вроде помогло. Мне кажется, проблема заключалась в том, что мы ссылались на RxJS в нашем собственном проекте.
Было 3 варианта:

import { Observable } from 'rxjs/Rx';
import { Observable } from 'rxjs/Observable';
import { Observable } from 'rxjs';

а также что-то вроде этого

import 'rxjs/add/operator/map';
import 'rxjs/add/operator/catch';

Я удалил оператор импорта и сделал все как import {Observable} из 'rxjs / Rx';
После этого заработало.

@ guest73 Проблема с этой формой:

import { Observable } from 'rxjs/Rx';

заключается в том, что он импортирует сам 'rxjs/Rx' , который проблематично импортирует все операторы - вы можете легко увидеть, что это происходит в файле онлайн здесь:

https://unpkg.com/[email protected]/Rx.js

Я думаю, что сейчас "лучшая" форма для использования:

import { Observable } from 'rxjs/Observable';

Эта форма:

  • Избегает импорта всех операторов - импортируйте только те, которые вы используете, для минимального размера вывода.
  • Это то, что я чаще всего вижу «в дикой природе» и использую в материалах классов (среди прочего я преподаю классы Angular).
  • ... и это форма, которую использует сам Angular, см.:

https://github.com/angular/angular/search?utf8=%E2%9C%93&q=from+%27rxjs%2FObservable%27&type=

пожалуйста, ребята, это не имеет никакого смысла в производственной сборке, вы всегда будете использовать сборщик для сборки всех скриптов с aot, и поверьте мне, я потратил 4 дня, чтобы попытаться выяснить, как использовать webpack и systemjs вместе, и все еще есть некоторые проблемы, и после обращения к @ angular / cli мне требуется всего около 15 минут, чтобы создать aot bundles.

и с angular 4.0 кажется, что способ systemjs больше не будет работать, я пробовал с некоторыми другими настройками, и ни один из них не работает, и это занимает у меня целый день, а с @ angular / cli это действительно просто несколько нажатий клавиш, затем все готово, разработчик строит с исходной картой и смотрите, а производственная сборка с aot, все работает как шарм.

пожалуйста, ребята, не тратьте больше времени на это, если, конечно, вы не должны навсегда придерживаться версии angular 2.

angular / cli НАМНОГО проще, чем этот способ systemjs.

Теперь в моей настройке я использую angular / cli для упаковки всего и с systemjs для динамической загрузки любых скриптов или просто оставляю эту работу angular / cli, чтобы упаковать целую кучу сторонних плагинов jquery.

после перехода на angular / cli мой system.config.js содержит только эти

    SystemJS.config({
        // map tells the System loader where to look for things
        map: {
            jquery: 'assets/global/plugins/jquery.min.js'
        }
    });

Webpack у меня тоже работал. На то, чтобы изучить webpack с нуля и добавить его в свой проект, потребовалось гораздо меньше времени, чем на то, чтобы заставить работать пакет systemjs.

проблема в пакетах, скопируйте этот configjs или измените его, как этот код

(function (global) {
    var map = {
        'app': 'app',

        // angular bundles
        '@angular/core': 'npm:@angular/core/bundles/core.umd.js',
        '@angular/common': 'npm:@angular/common/bundles/common.umd.js',
        '@angular/compiler': 'npm:@angular/compiler/bundles/compiler.umd.js',
        '@angular/platform-browser': 'npm:@angular/platform-browser/bundles/platform-browser.umd.js',
        '@angular/platform-browser-dynamic': 'npm:@angular/platform-browser-dynamic/bundles/platform-browser-dynamic.umd.js',
        '@angular/http': 'npm:@angular/http/bundles/http.umd.js',
        '@angular/router': 'npm:@angular/router/bundles/router.umd.js',
        '@angular/forms': 'npm:@angular/forms/bundles/forms.umd.js',

        // other libraries
        'rxjs': 'npm:rxjs',
        'angular-in-memory-web-api': 'npm:angular-in-memory-web-api/bundles/in-memory-web-api.umd.js'
    };
    var packages = {
        'app': { main: 'main.js', defaultExtension: 'js' },
        'rxjs': { defaultExtension: 'js' },
    };
    var ngPackageNames = [
        'common',
        'compiler',
        'core',
        'forms',
        'http',
        'platform-browser',
        'platform-browser-dynamic',
        'router'
    ];
    // Individual files (~300 requests):
    function packIndex(pkgName) {
        packages['@angular/' + pkgName] = { main: 'index.js', defaultExtension: 'js' };
    }
    // Bundled (~40 requests):
    function packUmd(pkgName) {
        packages['@angular/' + pkgName] = { main: '/bundles/' + pkgName + '.umd.js', defaultExtension: 'js' };
    }
    // Most environments should use UMD; some (Karma) need the individual index files
    var setPackageConfig = System.packageWithIndex ? packIndex : packUmd;
    var config = {
        paths: {  'npm:': 'node_modules/'
        },
        map: map,
        packages: packages
    };
    System.config(config);
})(this);
`


его воля работает отлично

@ abu7midan : Как это поможет?

Загрузчик systemjs будет забирать отдельные файлы вместо пакета в одном запросе к Rx.umd.js , что приводит к от 80 до 150 дополнительных запросов к серверу. И это происходит в любом нетривиальном случае, когда вы импортируете rxjs/Rx .

Спасибо за эту информацию. Я использовал комплектный rxjs без каких-либо проблем. Сегодня хотел использовать угловой материал, и когда я его использую, я получаю ошибку,
http: // localhost : 8000 / rxjs как "rxjs" из http: // localhost : 8000/node_modules/@angular/material/bundles/material.umd.js

@jeshcalls ... можешь показать точное сообщение об ошибке?

Пожалуйста, найдите ошибку ниже.

ОШИБКА Ошибка: не перехвачено (в обещании): Ошибка: ошибка: ошибка XHR (404 не найден) загрузка http: // localhost : 8000 / rxjs
в XMLHttpRequest.wrapFn [как _onreadystatechange] (http: // localhost: 8000 / node_modules / zone.js / dist / zone.js: 636: 29)
в ZoneDelegate.invokeTask (http: // localhost: 8000 / node_modules / zone.js / dist / zone.js: 225: 37)
в Object.onInvokeTask (http: // localhost: 8000/node_modules/@angular/core/bundles/core.umd.js: 3913: 33)
в ZoneDelegate.invokeTask (http: // localhost: 8000 / node_modules / zone.js / dist / zone.js: 224: 42)
в Zone.runTask (http: // localhost: 8000 / node_modules / zone.js / dist / zone.js: 125: 47)
в XMLHttpRequest.ZoneTask.invoke (http: // localhost: 8000 / node_modules / zone.js / dist / zone.js: 293: 33)
Ошибка загрузки http: // localhost : 8000 / rxjs как «rxjs» с http: // localhost : 8000/node_modules/@angular/material/bundles/material.umd.js.

@jeshcalls ... это означает, что на URL http: // localhost : 8000 / rxjs ничего нет

Какой загрузчик вы используете? SystemJS?

да, я использую SystemJS, когда я добавляю запись карты в System.config.js, чтобы получить rxjs: npm: rxjs , он http: // localhost : 8000 / node_modules / rxjs, в котором есть папка, но, очевидно, отдельные файлы js из rxjs.

@jeshcalls ... для перекомпонованного RxJS 5.5.x у вас должно быть следующее, если ваш systemjs.config.js , где assets/rxjs-bundle/Rx.min.js - это обновленный файл RxJS:

bundles: {
        ...,
    "assets/rxjs-bundle/Rx.min.js": [
        "rxjs/*",
        "rxjs/operator/*",
        "rxjs/operators/*",
        "rxjs/observable/*",
        "rxjs/add/operator/*",
        "rxjs/operators/*",
        "rxjs/add/observable/*",
        "rxjs/scheduler/*",
        "rxjs/symbol/*",
        "rxjs/util/*"
    ],
        ...
}

@jeshcalls : SystemJS мертв. Angular давно перешел от него к webpack и angular-cli сейчас

@ mlc-mlapis: Большое спасибо. Я прочитал ваши предыдущие посты по этому поводу и пропустил это. Этот пакет не работал, но я добавил атрибут карты как 'rxjs': ' npm: ./ tmp / Rx.js ', и он сработал.

@TsengSR : Вы абсолютно правы. Есть ли веб-ссылка, сравнивающая режимы системного js и webpack. Приходится показывать сводную презентацию своим начальникам, чтобы они согласились на переход.

Эта проблема была автоматически заблокирована из-за бездействия.
Пожалуйста, сообщите о новой проблеме, если вы столкнулись с подобной или связанной проблемой.

Узнайте больше о нашей политике автоматической блокировки разговоров .

_Это действие было выполнено автоматически ботом. _

Была ли эта страница полезной?
0 / 5 - 0 рейтинги