Быстрый запуск Angular2: как включить новый пакет npm?

Я настраиваю среду, клонируя репозиторий быстрого запуска angular2: https://github.com/angular/quickstart. После того, как я добавил новый пакет в файл system.config.js, приложение запустилось, но «тест npm» не удался. Я заметил, что есть пустой файл с именем systemjs.config.extras.js, нужно ли добавить туда код?

Вопрос: как добавить новый пакет npm в пример быстрого запуска angular2, чтобы можно было пройти как «npm start», так и «npm test»?


person Ng2-Fun    schedule 21.11.2016    source источник
comment
работал ли тест npm перед попыткой добавления нового пакета?   -  person Bean0341    schedule 22.11.2016


Ответы (2)


После того, как я добавил новый пакет в файл system.config.js, приложение запускается, но «тест npm» не выполнен

Я предполагаю, что вы используете Карму. Что вам нужно сделать, так это добавить эту стороннюю библиотеку в массив files в файле karma.conf.js.

Как это работает, карма запускает сервер и добавляет все файлы, перечисленные в массиве files, в список файлов, которые сервер может обслуживать. Поэтому, когда SystemJS пытается загрузить файл, если его нет в карме files, значит, файл не существует на сервере. Таким образом, вы получите 404 при попытке получить этот файл из SystemJS.

person Paul Samsotha    schedule 22.11.2016
comment
Да, репозиторий быстрого запуска использует Karma для тестирования. Упомянутый вами способ кажется неподходящим для обслуживания: всякий раз, когда добавляется новый пакет, вам нужно добавить его как в файлы system.config.js, так и в файлы karma.conf.js. Я думал, что systemjs.config.extras.js может использоваться для добавления туда нового пакета и использоваться как для реализации функциональности, так и для тестирования. Или я могу ошибаться. - person Ng2-Fun; 22.11.2016

Вы должны попробовать angular-cli, который является рекомендуемым способом работы с angular2. Чтобы создать новый проект, вам нужно установить angular-cli с помощью команды

npm install -g angular-cli

то вы можете создать новый проект angular2 с

ng new your-new-project-name

и, наконец, добавить новую глобальную зависимость, следуя этому руководству (https://github.com/angular/angular-cli#global-library-installation). Я воспроизвожу содержимое здесь для начальной загрузки.

npm install bootstrap@next

Затем добавьте необходимые файлы скриптов в apps[0].scripts в agular-cli.json файле:

"scripts": [
  "../node_modules/jquery/dist/jquery.js",
  "../node_modules/tether/dist/js/tether.js",
  "../node_modules/bootstrap/dist/js/bootstrap.js"
],

Наконец, добавьте Bootstrap CSS в массив apps[0].styles в agular-cli.json:

"styles": [
  "../node_modules/bootstrap/dist/css/bootstrap.css",
  "styles.css"
],

Наконец, вы можете развернуть свое приложение с помощью ng serve из корня только что созданного проекта.

person Nicolas Henneaux    schedule 21.11.2016
comment
Спасибо за ваше предложение. Однако наша команда уже решила не использовать angular-cli, отчасти потому, что он плохо работает с PhpStorm IDE. Поэтому я должен работать на основе примера быстрого запуска. - person Ng2-Fun; 22.11.2016