Vue脚手架安装最简单实用的操作总结

安装npm流程

1:下载node.js http://nodejs.cn/ ,下载安装node.js不必多说(node下载完自带npm包管理器)
首先第一步 查看版本:node -v
查看npm版本 npm -v

2: 安装淘宝镜像
建议使用该淘宝镜像,安装速度相对较快
在这里插入图片描述
npm install cnpm -g --registry=https://registry.npm.taobao.org

3:安装Vue-cli(脚手架)
(1)安装vue-cli2执行 npm i -g vue-cli
(2)安装vue-cli3执行 npm install -g @vue/cli
安装成功以后查看Vue当前版本 vue -V

4: 安装全局 webpack 打包工具 npm i -g webpack
或者安装开发依赖 npm install webpack -S 生产依赖 npm install webpack -D
(一般建议全局安装webpack,毕竟工作中组件化开发的项目都会使用的)

5: 开始第一个基于Vue的项目:c盘切换f盘 f:
6: vue init webpack demo 回车取名name 回车 回车
是否安装安装 vue-router Y 然后 Y 然后 N N 一直回车
(一般这种方式最简单是默认安装,自定义安装选择后面第二个,可根据项目需求安装)
在这里插入图片描述)
在这里插入图片描述
7: 进入cd demo 项目文件夹里面
8: npm install 初始化vue项目,俗称安装项目所需要依赖包,简称安装依赖。
9:启动项目:npm run dev 或者 npm start
10: 打开浏览器输入网址 http://localhost:8080

安装yarn流程

首先下载node.js,查看node -v和npm -v
最简单的方式是用npm全局安装yarn
(1)npm install -g yarn或者npm i -g yarn
(2)查看版本:yarn --version
执行(1)(2) 有版本号,说明安装成功了

1.yarn global add @vue/cli-init
2.vue create vue-demo
3.cd vue-demo
4.yarn serve

常用命令
yarn / yarn install 等同于npm install 批量安装依赖
yarn add xxx 等同于 npm install xxx —save 安装指定包到指定位置
yarn remove xxx 等同于 npm uninstall xxx —save 卸载指定包
yarn add xxx —dev 等同于 npm install xxx —save-dev
yarn upgrade 等同于 npm update 升级全部包
yarn global add xxx 等同于 npm install xxx -g 全局安装指定包

最后总结一下vue-cli2的卸载和权限问题以及同时维护vue-cli2和开发vue-cli3的桥接
1.npm uninstall vue-cli -g卸载Vue Cli2
或者sudo npm uninstall vue-cli -g(权限不够)
在这里插入图片描述
2.安装Vue Cli3 npm install -g @vue/cli
3.vue --version或vue -V查看版本或者vue查看vue相关命令
执行1,2,3步Vue Cli2卸载完成,Vue Cli3安装成功
npm install -g @vue/cli-init旧版本使用vue init功能全局安装一个桥接工具
vue init webpack my_project
npm run dev运行Vue2.0项目
执行Vue Cli3安装升级完成,成功启动了VUe Cli2

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值