【Angular】(学习一)搭建环境

MVVM框架的组成:

数据绑定、指令系统、组件式编程、路由和导航、状态保持、第三方组件库

AngualrJS v1.x 官网:https://angularjs.org
Angular v2.x及以上 官网:https://angular.io   中文镜像官网:https://angular.cn

AngualrJs开发方式:①script引入②脚手架方式
Angular开发方式:①脚手架方式

搭建Angular环境:

前提:①安装对应版本的node、npm  ②了解typeScript

npm install -g typescript  # 安装最新的TypeScript稳定版

1、下载并安装脚手架工具(一台电脑只需要安装一次就行啦)

默认仓库:registry.npmjs.com

小知识:使用第三方的npm下载仓库

    查看当前npm默认的下载仓库地址:

        npm config get registry

    修改npm默认的下载仓库地址为国内镜像网站:

        npm config set registry 新仓库地址

    例如,可以使用淘宝提供的npm镜像:

        npm config set registry https://registry.npm.taobao.org

npm install -g @angular/cli

默认安装到 C:\Users\{User}\AppData\Roaming\npm的安装包里面去

所有的全局工具都是安装到以上路径,是不能修改的。

下载脚手架的时候常见问题:

①ENOENT:no such file or directory,access to C:/User/...Roaming/npm

   解决方案:使用管理员账户重新登录

②npm ERR:Cannot read property resolve of undefined

   解决方案:稍后重试,或者更改仓库地址

③git命令没有找到

   原因:v8.x以上的版本,angular默认创建了.git文件,用git管理项目

  解决方案:在电脑上安装git就行啦,不安装也不影响angular使用

 2、运行脚手架工具创建空白项目

ng new my-app

选择保存项目的文件目录,并创建 

3、进去空白项目并运行开发服务器

cd my-app
npm start

ng serve 命令会启动开发服务器、监视文件,并在这些文件发生更改时重建应用。

--open(或者只用 -o 缩写)选项会自动打开你的浏览器,并访问 http://localhost:4200/

--port 3000 选项会修改默认端口号,访问 http://localhost:3000/

 4、客户端访问测试

http://localhost:4200

http://127.0.0.1:4200


Angular修改默认端口号:

在package.json文件里面修改命令:ng serve --port 3000

猜你喜欢

转载自blog.csdn.net/xiaoxiong_jiaxin/article/details/119410126
今日推荐