angular6.0 版本是 google 在 AngularJS 上进行一次大的升级, 提高了性能 更改了 API 方面的知识.
创建项目第一步
安装 node.JS(自行百度安装), 附上 Node.JS 的中文网地址 Node http://nodejs.cn/ , 安装 NPM 的包管理器.
第二步
安装好 Node.JS 后 安装 Angular CLI 使用 NPM 命令安装, 打开控制台进行安装,-g 表示全局 global 的意思.
NPM install -g @angular/cli// 安装脚手架工具, 用于快速创建项目
第三步
创建工作空间和初始应用 ng 表示 angular 的命令, my-App 表示项目名称, 可自行更改.
ng new my-App// 创建一个名为 my-App 的项目
第四步
启动开发服务器
- cd my-App// 进入到项目目录
- ng serve --open// 打开项目并且运行本端
- ng build // 编译, 也必须进入到 main.JS 目录或者 main.ts 目录
完成 angular 项目的创建. 中文官方地址 Angular6.0 https://www.angular.cn/ , 里面有更详细的步骤
备注
启动一个原有的 angular 项目, 执行以下的命令, 如果端口被占用, 可以更改端口进行启动, 或者关闭占用的端口
- NPM start // 打开浏览器输入地址 http://localhost:4200/
- ng serve --port 4201// 用于修改端口. 简写: ng serve --p 端口号
vue https://cn.vuejs.org/index.html 构建项目
首先第一步安装脚手架工具 Vue-cli https://cli.vuejs.org/zh/guide/installation.html
当然前提条件也是基于 http://nodejs.cn/ 的 NPM 包, 也可以用 yarn, 建议用 NPM 安装. 安装成功后, 可以用 vue --version 或者 vue --v 进行版本检查是否正确.
- NPM install -g @vue/cli// 成功安装后, 验证
- vue --version // 或者 vue --v
第二步
安装原型扩展, 进行 vue 文件的快速开发
NPM install -g @vue/cli-service-global
伪第三步, 启动命令
用于启动 vue 服务和 vue 的项目
vue serve 组件名 // 启动一个. vue 的文件或者组件
第三步, 创建 vue 的项目支架
快速使用命令创建 vue 项目
vue create 项目名称 // 里面默认使用 webpack 的打包工具进行一些配置.
第四步, vue 项目放置到服务器, 压缩文件
- NPM install -g @vue/cli-service-global// 全局安装后, 方可执行
- cd src// 进入到 src 目录 App.vue 所在的目录
- vue build // 进行编译后会生成一个 dist 的文件夹 , 将这个文件夹发送给后台人员.
启动一个已有 vue 的项目
NPM run serve// 进入到项目目录, 打开终端, 进行执行这条命令.
备注:
官网创建一个项目的详细地址,
更改端口号: 默认端口号是 8080, 修改默认, 找到 vue 里面的配置文件 config 文件进行配置 port 端口.
来源: http://www.jianshu.com/p/152f65019e3c