Angular入门-运行
来源:互联网 发布:淘宝销售额统计 编辑:程序博客网 时间:2024/06/08 11:32
一、搭建环境
1.安装nodeJs和npm(npm是伴随着nodejs一起安装的),并且注意的是:要确保nodejs是6.9.x,npm是3.x.x,越新版本的越好,旧版本的容易出问题。
2.安装angular全局客户端:
npm install -g @angular/cli
二、创建新项目
1.打开终端创建一个angular的骨架程序,输入如下命令:
ng new my-app
这里要注意的是,新建的项目安装需要一定的时间,因为大多数需要安装依赖的npm包。
三、运行项目
安装完之后,就可以输入命令:ng serve,去运行项目了,此时angular客户端会监视你的系统文件,当文件有所变更的时候客户端会重新生成。如果运行:ng serve --open或者ng serve -o,则将自动打开你的浏览器,访问http://localhost:4200/
.。
四、编辑项目
1.CLI客户端会为你创建一个Angular组件,你可以在./src/app/app.component.ts文件中编辑title:
2.你可以在src/app/app.component.css文件中给组件一些样式:
五、文件结构
1.先看src文件夹:
刚开始我们关注的是程序的入口,先来看看angular的运行机制:
先要import某个组件,才能在本程序文件中调用:
2.外层目录
此处介绍一下angular-cli.json的一些配置,如下图所示:"apps"-"root"下配置了原代码的路径,"apps"-"outDir"配置了打包后的输出路径。
先记下目录的用处,后面开发的时候能快速上手。虽然有些用处暂时还没有了解,用到的时候自然会去深入。
阅读全文
0 0
- Angular入门-运行
- angular入门
- Angular----入门
- angular入门
- Angular入门
- angular入门
- Angular入门
- angular入门
- Angular入门
- angular入门
- angular入门
- Angular.js入门
- Angular-seed 入门
- Angular JS 入门学习
- angular入门学习之一
- angular translate入门示例
- Angular JS入门
- Angular入门2
- TensorFlow全新的数据读取方式:Dataset API入门教程(转)
- 数据库中删除重复数据
- MFC EnterCriticalSection 卡死问题
- postcss webpack3.0配置
- Log4J日志配置详解
- Angular入门-运行
- SELinux分析
- 极光推送iOS接入代码(含设置别名)
- Oracle概念与基本操作
- 设备像素比
- 打造前端 Deepin Linux 工作环境——开机自动加载 ~/.bash_profile 文件
- 阿里技术面试
- The requested URL was not found on the server
- 可视化作业 11/6