Angular2快速入门：我应该如何包括新的npm软件包？

Question

我通过克隆angular2快速入门仓库来设置环境： https : //github.com/angular/quickstart 。 将新包添加到system.config.js文件后，该应用程序运行，但“ npm测试”失败。 我注意到有一个名为systemjs.config.extras.js的空文件，是否应该在其中添加一些代码？

问题：应如何在angular2快速入门示例中添加新的npm软件包，以便“ npm start”和“ npm test”都能通过？

Answer 1

将新包添加到system.config.js文件后，该应用程序运行，但“ npm测试”失败

我假设您正在使用Karma。 您需要做的是将该第三方库添加到karma.conf.js文件中的files数组中。

它的工作原理是，因果报应启动服务器，并将files数组中列出的所有文件添加到该服务器可提供的文件列表中。 因此，当SystemJS尝试加载文件时，如果它不在karma files ，则该文件在服务器上不存在。 因此，当您尝试从SystemJS检索该文件时，将得到404。

Answer 2

您应该尝试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

然后将所需的脚本文件添加到agular-cli.json文件中的apps[0].script s中：

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

最后，将Bootstrap CSS添加到agular-cli.json的apps[0].styles数组中：

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

最后，您可以从新创建的项目的根目录使用ng serve部署应用程序。