angular-cli安装及build项目

1.安装Node.js
URL:https://nodejs.org/en/download/
选择合适的版本进行安装

2.安装AngularJS CLI
angular是用typescript编写的,所以先安装typescript,再安装angularjs-cli
npm install -g typescript typings
npm install -g angular-cli --ignore-scripts
npm install

3.build项目

在需要build的路径下,先运行npm install,再运行ng build,即可以生成build后的dist文件夹

 

tips:
清空npm缓存:npm cache clean
查看npm源:npm config get registry
临时切换npm源为taobao源(速度快一点):npm config set registry https://registry.npm.taobao.org

设置可以查看npm进度:npm config set loglevel=http

 

-----------------------------------------------------------------------

安装cli

npm install -g angular-cli

如果安装过以前的版本,请执行以下命令,进行更新:

npm uninstall -g angular-cli
npm cache clean
npm install -g [email protected]

旧版本的cli使用的是SystemJS而最新的创建,是基于webpack构建。

旧版本的angular2(rc1-rc6)可以查看更新步骤

在这里有意思的是,笔者卸载angular-cli后,在安装时出现了Build failed的错误最终找到原因是卸载没有卸载干净。去全局目录中删除相关的ng文件。

常用ng命令

ng new project-name - 创建一个新项目,置为默认设置
ng build - 构建/编译应用
ng test - 运行单元测试
ng e2e - 运行端到端(end-to-end)测试
ng serve - 启动一个小型web服务器,用于托管应用
ng deploy - 即开即用,部署到Github Pages或者Firebase
ng generate component my-comp - 生成一个新组件,同时生成其测试规格和相应的HTML/CSS文件
ng generate directive my-directive - 生成一个新指令
ng generate pipe my-pipe - 生成一个新管道
ng generate service my-service - 生成一个新服务
ng generate route my-route - 生成一个新路由
ng generate class my-class - 生成一个简易的模型类

时间: 2024-10-07 21:12:45

angular-cli安装及build项目的相关文章

win10:angular-cli安装及build项目

win10 angular-cli安装及build项目: https://blog.csdn.net/rongyongfeikai2/article/details/53084473 node.js安装: https://blog.csdn.net/wing_93/article/details/78573820 需要安装Python2.7,不安装有很多问题 1.ng build报错:You have to be inside an angular-cli project in order to

Angular CLI 安装

安装Angular 官网的教程,因为国内网络环境原因,访问不了服务器,导致安装失败. 1.先安装NodeJs 安装教程:http://blog.csdn.net/zengmingen/article/details/72650484 2.通过NodeJs中的模块npm 命令行安装 CLI 2.1.设置npm的资源库为国内淘宝的. 命令: [plain] view plain copy npm config set registry https://registry.npm.taobao.org

Angular CLI 安装和使用

1.背景介绍 关于Angular版本,Angular官方已经统一命名Angular 1.x同一为Angular JS:Angular 2.x及以上统称Angular: CLI是Command Line Interface的简写,是一种命令行接口,实现自动化开发流程,比如:ionic cli.vue cli等:它可以创建项目.添加文件以及执行一大堆开发任务,比如测试.打包和发布. 官方文档:https://github.com/angular/angular-cli 2.安装Angular CLI

Angular/cli 安装(windows环境)。

1.卸载先前安装的Angular/cli npm uninstall -g angular-clinpm uninstall --save-dev angular-clinpm uninstall -g @angular/cli 2..删除 C:\Users\lenovo\AppData\Roaming 下的npm 和 npm cache文件夹. 3.卸载node.js 下载安装最新版本, 安装路径默认即可. 4. node -v npm -v 查看版本 5.用npm安装typescript和t

Angular Cli 创建并且运行项目

1:进入cmd  ,然后切换到自己项目的目录,如在D盘下的 angular2 Test 执行:ng new hello 2: 然后切换到 项目目录下执行: ng serve --open  这个时候 就会看到 浏览器自动打开了一个地址为:http://localhost:4200/  截图如下,说明已经成功创建了 一个angular2 web项目了. 原文地址:https://www.cnblogs.com/webNotes/p/10203901.html

angular CLI 快速搭建angular 项目

1. 首先确保你的电脑上安装了Node.js®和npm 2.打开终端/或命令窗,安装全局 angular CLI npm install -g @angular/cli 3. 创建新项目 //运行下列命令来生成一个新项目以及应用的骨架代码: ng new project-name // 请耐心等待. 创建新项目需要花费很多时间,大多数时候都是在安装那些npm包. 4. 启动开发服务器 // 进入项目目录 cd my-app //启动服务 ng serve --open 5. 文件结构如下 src

使用Angular CLI创建Angular 2项目

一.安装nvm-windows,方便node版本切换 nvm list //查看已安装的版本 nvm install 6.11.0 //安装Node.js 6.11.0,因为@angular/cli需要6.9版本以上支持 nvm use 6.11.0 //切换到新安装的版本 二.为npm配置proxy(proxy软件需自行安装) npm config set proxy=http://localhost:1080 npm config set https-proxy=http://localho

Angular Cli 设置 淘宝的NPM 镜像

Angular CLI 是 构建angular2 项目的 脚手架工具. 安装Angular-Cli  需要先安装 Node.js. 大家可以去 node.js 官网下载. 说明:因为npm安装插件是从国外服务器下载,受网络影响大,可能出现异常.所以我们需要适用淘宝的镜像. http://registry.npm.taobao.org/ 设置方法如下:npm install -g cnpm  --registry=https://registry.npm.taobao.org 然后使用 cnpm 

@angular/cli 工程 项目 配置

如果你创建工程项目用angular-cli 你的样式文件想使用scss, 并且让ng serve自动编译它们 你可以在创建项目的时候用 ng new sassy-project --style=sass 或者通过ng set defaults.styleExt scss 来修改你现有的项目 然后修改.angular-cli.json的 "styles": [    "styles.css" // "styles.scss" ] 和componen