angular-cli.json
angular-cli.json是Angular CLI的配置文件。 在这个文件中,我们可以设置一系列默认值,还可以配置项目编译时要包含的那些文件。
最常用的几个:
- assets指定资源文件目录
- main.ts 指定ng应用入口
- index.html 指定ng应用首页
- styles:[] 指定全局样式,用于第三方库的打包
- scripts:[] 指定全局脚本,用于打包第三方库,构建是进行打包
|
|
Angular引入第三方库
通过配置,很容易就可以解决Angular中如何使用JavaScript(ES5或者ES6)编写的库文件的问题。主要包括三步:引入样式、引入JS、添加全局声明。下面以leaflet为例:
- 引入css和js
|
|
- 在typings.d.ts中添加全局声明(后面再介绍什么是typings)
|
|
然后就可以愉快的在Angular中使用leaflet了,最简单的在组件中直接使用。熟悉了之后可以再进一步上层封装。
组件模板:
|
|
组件控制类:
|
|
说明
- 这里我使用了ng-zorro的layout组件:NG-Zorro
- 示例:https://543802360.github.io/demo/ng-leaflet/