angularjs sill 创建项目_AngularJS快速上手,从安装到运行
0、先决条件
在开始之前,请确保你的开发环境已经包含了 Node.js和 npm 包管理器。
Node.js
Angular 需要 Node.js 的 8.x 或 10.x 版本。
要想检查你的版本,请在控制台窗口中运行 node -v 命令。
C:\Users\Administrator>node -v
v8.12.0
要想安装 Node.js,请访问 nodejs.org。
npm 包管理器
Angular、Angular CLI 和 Angular 应用都依赖于由一些库所提供的特性和功能,它们主要是 npm 包。要下载和安装 npm 包,你必须拥有一个 npm 包管理器。
本文中使用的是npm命令行方式,它已经在安装 Node.js 时默认安装上了。
要想检查你是否已经安装了 npm 客户端,请在终端/控制台窗口中运行npm -v命令。
C:\Users\Administrator>npm -v
6.4.1
1、安装 Angular CLI
本文用 Angular CLI 的方式来创建项目、创建应用和库代码,并执行多种开发任务,比如测试、打包和发布。
通过npm来安装CLI,请打开控制台窗口,并输入下列命令:
C:\Users\Administrator>npm install -g @angular/cli
2、创建项目
选择一个位置(工作空间)来创建Angular应用来开发, 每个项目都是一组由应用、库或端到端(e2e)测试构成的文件。
运行 Angular CLI 命令 ng new创建项目AngularJS-Learning,如下所示:
I:\Angular>ng new AngularJS-Learning
? Would you like to add Angular routing? Yes
? Which stylesheet format would you like to use? CSS
CREATE AngularJS-Learning/angular.json (3876 bytes)
CREATE AngularJS-Learning/package.json (1326 bytes)
CREATE AngularJS-Learning/README.md (1034 bytes)
CREATE AngularJS-Learning/tsconfig.json (408 bytes)
CREATE AngularJS-Learning/tslint.json (2837 bytes)
CREATE AngularJS-Learning/.editorconfig (245 bytes)
CREATE AngularJS-Learning/.gitignore (503 bytes)
CREATE AngularJS-Learning/src/favicon.ico (5430 bytes)
CREATE AngularJS-Learning/src/index.html (304 bytes)
CREATE AngularJS-Learning/src/main.ts (372 bytes)
CREATE AngularJS-Learning/src/polyfills.ts (3234 bytes)
CREATE AngularJS-Learning/src/test.ts (642 bytes)
CREATE AngularJS-Learning/src/styles.css (80 bytes)
CREATE AngularJS-Learning/src/browserslist (388 bytes)
CREATE AngularJS-Learning/src/karma.conf.js (964 bytes)
CREATE AngularJS-Learning/src/tsconfig.app.json (166 bytes)
CREATE AngularJS-Learning/src/tsconfig.spec.json (256 bytes)
CREATE AngularJS-Learning/src/tslint.json (314 bytes)
CREATE AngularJS-Learning/src/assets/.gitkeep (0 bytes)
CREATE AngularJS-Learning/src/environments/environment.prod.ts (51 bytes)
CREATE AngularJS-Learning/src/environments/environment.ts (662 bytes)
CREATE AngularJS-Learning/src/app/app-routing.module.ts (245 bytes)
CREATE AngularJS-Learning/src/app/app.module.ts (393 bytes)
CREATE AngularJS-Learning/src/app/app.component.html (1173 bytes)
CREATE AngularJS-Learning/src/app/app.component.spec.ts (1131 bytes)
CREATE AngularJS-Learning/src/app/app.component.ts (222 bytes)
CREATE AngularJS-Learning/src/app/app.component.css (0 bytes)
CREATE AngularJS-Learning/e2e/protractor.conf.js (752 bytes)
CREATE AngularJS-Learning/e2e/tsconfig.e2e.json (213 bytes)
CREATE AngularJS-Learning/e2e/src/app.e2e-spec.ts (314 bytes)
CREATE AngularJS-Learning/e2e/src/app.po.ts (208 bytes)
npm WARN deprecated circular-json@0.5.9: CircularJSON is in maintenance only, fl
atted is its successor.
[ .......] - extract:mime: sill tarball trying lcid@^1.0.0 by hash: s
......
ng new 会提示你要把哪些特性包含在初始的应用项目中,请按 Enter 或 Return 键接受默认值即可。创建项目过程中会下载安装依赖的包,所有创建项目过程受网络状况,需要花费一会儿的时间,那就慢慢等待吧,不妨利用这个等待时间看看其他东西,也挺好的。
3、运行
Angular 包含一个开发服务器,以便你能在本地轻松地构建应用和启动开发服务器。
进入工作空间目录(my-app)。
使用 CLI 命令 ng serve启动开发服务器,并带上 --open 选项。
I:\Angular\AngularJS-Learning>ng serve --open
ng serve 命令会自动开发服务器,并监视你的文件变化,当你修改这些文件时,它就会重新构建应用。
--open(或只用 -o)选项会自动打开浏览器,并访问 http://localhost:4200/
看,你的应用使用一条消息在欢迎你:
angularjs sill 创建项目_AngularJS快速上手,从安装到运行相关推荐
- angularjs sill 创建项目_开源项目——博客项目MyBlogs.Core,基于.NET 5
个人博客站项目源码,高性能低占用的博客系统,这也许是我个人目前写过的性能最高的web项目了 .目前日均处理请求数80-120w次,同时在线活跃用户数30-100人,数据量累计已达到100多万条,数据库 ...
- vscode怎么运行android项目,windows + flutter +android+ vscode 安装配置运行流程(详细版本)...
flutter 是由谷歌发布的一个全新的响应式.跨平台.高性能的移动开发框架,可以快速在iOS和Android上构建高质量的原生用户界面. 框架特点 快速开发:Flutter的热重载可以快速地进行测试 ...
- IDEA2021 JavaWeb项目(WebApplication)快速上手 解决无法解析jsp文件、添加框架中没有WebApplication等问题
第一步 选中插件 File - Settings - Plugins - Installed 在搜索框中搜索Java EE,将搜索出来的所有内容都打上勾,该重启就重启. 第二步 新建项目 File - ...
- 反思对新项目如何快速上手
1.从宏观上去理解 :是什么 是干什么的 作用是什么: 2.理清数据表结构 导出数据表结构 进行理解业务流程: 3.理清业务流程 找到总体的业务框架 进行理解 最好有流程图 一般产品都会有 ...
- 快速上手opencv_contrib安装(Windows11)
目录 一.安装资料准备 二. 安装编译 1. cmake安装 2. opencv4.2.0源代码编译和opencv4.2.0_contirb解压 3. opencv编译 4. oppencv_cont ...
- 基于PHPEnv的本地环境搭建—PHP第一个项目:HelloWorld(从安装到运行)
1.安装软件 编程工具:Notepad++ 运行环境:phpEnv 2.用phpEnv建立本地运行环境 (1)官方下载phpEnv,运行phpEnv,启动服务.服务启动之后,apache和mysql变 ...
- Golang zap 快速上手
文章目录 1.zap 是什么? 2.zap 快速上手 1.安装 Zap 2.创建 Logger 3.配置 Logger 4.记录日志 5.输出日志 6.添加 Caller 信息 3.日志滚动 4.小结 ...
- Golang logrus 快速上手
文章目录 1.logrus 是什么? 2.logrus 快速上手 1.安装 logrus 2.创建 Logger 对象 3.配置 Logger 对象 4.打印日志 5.输出日志 3.logrus 实现 ...
- Python小爬虫之协程爬虫快速上手
文章目录 前言 协程 协程快速上手 协程异步运行 工作流程 任务管理 aiohttp 异步保存 异步回调 前言 爬虫是个好东西,最近要用用这玩意,所以顺便把以前的小东西给发出来,水几篇博客~ 协程 首 ...
- vue脚手架创建项目
文章目录 什么是脚手架(vue-cli) 通过脚手架创建项目 脚手架的安装 3.x版本以上脚手架创建项目 命令框创建项目 使用 ui 界面创建项目 3.x 版本基于2.x的旧模板创建项目 两个版本项目 ...
最新文章
- getbytes方法_关于C#中识别和查找中英文字符串的解决方法和字符串处理方式的笔记...
- 小实验:用创建进程()打开计算器,然后关闭进程句柄。再用打开进程(进程ID),使用两次,得到两个进程句柄。实验目的:这两个进程句柄都能控制这个进程吗?通过该试验加深对句柄的理解!!...
- 学python有必要买书吗-要不要学python
- 使用php操作qq第三方登录
- java log4j logback jcl_内部分享:如何解决Java日志框架冲突问题。
- dx postprocess
- 服务器内存条故障显示器,客户的电脑原故障是不开机,现在又变成蓝屏:变着法加钱就搞鬼...
- WinForm------TreeList修改节点图标和按钮样式
- PipedInputStream/PipedOutputStream
- paip.网站提示SESSION过期 登录过期 以及二次登录的问题
- 算法:插入排序、归并排序、快速排序、堆排序
- 管家婆显示服务器没有加密狗,管家婆软件阿拉丁狗找不到加密狗
- vs2008 sp1 C++ 发布程序 .
- 论文阅读:Deep learning—Yann LeCun, Yoshua Bengio Geoffrey Hinton
- 分享12个高质量的PPT图片素材下载站
- 磁力链接搜索引擎源码下载
- html里 alt属性什么意思,HTML
- aras innovator: 分类筛选如何做?
- 2015Astar百度之星初赛 1001 超级赛亚ACMer
- android手势识别国内外研究现状,基于Android平台的视觉手势识别研究