相关疑难解决方法(0)

我们想在使用angular-cli 1.0.0-beta.5(w/node v6.1.0)生成的应用程序中使用bootstrap 4(4.0.0-alpha.2).

在使用npm获取引导程序及其依赖项后,我们的第一种方法是将它们添加到angular-cli-build.js:

  'bootstrap/dist/**/*.min.+(js|css)',  
  'jquery/dist/jquery.min.+(js|map)',  
  'tether/dist/**/*.min.+(js|css)',

并将它们导入我们的 index.html

  <script src="vendor/jquery/dist/jquery.min.js"></script>
  <script src="vendor/tether/dist/js/tether.min.js"></script>
  <link rel="stylesheet" type="text/css" href="vendor/bootstrap/dist/css/bootstrap.min.css">
  <script src="vendor/bootstrap/dist/js/bootstrap.min.js"></script>

这很好用,ng serve但是一旦我们生成了带有-prod标志的构建,所有这些依赖关系都消失了dist/vendor(惊喜!).

我们打算如何在使用angular-cli生成的项目中处理这种情况(即加载引导程序脚本)？

我们有以下想法,但我们真的不知道要走哪条路......

• 使用CDN？但我们宁愿提供这些文件以保证它们可用

• 复制依赖关系到dist/vendor我们之后ng build -prod？但这似乎是angular-cli应该提供的东西,因为它"照顾"构建部分？

• 在src/system-config.ts中添加jquery,bootstrap和tether,并以某种方式将它们拉入main.ts中的bundle中？但考虑到我们不打算在我们的应用程序代码中明确使用它们(例如,不像moment.js或像lodash这样的东西),这似乎是错误的

Mac OSX El capitan | angular-cli:0.1.0 | 节点:5.4.0 | os:darwin x64

我尝试根据angular-cli wiki安装第三方npm模块:https://github.com/angular/angular-cli/wiki/3rd-party-libs但是失败了.我几天来一直在努力奋斗,非常感谢任何帮助.

获取错误的步骤:

ng new lodashtest3 cd lodashtest3 npm install lodash --save typings install lodash --ambient --save

角-CLI-build.json:

module.exports = function(defaults) { return new Angular2App(defaults, { vendorNpmFiles: [ ... 'lodash/**/*.js' ] }); }; ng build (lodash在dist/vendor中正确添加)

系统config.ts:

/** Map relative paths to URLs. */
 const map: any = {
   'lodash': 'vendor/lodash/lodash.js'
 };

 /** User packages configuration. */
 const packages: any = {
   'lodash': {
     format: …

在Angular 2中加载单个节点模块,在wiki中很好地描述了一个angular-cli bootstraped项目.只是好奇,如何在一个用angular-cli引导的项目中很好地加载一个更复杂的节点模块？

例如angular2-apollo依赖于几个子依赖,如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/**'
    ]
  });
};

并注册了节点模块插件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 bootstraped项目中加载system.js的子依赖项？