本文转自:https://www.cnblogs.com/lilunpai/articles/7992538.html
一、环境介绍
1、开发环境:Windows10
2、开发ide工具:VS code https://code.visualstudio.com/
二、准备环境
1、下载并安装nodejs(建议下载LTS版本),安装过程中会默认添加path,不要不小心取消掉了。
2、Nodejs安装完成之后,先使用下面两个命令检查安装是否正常,如果正常话应该会显示相应的版本号。
1
2
|
node -v 查看node版本 npm -v 查看npm版本 |
3、安装Typescript和Angular CLI
安装之前我们先设置一下淘宝镜像,这样npm下载速度会快一些
1
|
npm config set registry https://registry.npm.taobao.org |
接下来,我们就可以真正的安装Typescript了。
1
|
npm install -g typescript typings |
之后安装Angular CLI,此处注意不要使用angular-cli
1
|
npm install -g @angular/cli |
三、安装失败以及解决办法
1、Angular CLI安装失败,使用下面命令卸载,然后重新安装
npm uninstall @angular/cli
npm cache clean
npm cache verify --force
执行上面命令之后,找到C盘-->用户-->你登录的账户-->AppData-->Roaming-->npm目录并且删除
2、缺少Python环境
a、下载并安装Python,官方下载
b、安装时,最好直接安装到C盘根目录,比如C:Python27python.exe
c、检查配置环境变量path路径,电脑->属性->高级配置->环境变量->把安装的Python路径复制到path里面就可以了
四、配置VS code
1、点击菜单中的【调试】按钮,选择【安装其他调试器】,然后搜索 Debugger for Chrome 并安装
2、找到launch.json文件,并修改一下内容
1 { 2 // 使用 IntelliSense 了解相关属性。 3 // 悬停以查看现有属性的描述。 4 // 欲了解更多信息,请访问: https://go.microsoft.com/fwlink/?linkid=830387 5 "version": "0.2.0", 6 "configurations": [ 7 { 8 "type": "Chrome", 9 "request": "launch", 10 "name": "Launch Chrome with ng serve", 11 "sourceMaps": true, 12 "url": "http://localhost:4200", 13 "webRoot": "${workspaceRoot}" 14 } 15 ] 16 }
3、在VS code 中的终端里面输入 ng serve,项目就会启动
最后就可以直接F5启动并且任意debug调试了