利用vue脚手架快速搭建项目

本文详细介绍了从下载安装Node.js到使用Vue CLI创建并运行Vue.js项目的步骤,包括检查安装、设置全局变量、安装淘宝镜像cnpm、安装Vue CLI、创建新项目、开发项目等。在过程中提到了VScode的使用,并给出了在遇到问题时的解决建议,如重装和重启。

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

第一步:去官网下载nodejs,自己选择路径,安装时候可以直接选择next,next...这里不详细说明;

第二步:检查是否安装好,wins+R调出终端,输入cmd指令;

输入node -v回车;

输入npm -v回车;

第三步:设置全局变量,详细见文章npm 设置全局变量安装路径及环境配置_无配置自定义npm路径,npm路径将用系统环境变量路径-优快云博客,里面讲的非常清楚;

第四步:安装淘宝镜像cnpm

命令行输入指令

npm install -g cnpm --registry=https://registry.npm.taobao.org

然后查看版本:(这里可能需要重新wins+R调出终端再输入下方指令)

cnpm -v

第五步:安装vue-cli

命令提示行打入:

cnpm install -g @vue/cli

第六步:新建一个脚手架项目

先输入cd Desktop,回车,表示这个文件建在桌面,

然后再命令行输入(firstvue为项目名,自己任取)

vue create firstvue

根据提示,键盘上下键选择vue3,回车(可能这一步之前,第一次会询问是否选择taobao,这里输入Yes)

再根据提示输入cd firstvue,回车;

输入npm run serve,回车;

最后出现两行地址,随便复制一行到浏览器打开,完成,详细见这篇文章

卸载vuecli3_针对遇到安装或卸载vue-cli失败的解决方案-优快云博客

第七步:开发项目

一种方法是把这个文件拖到vscode打开,(终端打开vscode,命令行:code .)(可能你不是用VScode,用自己的编译器就好);

还有一种是在VScode的终端创建项目,ctrl+`(这是键盘左上角的反引号)调出终端,

输入指令 vue create 项目名,回车,

选择默认vue3, 再根据输入cd 项目名,回车,输入npm run serve,

两行地址任选一个点击。

(最后最后,在任何安装出现问题,通过请教他人,查阅资料等都无法解决问题,就把node,npm相关文件全部删除,重启电脑,一切从零开始(小声哭泣)...)

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值