打造AngularJs2.0开发环境

前端之家收集整理的这篇文章主要介绍了打造AngularJs2.0开发环境前端之家小编觉得挺不错的,现在分享给大家,也给大家做个参考。

npm是一个很好用的工具,全场是Node Packet Manager,是一个nodejs的包管理工具,但是美中不足的是当我们去安转包的时候却发现下载的速度太慢,但是没关系,还是有方法的就是利用淘宝的国内镜像,一下是3个设置的方法

镜像使用方法(三种办法任意一种都能解决问题,建议使用第三种,将配置写死,下次用的时候配置还在):

1.通过config命令

npm config set registry https://registry.npm.taobao.org  npm info underscore (如果上面配置正确这个命令会有字符串response

2.命令行指定

npm --registry https://registry.npm.taobao.org info underscore 

3.编辑~/.npmrc加入下面内容

registry = https://registry.npm.taobao.org

转载:http://www.cnblogs.com/heguo/p/5919786.html

===============================================================================

参考文档:https://angular.cn/docs/ts/latest/quickstart.html

win7环境

1. 下载并安装Visual Studio Code,以下简称 vsc

2. 安装 node,会自动安装 npm,下载地址:https://nodejs.org/en/download/

3. 命令行执行: npm install -g typescript 安装 typescript 编译器

4. 打开 vsc,文件/首选项/用户设置,设置 setting.json :

// 将设置放入此文件中以覆盖默认设置
{

//启用 typescript 2.0 编译器
"typescript.tsdk": "C:/Users/[用户名]/AppData/Roaming/npm/node_modules/typescript/lib",

// ts 项目,隐藏 .js 和 .js.map 文件
"files.exclude": {
"node_modules": true,
"**/*.js": { "when": "$(basename).ts"},
"**/*.js.map": true
}
}

5. 打开一个ts项目,从这里下载:https://github.com/angular/quickstart/blob/master/README.md

按 ctrl+shift+b 编译项目时,提示设置 task.json

{
"version": "0.1.0",
"command": "cmd",
"isShellCommand": true,
"showOutput": "always",
"args": ["/C npm start"]
}

6. 至此,按 ctrl+shift+b 可以编译ts项目,并启动一个浏览器打开网站首页

命令行键入

node -v可查看本机安装的 node 版本号,应该是 6.6+

npm -v可查看本机安装的 npm 版本号,应该是 3.0+

tsc -v可查看本机安装的 typescript 版本号,应该是 2.0+

npm start也可从命令行启动项目

或许还应该下载类型头文件,npm i -g typings,我暂未安装

我设置了 vsc 文件/首选项/文件图标主题 为seti 主题,以显示文件的图标

我还安装了一系列的vsc插件,尤其是 visual studio code settings sync,配置 gist,用于同步 vsc 的设置项

安装的插件有:

vscode-tslint
Angular 2 TypeScript Snippets for VS Code
Visual Studio Code HTML Snippets
HTML CSS Class Completion
js-beautify for VS Code
Auto Close Tag
Auto Rename Tag
VSCode Log Output Colorizer
Document This
Code Metrics - Visual Studio Code Extension
AutoImport

Visual Studio Code Settings Sync VS Code - Debugger for Chrome VSCode TODO Parser Extension Bookmarks. EditorConfig for Visual Studio Code Node npm Script Running for Visual Studio Code FTP-Sync extension for VS Code Material Theme Gulp - VS Code CodeBing

猜你在找的Angularjs相关文章