Angular环境搭建
Angular4 随笔(一)----环境搭建
1.下载node.js
第一步:在浏览器中搜索node.js官网(https://nodejs.org/zh-cn/),根据自己系统下载相应版本,下载完成以后,下一步-->下一步--> ....安装完毕;
第二步:打开命令行工具,输入node -v 检查版本号,如下图时,说明node已经安装成功
注释:v8.11.3代表当前node.js版本号:v8.11.3
2.安装 angular-cli 命令工具
第一步:在命令行工具 输入 npm install -g @angular/cli
第二步:在命令行工具输入 ng -v 检查 angular-cli 命令工具是否安装成功,如下图:说明已经安装成功
3.使用angular-cli
第一步:创建angular项目
在命令行工具输入 ng new demo01 (ng new 项目名称),如下图:
注释:如果在下载依赖时出现错误,可以在下载目录上找到demo01 ,删除node_modules 文件夹,在命令行工具上 输入:
cd demo01 (--进入angular 项目demo01下)
npm install (或 cnpm install -- 重新安装angular 依赖包)
第二步:运行angular项目
在命令行工具输入如下指令
cd demo01 (进入angular项目)
ng serve (编译angualr 项目)
打开浏览器,输入 localhost:4200,如下图:
第三步:常用指令
① 创建组件
ng g component home 或
ng g component components/home
② 创建管道
ng g pipe mypipe 或
ng g pipe pipes/mypipe
③ 创建服务
ng g service loger 或
ng g service services/loger
④ 创建模块
ng g module mymodule 或
ng g module modules/mymodule
Angular环境搭建的更多相关文章
- angular环境搭建时的坑
安装angular环境踩过一些坑,最终还是把工程跑起来了,这里描述一下我的步骤,不排除有些步骤是多余的,希望能对遇到同样问题的小伙伴有帮助. 下载最新版node.js. 安装node,安装过程一路点下 ...
- Angular环境搭建及简单体验
一.安装开发环境 npm install -g typescript npm install -g @angular/cli 二.创建hello-world项目 创建项目 ng new angular ...
- 001——Angular环境搭建、运行项目、搭建项目
1.安装node.js 和cnpm 2.cnpm install -g @angular/cli 安装angular脚手架: 3.ng new angulardemo cd angulardemo ...
- AngularJS4.0环境搭建详解--windows系统环境
第一步:安装NodeJS 下载最新版的NodeJS并安装,安装完成后打开CMD命令行,输入以下命令: node -v 若返回类似版本号则代表NodeJS安装成功,如下: 第二部 安装npm 新版的No ...
- angular开发环境搭建及新建项目
最近一个星期准备学习一下angular前端框架,因为之前在学习abp框架的时候,都要求前端要掌握angular,所以不得不回来恶补一下了,学习的过程有时间的话会记录在这里,方便以后复习. 闲言少叙,下 ...
- Angular总结一:环境搭建
工欲善其事必先利其器,开发 Angular 项目首先要搭建环境.Angular 的环境搭建包括三个方面,开发环境 WebStorm,命令行工具 Angular CLI,以及 nodejs. 一.安装 ...
- Angular 开发环境搭建
Angular 是一款开源 JavaScript 框架,由Google 维护,用来协助单一页面应用程序运行的.它的目标是增强基于浏览器的应用,使开发和测试变得更加容易.目前最新的 Angular 版本 ...
- Angular入门,开发环境搭建,使用Angular CLI创建你的第一个Angular项目
前言: 最近一直在使用阿里的NG-ZORRO(Angular组件库)开发公司后端的管理系统,写了一段时间的Angular以后发现对于我们.NET后端开发而言真是非常的友善.因此这篇文章主要是对这段时间 ...
- Angular入门到精通系列教程(4)- 开发环境搭建以及入手项目
1. 本地开发环境搭建 1.1. node.js 1.2. Angular CLI 2. 开发工具 - Visual Studio Code 第一个Anuglar项目 创建第一个anuglar项目 A ...
随机推荐
- 输入URL地址到最终页面渲染完成,发生了什么事
1. 域名DNS解析 - 浏览器DNS缓存 - 系统DNS缓存 - 路由器DNS缓存 - 网络运营商DNS缓存 - 递归搜索...... 2. TCP连接: TCP三次握手 - 第一次握手,由浏览器发 ...
- 修改oracle默认监听端口
修改oracle默认监听端口 oracle端口修改 主要是修改两个文件和修改oracle参数local_listener 1 查看当前监听状态 [oracle@test ~]$ lsnrctl sta ...
- Windows 64位系统安装Apache2.4
Windows 64位系统安装Apache2.4 来自:百度经验:jingyan.baidu.com 现在大部分一键安装包多是32位的,并不支持64位,直接在64位的系统上使用会报错的,所以我这里就来 ...
- mybatis四大接口之 StatementHandler
1. 继承结构 StatementHandler:顶层接口 BaseStatementHandler : 实现顶层接口的抽象类,实现了部分接口,并定义了一个抽象方法 SimpleStatementHa ...
- day 38 jq 入门 学习(一)
前情提要: jq是简化版本的js 可以把很多很复杂的js 提炼让前端代码更好写 一:jq的使用 <!DOCTYPE html> <html lang="en"&g ...
- [转]Use HandleBars in Express
http://fraserxu.me/posts/Using-Handlebarsjs-with-Expressjs/ 在Express项目中使用Handlebars模板引擎 31 Aug 2014 ...
- MVC3学习:实现文章上一篇下一篇链接
文章的显示都是通过id查询数据库来显示.但是文章会经常删除,因此id号可能不是连续的,所以上一篇下一篇文章,不能简单的做id加减法. 我的思路是:先将表格中所有文章的ID号全部放入一个数组中,如果文章 ...
- sftp命令不被识别
sftp命令不被识别 原因:C:\Windows\System32文件夹下面没有sftp可执行程序 解决方案:安装openssh,安装完成之后可发现在path系统变量的值中多了openssh的安装目录 ...
- java操作特殊字符需要注意的点
在使用字符串替换,分离时 我们如果想替换一个字符串中的问号,我们就不能直接写问号,而要写[?] 实例如下 str = str.replaceAll("\""," ...
- CentOS7 下编译安装 Samba,什么是 SMB/CIFS 协议
目录 一.关于 Samba 1. SMB 2. Samba 二.yum 安装 Samba 1. 安装 Samba 2. 查看版本 3. 查看配置文件 4. 启动服务 5. 本地客户端验证 6. Win ...