Question

我已经使用Angular-CLI创建了一个Angular2项目，但是当我尝试安装外部依赖项时，编译器不会将该文件夹从node_modules移动到dist / vendor。

这就是我所做的：

$ npm install --save angular2-google-maps
$ ng serve

我的组件文件：

import {Component} from 'angular2/core';
import {ANGULAR2_GOOGLE_MAPS_DIRECTIVES} from 'angular2-google-maps/core';

@Component({
  selector: 'contact',
  templateUrl: 'app/components/contact/contact.html',
  styleUrls: ['app/components/contact/contact.css'],
  providers: [],
  directives: [ANGULAR2_GOOGLE_MAPS_DIRECTIVES],
  pipes: []
})
export class Contact {
  lat: number = 51.678418;
  lng: number = 7.809007;
  constructor() {}
}

当我运行 ng serve 并转到网络浏览器时，我收到以下错误：

无法加载资源：服务器响应状态为404（未找到）http://localhost:4200/angular2-google-maps/core

Answer 1

如指南中所述：https://angular-maps.com/docs/getting-started.html#package-installation

您是否包含了以下脚本？

 <script src="node_modules/angular2-google-maps/bundles/angular2-google-maps.js"></script>

您是否按照以下方式注入了脚本？

bootstrap(AppComponent, [ANGULAR2_GOOGLE_MAPS_PROVIDERS]);

Answer 2

编译器将任何文件夹从src移动到dist。我在src中使用外部库创建了一个名为vendor的新文件夹，因此当编译器将此文件夹移至dist时，src/vendor将与dist/vendor合并，外部库现在可以访问。

我还添加了<script>引用。现在它有效！

Answer 3

我有同样的问题并通过在system-config.ts中的packages配置中添加以下行来解决它：

/** User packages configuration. */
const packages: any = {
    'angular2-google-maps': { defaultExtension: 'js' }
};

无法在Angular2中使用外部依赖项

3 个答案: