Angular 2如何使用子依赖性angular-cli加载第三方供应商节点模块 [英] Angular 2 how to load 3rd party vendor node modules with sub dependencies angular-cli

问题描述

在Angular 2中加载单节点模块 Wiki中很好地描述了一个href ="https://github.com/angular/angular-cli" rel ="nofollow"> angular-cli 引导项目.只是好奇，如何在用angular-cli引导的项目中很好地加载更复杂的节点模块?

Loading a single node module in Angular 2 an angular-cli bootstraped project is described within the wiki pretty well. Just being curious, how do I nicely load a more complex node module within a project bootstrapped with angular-cli?

例如angular2-apollo依赖于几个子依赖项，例如apollo-client，graphql，lodash，...

E.g. angular2-apollo relies on several sub-dependencies like apollo-client, graphql, lodash, ...

我将节点模块添加到angular-cli-build.js

var Angular2App = require('angular-cli/lib/broccoli/angular2-app');

module.exports = function(defaults) {
  return new Angular2App(defaults, {
    vendorNpmFiles: [
      '...', 
      'angular2-apollo/**'
    ]
  });
};

并在中注册了节点模块ins system-config.js

const barrels: string[] = [
  // ...
  // Thirdparty barrels.
  'rxjs',
  'angular2-apollo',

  // App specific barrels.
  // ...
];

// ...

// Apply the CLI SystemJS configuration.
System.config({
  map: {
    '@angular': 'vendor/@angular',
    'rxjs': 'vendor/rxjs',
    'angular2-apollo':'vendor/angular2-apollo/build/src',

    'main': 'main.js',
  },
  packages: cliSystemConfigPackages
});

但是，这仅加载angular2-apollo.没有加载angular2-apollo的子依赖项.如何在angular-cli引导项目中使用system.js加载子依赖项?

However this is only loading angular2-apollo. The sub-dependencies of angular2-apollo are not getting loaded. How do I load subdependencies with system.js within angular-cli bootstraped project?

推荐答案

因此，您面临System.js的一个非常烦人的问题，并且在Angular CLI上有一个关于此的公开问题:

So, you are facing a really annoying problem with System.js and there is an open issue about that on the Angular CLI here: https://github.com/angular/angular-cli/issues/882

这基本上意味着您必须在system.config.ts文件中指定所有依赖项，并将它们全部加载到angular-cli-build.js文件中....我知道这太可怕了...

It basically means you have to specify all the dependencies in the system.config.ts file and load them all in the angular-cli-build.js file.... horrible I know...

也许将来会发生: https://github.com/angular/angular-cli/issues/909

但是，直到Angular CLI变得更好之前，这是一个包含Angular 2.0和angular2-apollo及其所有依赖项(甚至包括模拟GraphQL服务器)的入门应用程序.-

But, until the Angular CLI will become better, here is a starter app that includes Angular 2.0 and angular2-apollo with all it's dependencies (and even with a mock GraphQL server..) - https://github.com/Urigo/apollo-ship

您可以查看 system.config.ts 和 angular-cli-build.js 中的内容，以了解如何包含对angular2-apollo，apollo-client，lodash(及其所有想要的依赖项)，redux以及更多(太多....)

You can check out the system.config.ts and the angular-cli-build.js in there to see how to include dependencies on angular2-apollo, apollo-client, lodash (and all the wanted dependencies of it), redux and many many more (too many....)

这篇关于Angular 2如何使用子依赖性angular-cli加载第三方供应商节点模块的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！