步骤 1. 设置开发环境

  在开始工作之前,你必须设置好开发环境。

  如果你的电脑里没有 Node.js®和 npm,请安装它们。

请先在终端/控制台窗口中运行命令 node -v 和 npm -v, 来验证一下你正在运行 node 6.9.x 和 npm 3.x.x 以上的版本。 更老的版本可能会出现错误,更新的版本则没问题。

  然后全局安装 Angular CLI 。

npm install -g @angular/cli

步骤 2. 创建新项目

打开终端窗口。

运行下列命令来生成一个新项目以及应用的骨架代码:

ng new my-app

  请耐心等待。 创建新项目需要花费很多时间,大多数时候都是在安装那些 npm 包。

步骤 3. 启动开发服务器

  进入项目目录,并启动服务器。

cd my-app
ng serve --open

ng serve 命令会启动开发服务器,监听文件变化,并在修改这些文件时重新构建此应用。

使用 --open(或 -o)参数可以自动打开浏览器并访问 http://localhost:4200/。

本应用会用一条消息来跟你打招呼:


以上都是官方网站给出的搭建项目的一些流程。

下面开始介绍Angular5可以使用的一些包管理工具

yarn 包管理(下载快,有条理,不像npm或者cnpm会卡住。)

安装方式: cnpm install yarn (附带官网地址:https://yarnpkg.com/lang/zh-hans/docs/install/)

初始化项目并安装依赖: yarn

运行: yarn start

Angular5入门与搭建项目的更多相关文章

  1. 架构师入门:搭建双注册中心的高可用Eureka架构(基于项目实战)

    本文的案例是基于 架构师入门:搭建基本的Eureka架构(从项目里抽取) 改写的. 在上文里,我们演示Eureka客户端调用服务的整个流程,在这部分里我们将在架构上有所改进.大家可以想象下,在上文里案 ...

  2. vue-cli脚手架搭建项目简单入门一

    搭建系统: Windows系统 简单了解Node.js.npm,安装Node.js,下载网址:http://nodejs.cn/download/ 查看node,npm安装成功与否.打开cmd命令行, ...

  3. 项目一:项目第二天 Jquery ztree使用展示菜单数据 2、 基础设置需求分析 3、 搭建项目框架环境--ssh(复习) 4、 SpringData-JPA持久层入门案例(重点) 5、 Easyui menubutton菜单按钮使用 6、 Easyui messager消息框使用

    1. Jquery ztree使用展示菜单数据 2. 基础设置需求分析 3. 搭建项目框架环境--ssh(复习) 4. SpringData-JPA持久层入门案例(重点) 5. Easyui menu ...

  4. SSH入门简单搭建例子

    因为公司涉及项目使用SSH,为了解SSH搭建方式和运作原理,就自己搭建了一个. 采用尽量以最少的JAR包,搭建一个简单的struts2+spring+hibernate环境,希望像我这样的入门者都能理 ...

  5. Spring Cloud 入门教程 - 搭建配置中心服务

    简介 Spring Cloud 提供了一个部署微服务的平台,包括了微服务中常见的组件:配置中心服务, API网关,断路器,服务注册与发现,分布式追溯,OAuth2,消费者驱动合约等.我们不必先知道每个 ...

  6. 微信小程序初体验,入门练手项目--通讯录,后台是阿里云服务器(一)

    内容: 一.前言 二.相关概念 三.开始工作 四.启动项目起来 五.项目结构 六.设计理念 七.路由 八.部署线上后端服务 同步交流学习社区: https://www.mwcxs.top/page/4 ...

  7. Spring MVC+Spring+Mybatis+MySQL(IDEA)入门框架搭建

    目录 Spring MVC+Spring+Mybatis+MySQL(IDEA)入门框架搭建 0.项目准备 1.数据持久层Mybatis+MySQL 1.1 MySQL数据准备 1.2 Mybatis ...

  8. 推荐:一个适合于Python新手的入门练手项目

    随着人工智能的兴起,国内掀起了一股Python学习热潮,入门级编程语言,大多选择Python,有经验的程序员,也开始学习Python,正所谓是人生苦短,我用Python 有个Python入门练手项目, ...

  9. 57.NodeJS入门--环境搭建 IntelliJ IDEA

    转自:https://blog.csdn.net/wang19891106/article/details/51127133 NodeJS入门–环境搭建 IntelliJ IDEA 本人也刚开始学习N ...

随机推荐

  1. AtCoder Grand Contest 027 (AGC017) D - Modulo Matrix 构造

    原文链接https://www.cnblogs.com/zhouzhendong/p/AGC027C.html 题解 首先我们假装 max mod min = 1 然后对着这个构造. 将各自黑白染色, ...

  2. 初窥Java之六

    一.二维数组 1.动态创建 数组中元素类型[] 数组名 = new 数组中元素类型[]; 例如:int[][] arr = new int[二维数组的长度][一维数组的长度]: Int[][] arr ...

  3. mysql 使用教程 入门

    转载 http://www.cnblogs.com/mr-wid/archive/2013/05/09/3068229.html MySQL有三大类数据类型, 分别为数字.日期\时间.字符串, 这三大 ...

  4. 洛谷P1379 八数码难题

    传送门 1.先用dfs枚举9!的全排列,存到hash数组里(类似离散化),因为顺序枚举,就不需要排序了 2.朴素bfs,判重就用二分找hash:如果发现当前状态=要求状态,输出步数结束程序 上代码 # ...

  5. 【安全性测试】Android测试中的一点小发现

    在执行某个项目中的APP测试发现的两个问题,自然也是提供参考,作为经验记录下来. 一.通过apk的xml文件获取到某项目APP的账号和密码 使用eclipsel或者drozer,获得apk的xml文件 ...

  6. NumPy数组对象

    1.创建NumPy数组 import numpy as np # 创建3*2*4的三维数组 a = np.arange(24).reshape(3, 2, 4) # 打印三维数组的所有元素 print ...

  7. help文档制作 chm

    程序中的help文档制作 所用工具:HTML Help Workshop 文件包括:各个html文档,帮助页面的具体内容 hhc文档:help的目录文件 hhk文档:help的索引文件 MAP文件夹中 ...

  8. Eclipse导出自己的项目(仅供自己保留方式war包)

    War: Jar包:

  9. react-webpack config webpack@3.4.1

    1.最重要的一点 yarn add webpack@3.4.1 -g 2.  解决跨域请求 webpack.json 中添加 https://segmentfault.com/q/1010000008 ...

  10. Web项目中手机注册短信验证码实现的全流程及代码

    最近在做只能净化器的后台用户管理系统,需要使用手机号进行注册,找了许久才大致了解了手机验证码实现流程,今天在此和大家分享一下. 我们使用的是榛子云短信平台, 官网地址:http://smsow.zhe ...