Как связать Angular2 RC1 с systemjs

Question

Перед выпуском кандидаты угловые подают в комплекте файл. Начиная с кандидатов на выпуск больше нет связанного файла. Включая angular2 и rxjs, мое приложение теперь загружает 671 запрос за 7 секунд. Это имеет искаженное развитие.

Кто-нибудь знает, как связать угловые и rxjs и включить их в system.config?

Answer 1

Чтобы получить проект с более легким весом, вы должны проверить SystemJS Builder или JSPM, чтобы расслоение вашего проекта.

Пример проект семян: https://github.com/madhukard/angular2-jspm-seed

@BrunoGarcia дал очень хорошую информацию здесь: https://stackoverflow.com/a/37098964/5706293

Answer 2

Вам просто нужно использовать Bundler:

• UMD файлы: это, вероятно, простое решение. Как вы можете видеть в этом example. Вам просто нужно сделать ссылку на файлы UMD в вашем systemjs конфигурационного файла (не так полезно для производства окружающих сред):

  System.config({ 
      packages: { 
       app: { 
        main: './main.ts', 
        defaultExtension: 'ts' 
       }, 
       '@angular/core': { 
        main: 'core.umd.js', 
        defaultExtension: 'js' 
       }, 
       '@angular/compiler': { 
        main: 'compiler.umd.js', 
        defaultExtension: 'js' 
       }, 
       '@angular/common': { 
        main: 'common.umd.js', 
        defaultExtension: 'js' 
       }, 
       '@angular/platform-browser-dynamic': { 
        main: 'platform-browser-dynamic.umd.js', 
        defaultExtension: 'js' 
       }, 
       '@angular/platform-browser': { 
        main: 'platform-browser.umd.js', 
        defaultExtension: 'js' 
       }, 
       rxjs: { 
        defaultExtension: 'js' 
       } 
      } 
  }); 
  

  Вы можете найти другой exampe (вероятно, лучше) here!

• systemjs-строитель + глоток:, если вы хотите продолжать использовать systemjs, это хороший вызов, чтобы использовать это решение, однако я проверил это, и это заняло у меня 30-х лет, чтобы создать пакет, что делает его не очень полезно для разработки (возможно, я делал что-то неправильно [почти наверняка]), но вы все еще можете проверить, как связать ваше приложение с помощью system-builder here;

• webpack: Я в настоящее время использую webpack. В Webpack есть инструмент разработчика, называемый webpack-dev-server, который связывает приложение практически с памятью, что ускоряет процесс во время разработки (+ горячая перезагрузка). Вы можете найти быстрый video tutorial здесь и более подробное описание документации Angular 2 here. Чтобы использовать webpack, вы должны установить пакеты webpack (и webpack-dev-server, если хотите): npm i -S webpack webpack-dev-server, создайте файл webpack.config.js и запустите его, используя только webpack, чтобы просто сгенерировать файл пакета или webpack-dev-server --inline. создайте сервер, который автоматически переустанавливается с вашими изменениями. --inline опция позволяет автоматически перезаряжает в окне браузера:

  // webpack.config.js file 
  module.exports = { 
      entry: 'SRC_DIR/main.js', 
      output: { 
       path: 'BUILD_DIR', 
       filename: 'bundle.js' 
      } 
  } 
  

  Теперь вставьте свой файл bundle.js на вашем index.html: <script src="BUILD_DIR/bundle.js"></script>

Эти два последних варианта позволит вам создавать набор всего приложения, которое можно вручную включить в файл index.html.

Answer 3

1) con-cat все файлы js и css-файлы включают в себя index.html, используя gulp-concat.

2) Объединение угловых библиотек и компонентов приложений, упомянутых в файле systemjs.config.js. Использование глотки systemjs-builder.

3) Объясните связки, используя gulp-uglify.