脚手架(ng add)

0
视频
0
完成
0%
进度
0
分钟
0
完成
0%
进度

在 Angular 项目里,使用 Ant Design,也就是 Ng Zorro,最简单的方法应该是使用 ng add 命令。 在终端,项目所在目录的下面,可以执行一下 ng add ,后面是要添加的东西,ng-zorro-antd, ng 指的是 Angular,zorro 是 Ant Design 在 Agnular 上的名字。antd 表示的是 ant design 。

添加这个包的时候会问一些问题。是否要添加 Ant Design 里的一些图标资源,输入 y 表示确定。 又提示是否需要自定义主题文件,再输入一个 y 。

Choose your locale code ,选择本地化的代码,项目可以是多语言的,这里可以选择一种语言的代号, en_US 表示的是美国地区的英文,zh_CN 表示的是简体中文。 先选择 en_US 。

Choose template to create project,选择一个模板, blank 是空白模板,下面还有一个 sidemenu,一个带边栏的模板。 命令会根据我们的选择修改项目里的一些东西。

这个命令会给项目安装并且配置好 Ant Design,在 Angular 里面, Ant Design 叫做 ng-zorro 。

完成以后,先到浏览器上预览一下。如果发现页面没有反应,应该是开发服务遇到了问题,回到终端,可以重新运行一下项目的开发服务。

现在你看到的就是一个用了 Ant Design 的 Angular 项目。 项目用了 sidemenu 模板,我们可以基于这个模板去开发自己的项目。

这个模板有个边栏,上面有一些菜单项目。 这个边栏可以收起来,收起来菜单项目只会显示图标。鼠标放在图标上面,会显示它里面的菜单项目。

脚手架(ng add)《 Angular:Ant Design 》

统计

14696
分钟
0
你学会了
0%
完成

社会化网络

关于

微信订阅号

扫描微信二维码关注宁皓网,每天进步一点