Vue-02-第一个vue-cli程序

1.第一步安装Node.js(使得JavaScript代码直接运行在浏览器上的环境,相当于java代码与jdk的关系)
在这里插入图片描述

node -v 和 npm -v命令检验是否安装成功

2.安装Node.js淘宝镜像加速器(以管理员身份运行DOS)

方法一:npm install cnpm -g

方法二:使用npm安装cnpm时候安装失败,我使用npm install cnpm -g老失败而且长时间停留于sill位置
可以试试下面这个命令:npm install -g cnpm --registry=https://registry.npm.taobao.org

3.安装好之后在C:\Users\administor\AppData\Roaming\npm\node_modules路径下可进行查看下载的加速器cnpm
在这里插入图片描述
4.接下来下载vue-cli(使用淘宝加速器下载更快, vue-cli 是官方提供的vue脚手架)

cnpm  install vue-cli -g

检验和步骤3一致,再点开vue-cli文件查看
C:\Users\administor\AppData\Roaming\npm\node_modules\vue-cli\node_modules存放的下载的vue模板
5.到此vue-cli已经安装完成
6.手动创建一个Vue-cli项目

  • 创建一个vue项目首先创建一个文件夹myvue,然后在文件夹下打开Dos(以管理员身份)
  • 执行 vue init webpack myvue命令,初始化一个基于webpack模板的vue应用程序
  • 接下来如下操作:(为什么一直NO,因为可以更好的体验,每一个步骤,否则自动安装)在这里插入图片描述
    说明:
    在这里插入图片描述
    4.接下来就是为vue应用程序安装需要的环境
    使用命令:npm install
    5.如果有警告可按照系统提示命令直接运行,即可修复(这里还挺智能的),然后打开Idea open创建的项目即可
    在这里插入图片描述
    7.打开后生成项目目录如下:
    在这里插入图片描述
    运行项目使用命令npm run dev(在当前项目的目录下,以管理员身份,我的idea打开就是以管理员身份的,所以可以在idea的终端下直接运行)
    在这里插入图片描述
    运行成功:
    在这里插入图片描述
    点击访问即可,运行成功!
    ctrl+c停止运行
    在这里插入图片描述
    总结:
  • 安装node.js
  • 安装cnpm淘宝加速器
  • 安装vue-cli
  • 创建项目
  • 初始化项目
  • 安装环境
  • 打开项目
  • 运行项目
  • ok
  • 1
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 打赏
    打赏
  • 2
    评论

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

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

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包

打赏作者

Just_Goer~

你的鼓励将是我创作的最大动力

¥1 ¥2 ¥4 ¥6 ¥10 ¥20
扫码支付:¥1
获取中
扫码支付

您的余额不足,请更换扫码支付或充值

打赏作者

实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

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

余额充值