angular的项目基本配置的了解

创建Angular的脚手架

1.在全局安装Angular脚手架环境(安过就不用在安了)

npm install -g @angular/cli 

2.在本地文件夹中创建angular项目(找好要安装到那个目录中,在那个目录下cmd)

3.进入项目 启动项目

npm start 或者 ng serve(ng serve --open --open代表自动打开浏览器 简写为 -o)

ng serve --port 4300(改变默认端口号)

 

angular的版本

Angular.js 代表1.x版本 现在依然在维护中,不在做升级 它是一个框架模式是 MVC

Angular 代表2.x版本以上 它的版本升级比较快 它的框架是 MVVM

Angular 欧美公司 企业用的比较多

Angular 是谷歌开发的

typeScript是微软开发的 js超级塔并不是一门新的语言 它是在js的基础上增加了数据定义类型 真正意义上去实现面向对象的概念

项目文件夹目录

e2e 端到端的测试

node_modules 第三方包管理

src 代码文件夹

.editorconfig 代码编辑器的配置

.gitignore 指定git应忽略的不必追踪的文件

README.md 根应用的简介文档

angular.json

为工作区中的所有项目指定cli的默认配置,包括cli要用到的构建、启动开发服务器和测试工具的配置项,比如TSLint,Karma和Protractor。

package.json

配置工作空间中所有项目可用的npm包依赖。有关此文件的具体格式和内容

tsconfig.json

工作空间中各个项目的默认 TypeScript配置

tslint.json

工作空间中各个项目的默认 TSLint配置

 

src 文件夹中的配置

app 根组件相关的配置文件

assets 静态资源管理

environments/

包含特定目标环境的构建配置项。默认情况下,有一个无名的标准开发环境和一个生产("prod")环境。你还可以定义其他的目标环境配置

favicon.ico

用作该应用在标签栏中的图标

index.html

当有人访问你的站点的时候,提供服务的主要HTML页面,CLI会在构建你的应用时自动添加所有的JavaScript和css文件,所以你通常不用手动添加任何<script>或者<link>标签

main.ts 入口文件

polyfills.ts 浏览器支持的脚本

style.css 样式文件

test.ts 测试文件

app这个根组件的配置

app-routing.modul.ts 路由相关的配置文件(单独下载的)

app/app.component.ts

为应用的根组件定义逻辑,名为 AppComponent 。当你向应用中添加组件和服务时,与这个根组件相关联的视图就会成为视图树的根

app/app.component.html

定义与根组件 Appcomponent 相关的HTML模板

app/app.component.css 

为根组件 AppComponent 定义了基本的CSS 样式表

app/app.component.spec.ts

为根组件 AppComponent定义一个单元测试

app/app.module.ts

定义了名为AppModule的根模块,它会告诉Angular如何组装应用。这里最初只声明一个 AppComponent。当你向应用中添加更多组件时,它们也必须在这里声明

在angular中 快速创建一个组件

ng g c component/index(后面这个是文件夹名字)

posted @ 2019-12-31 16:15  violinh  阅读(599)  评论(0编辑  收藏  举报