如何在Angular 5应用中使用CLI创建@ngrx相关文件？

嘿，这事儿我门儿清！要在Angular 5里用类似Angular CLI创建组件的命令，一键生成@ngrx的effects、actions、reducers等文件（包括对应的.spec.ts测试文件），你得用上**@ngrx/schematics**——它就是为了和Angular CLI无缝配合而生的，用法和你熟悉的ng g c几乎一模一样。下面给你详细拆解每个操作：

第一步：先装依赖 #

因为你用的是Angular 5，得对应安装兼容版本的@ngrx/schematics（ngrx 5.x系列），打开Windows命令提示符跑这个命令：

npm install @ngrx/schematics@5 --save-dev

或者用yarn的话：

yarn add @ngrx/schematics@5 --dev

（可选）设置默认schematics #

要是不想每次命令都加额外参数，可以把@ngrx/schematics设为默认集合，这样直接用ng g命令就会调用它：

ng config cli.defaultCollection @ngrx/schematics

要是之后想切回Angular默认的schematics，再跑ng config cli.defaultCollection @schematics/angular就行。

各个文件的生成命令 #

1. 生成Effects文件 #

想创建effects和对应的测试文件？直接用：

ng g effect <文件名>

比如生成user.effects.ts和user.effects.spec.ts：

ng g effect user

如果要指定把effects注册到某个子模块（比如user模块），加--module参数：

ng g effect user --module=app/user/user.module.ts

执行后，schematics会自动帮你把EffectsModule.forFeature([UserEffects])导入到指定模块里，省得手动写。

2. 生成Actions文件 #

生成actions文件和测试文件的命令：

ng g action <文件名>

比如生成user.actions.ts：

ng g action user

要是不想把文件直接放在根目录，想单独建个文件夹存，加--flat=false参数：

ng g action user --flat=false

这样会自动创建user文件夹，把actions文件和测试文件都放在里面。

3. 生成Reducers文件 #

生成reducer和测试文件的命令：

ng g reducer <文件名>

比如生成user.reducer.ts和user.reducer.spec.ts：

ng g reducer user

还可以直接指定初始状态，省得手动写：

ng g reducer user --initialState='{ name: "", age: 0 }'

同样，加--module参数可以指定把reducer注册到某个模块的StoreModule里。

4. 一键生成整个Feature Store（推荐！） #

如果你的项目是按feature组织的，想一次性生成某个feature对应的actions、reducers、effects和所有测试文件，用feature命令最方便：

ng g feature <feature名>

比如生成user相关的整套ngrx文件：

ng g feature user

执行后会创建user文件夹，里面包含：

• user.actions.ts + 测试文件
• user.reducer.ts + 测试文件
• user.effects.ts + 测试文件
  而且会自动在指定模块里导入StoreModule.forFeature('user', userReducer)和EffectsModule.forFeature([UserEffects])，简直省了超多手动配置的活儿！

关于State接口 #

一般来说，生成reducer的时候，schematics会自动帮你创建对应的State接口（比如UserState）。如果需要单独创建，用Angular CLI的接口命令就行：

ng g interface user/UserState

内容的提问来源于stack exchange，提问作者Jeyabalan Thavamani