如何在使用angular-cli构建的angular2项目中包含Underscore.js

Question

我想在使用angular-cli构建的angular2项目中包含underscore.js .直到现在我无法这样做.我到目前为止尝试过:

1- npm安装下划线--save

2- tsd安装下划线

3- script src ="node_modules/underscore/underscore.js",index.html中的引用

4-在system-config.js中

/** Map relative paths to URLs. */
var map = {
    'underscore': '../node_modules/underscore/underscore.js'
};
/** User packages configuration. */
var packages = {
    'underscore': '../node_modules/underscore/underscore.js'
};

5- import*as _ from'underscore';

但是在运行期间,underscore.js没有被复制到'dist'目录中,并且浏览器抱怨没有找到underscore.js.我想我在第4点缺少一些东西.当我开始学习angular2时,非常感谢任何帮助.请记住,这个项目是由angular-cli制作的,而不是任何其他种子项目.除了Underscore.js,项目工作正常.

[编辑] package.json在依赖项中有"下划线":"^ 1.8.3"

Answer 1

使用Angular CLI 1.0.0-rc.1,这里描述了推荐的解决方案:

Angular2 2.4如何将外部库作为Underscore加载到angular2中.

npm install underscore --save // save to dependencies: required to run
npm install @types/underscore --save-dev // save to dev dependencies: required in dev mode

然后在你的组件类中:

import * as _ from 'underscore';
...
subtitle = _.head(['xyz'])

另外,还有另一种方法可以在angular-cli中加载"静态"脚本,如https://www.npmjs.com/package/angular-cli#global-library-installation所述:

在.angular-cli.json中,将其添加到scripts数组中:

"scripts": ["../node_modules/underscore/underscore.js"]

这将加载underscore.js,但这不是一个让它可用于您的typescript类的好方法.

Answer 2

您的项目中是否有一个名为 Package.json 的文件？如果是，您可以尝试添加这一行

"underscore": "^1.8.3",

在此文件的依赖项中。

system-config.ts 中的修改

var map = {

    "underscore": "node_modules/underscore",

  };

var packages = {
    'underscore':            { main: 'index.js', defaultExtension: 'js' }
  };

  var packageNames = [
    '@angular/common',
    '@angular/compiler',
    '@angular/core',
    '@angular/http',
    '@angular/platform-browser',
    '@angular/platform-browser-dynamic',
    '@angular/router-deprecated',
    '@angular/testing',
    '@angular/upgrade',
  ];

packageNames.forEach(function(pkgName) {
    packages[pkgName] = { main: 'index.js', defaultExtension: 'js' };
  });

var config = {
    map: map,
    packages: packages,
    paths: {
      "underscore": "/node_modules/underscore.js"
    }
  };

然后进行 npm 安装。