您的位置:首页 > Web前端 > Vue.js

vue简学之路(十一)vue-cli脚手架安装

2020-01-15 10:13 302 查看

(一)安装node.js
下载地址:http://nodejs.org/en/download/
下一步下一步走完
检查node -v 版本

安装node脚手架工具
使用npm -v 检查npm 版本
(二)安装npm (这里是全局安装)
npm install vue-cli -g
npm安装包管理器
npm install 加-g 代表不是全局安装
npm list 查看模块版本号
npm uninstall 卸载
npm update 跟新模块

可以安装cnpm (更快)
npm install vue-cli -g cnpm --registry=https://registry.npm.taobao.org
(三)
安装vue-cli cnpm install -g vue-cli
安装webpack cnpm install webpack -g
创建项目 vue init webpack my-vue(名称)

(四)配置内容
名称
描述
路由
test
安装方式
(五)cd 到安装目录
npm run dev

npm 安装方式相同
npm install vue-cli -g 全局安装vue-cli
vue init webpack 项目名 使用webpack构建自己的项目

Project name 按enter键
Project description 按enter键
Author 按enter键
Vue build 按enter键
Install vue-router 是否安装Vue-router 视自己的项目情况而定 一般都是需要的 按enter键
Use ESlint to lint your code 选择NO 不需要按照严格的代码书写规范
Set up unit tests 选择NO 不需要单元测试
Setup e2e tests with Nightwatch 选择NO 不需要e2e测试
Should we run ‘npm install’ for you … 选择npm

修改config/index.js的proxyTable可以配置跨域
修改config/index.js中的17行可以自定义服务启动的端口

axios地址 https://github.com/axios/axios
所有新闻数据接口
http://www.phonegap100.com/appapi.php?a=getPortalList&catid=20
每条新闻的详细信息
http://www.phonegap100.com/appapi.php?a=getPortalArticle&aid=文章id

豆瓣数据接口

https://api.douban.com/v2/movie/top250?count=20&&start=20

idea安装更快
当安装了node.js直接开始参照
添加链接描述

  • 点赞
  • 收藏
  • 分享
  • 文章举报
一座孤岛 发布了22 篇原创文章 · 获赞 3 · 访问量 799 私信 关注
内容来自用户分享和网络整理,不保证内容的准确性,如有侵权内容,可联系管理员处理 点击这里给我发消息
标签: