配置环境:
1.首先我们安装nodejs,(百度NodeJs即可)
2.安装完成后测试:
node -v,npm-v
若npm-v报错:打开你的安装路径
修改npmrc文件中的路径改为你的npm的 路径
3.安装cli : npm install -g @angular/cli
4.安装完成后测试 ng -v验证是否安装成功,可能出现ng不是命令错误,将ng的目录配置在环境变量path中即可。
5.下载WebStorm
HelloWorld项目:
1. 命令行进入工作区间,ng new 项目名称 比如 ng new HelloWordDemo,项目目录结构如下
2.引用插件库,比如我们使用jquery 命令行进入工作区间:
执行npm install jquery --save,
第三方插件下载自动下载到node_modules中,在.angular-cli.json中
引用你的第三方插件如图所示:
3.组件:新建组件模块
按照自己的项目设计,比如需要新建header部分执行命令:ng g component header
,在app.component.html中引用组件完成框架的搭建如图所示:
在生成的组件中编写各部分的代码即可。