Angular CLI ng 创建模块和组件,支持多级目录

Lasted 2020-11-23 20:01:43

Angular CLI 是一个命令行界面工具,可用于初始化、开发、构建和维护 Angular 应用。 你可以在命令行窗口中直接使用此工具,也可以通过 Angular Console 这样的交互式界面来间接使用。

创建模块

通过 ng generate module 命令可以创建或修改模块,在 pages/monitor 目录下创建 welcome 模块命令如下:

ng generate module pages/monitor/welcome
简写
ng g m pages/monitor/welcome
CREATE src/app/pages/monitor/welcome/welcome.module.ts (193 bytes)

命令运行成功后会自动创建 welcome.module.ts,包括自动创建 /pages/monitor/welcome 目录。

创建组件

通过 ng generate component 命令可以创建或修改组件,在 pages/monitor 目录下创建 welcome 组件命令如下:

ng generate component pages/monitor/welcome
简写
ng g c pages/monitor/welcome
CREATE src/app/pages/monitor/welcome/welcome.component.scss (0 bytes)
CREATE src/app/pages/monitor/welcome/welcome.component.html (22 bytes)
CREATE src/app/pages/monitor/welcome/welcome.component.spec.ts (633 bytes)
CREATE src/app/pages/monitor/welcome/welcome.component.ts (280 bytes)
UPDATE src/app/pages/monitor/welcome/welcome.module.ts (265 bytes)

如果目录下没有 welcome.module.ts,会出现下面的错误,可以使用 skip-import 参数跳过检查或者先创建一个模块再创建组件。

More than one module matches. Use the skip-import option to skip importing the component into the closest module or use the module option to specify a module.