Angular基础知识

angular

angular cli

安装 angular cli

npm install -g @angular/cli

卸载

npm uninstall -g @angular/cli

node 升级

1. 清除npm缓存

npm cache clean -f 

2. 安装n 模块

   npm install -g n
   

3. 升级node到稳定版本

   n stable 
   

4. 查看 node的版本

   node -v
   

Ng ant-design

引入 ant design

$ ng new PROJECT_NAME
$ cd PROJECT_NAME
$ npm install ng-zorro-antd --save

使用全部组件样式

该配置将包含组件库的全部样式，如果只想使用某些组件请查看 使用特定组件样式 配置。

在 angular.json 中引入了

{
  "styles": [
    "node_modules/ng-zorro-antd/ng-zorro-antd.min.css"
  ]
}

在 style.css 中引入预构建样式文件

@import "~ng-zorro-antd/ng-zorro-antd.min.css";
@import "~ng-zorro-antd/style/index.min.css"; /* 引入基本样式 */
@import "~ng-zorro-antd/button/style/index.min.css"; /* 引入组件样式 */

引入模块组件

以下面的 NzButtonModule 模块为例，先引入组件模块：

import { NgModule } from '@angular/core';
import { NzButtonModule } from 'ng-zorro-antd/button';
import { AppComponent } from './app.component';

@NgModule({
  declarations: [
    AppComponent
  ],
  imports: [
    NzButtonModule
  ]
})
export class AppModule { }

然后在模板中使用：

<button nz-button nzType="primary">Primary</button>

清除缓存

 npm cache clean -f