创建一个Angular项目

创建angular可以遵照官网的新手指南(angular快速创建指南),易懂好上手。今天按照上面链接中的指南操作时遇到一丢丢问题,以下简单记录。

1.本人事先写Python的时候已经装好了node和npm,不确定自己有没有装过的可以在命令行用node -v和npm -v试一下,显示版本号则表示已经安装过了(如图),这里需要运行 node 6.9.x 和 npm 3.x.x 以上的版本,否则后续可能出错。
创建一个Angular项目

2.然后全局安装 Angular CLI (如图)。在安装的过程中报错,需要Python来运行,但是我事先安装的Python是3.x版本的(在命令行输入python查看Python版本),这里需要2.7版本的Python,去官网下载了2.7版本的Python,安装,添加到系统环境变量Path里面,再在命令行里面查看Python版本,发现仍然显示3.x版本,后将环境变量Path中关于Python的配置字段放到Path的最前面,就可以了。据说是因为运行环境变量的时候对同样内容的配置会以排在前面的为准,不知道别人会不会遇到和我一样的问题,可能我比较笨啦。
创建一个Angular项目

3.创建一个新项目(如图)。可能需要等一会。我在安装的时候卡住了,然后Ctrl+C终止程序,进入my-app目录(cd my-app),输入npm install,则可以继续。
创建一个Angular项目

4.进入项目目录,并启动服务器。
创建一个Angular项目

5.弹出页面,证明创建成功。

6.这里创建的是一个全局的angular,我想把创建好的项目拷到别的电脑上去,产品经理说不可以,如果想拷到别的电脑上,则不要创建全局的angular,在安装到上面第二步的时候把“-g”去掉,即npm install @angular/cli
如果已经安装了全局angular,要先卸载,卸载方法如图。
创建一个Angular项目
然后npm install @angular/cli
创建一个Angular项目
运行ng如图,npm run ng。要加run啊因为不是全局的啦
创建一个Angular项目
接下来要启动服务器npm start即可。
创建一个Angular项目
如上图可以看到启动成功啦,因为之前已经创建了项目my-app已经弹出过页面,这次可能不会弹出页面,打开浏览器,输入localhost:4200就可以打开页面(如下图)了。然后对创建的my-app项目里面的代码(比如src/app/app.component.ts/html/css)进行修改就可以实现自己的功能了。
创建一个Angular项目

写在最后:第一次写****博客,主要为了记录自己遇到过的问题,应该不会有人关注我这种小透明写了啥吧,如果有写错欢迎指正,如果有侵权啥的。。。。绝对不是故意的!