Vue cli 脚手架安装和Vue项目创建过程

本文详细介绍了如何在命令提示符中安装Vue CLI,包括使用npm安装、淘宝镜像加速,以及创建Vue项目的步骤,从选择项目配置到运行项目的方法,特别提到了在VSCode中打开和运行项目的方法。

摘要生成于 C知道 ,由 DeepSeek-R1 满血版支持, 前往体验 >

在电脑搜索框中输入cmd打开命令提示符

然后可以在里面输入node -v注意是node空格-v

 如果 执行结果显示: xx 不是内部命令,说明你还没有安装node , node 安装地址:下载 | Node.js 中文网

vue-cli安装 

在命令提示符中输入npm install -g vue-cli    // 加-g是安装到全局

安装后可以输入vue加上回车来查看vue的指令

 npm在国内安装的速度较慢可以使用淘宝镜像进行安装

淘宝镜像链接

淘宝 NPM 镜像

在命令提示符中输入npm install cnpm -g --registry=https://registry.npm.taobao.org;来安装npm的淘宝镜像

安装完成后记得输入npm空格-v

更新npm可以使用 npm空格install空格-g空格npm

创建vue项目的指令为vue空格create空格项目名字(名字为全英文)然后回车会出现以下选项

可以通过键盘上下键来选择

最后一个为手动配置我们选择最后一个并回车之后会出现以下选项 

 

 然后选取按需求选取(空格来进行选取操作)

 

 选完之后按回车即可看到选择使用vue2的版本还是vue3的版本

 选择了2版本之后会出现你是否以history来配置路由Y是 是的 n就是hash模式

 下面是选择你的拓展语言模式(上下键控制选择)选择完成后点击回车 

这个选择第一个的在专用配置 第二个的意思是在package.json中

 最后一步会让你选择是否在严格模式下执行y是 是 n是否选择完成后就会开始创建

 创建完成后

 

 我们可以在C盘的用户文件夹下的cxy文件夹下找到刚刚创建项目的名字然后将我的文件夹names拉到vscode或者其他编辑器上打开

打开后Vscode编辑器可以通过shift加上波浪键打开终端其他的编辑器可以找一下终端的位置一般都是在上方

 点击新终端后输入npm空格run空格serve回车来运行项目

 允许成功后可以用cael+左键点击链接或者复制链接到浏览器打开(两个链接都是可以打开的)

 

 以上就是vue项目的安装和创建

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值