笔者写于2021年7月13日,如果读者看到时觉得间隔太久,建议以官方文档为准
angular(简称ng)是js的三大框架之一,窃以为揉合了react与vue的思想(认知所限,目前暂以为)。由于项目需要,便提前学习一些作为知识储备。
项目需求:使用antd-ng作为ui框架,使用ng作为技术框架
一:安装
读者请务必保证本机有node且应为较新环境
npm install -g @angular/cli
命令行下使用ng --version
检查是否安装成功
命令行中出现以上字样即说明ng在本地安装成功。
二:使用cli创建项目
使用ng new projectname
创建项目,不允许有大写字母:
ng new myng2
回车
回车后可能会无响应,此时可以ctrl+c
停止并再次执行ng new myng2
命令
此时会弹出以下问题:想要添加ng路由吗?
点击Y
弹出以下问题:选择哪种css语言? css/less/sass/scss,上下方向键选中,enter确定
随即将进入安装阶段,等待即可
随后cd myng2
执行 npm run ng
运行项目
默认情况下,项目会跑在http://localhost:4200/
输入页面回显hello,world
main.ts
是项目的入口文件,导入了app目录,app目录是项目的页面的入口项,即所有页面的根页面
app.html
删除所有冗余代码,保留<router-outlet></router-outlet>
<!-- app.html -->
<div>
hello,world
</div>
<router-outlet></router-outlet>
app.html
中主要写页面,逻辑写在app.ts
中
今天第一次学习ng,大致了解下流程
以上。