vue从0开始的项目搭建(含环境配置)

一、环境准备

下载node.js + 检查node.js版本 + 替换npm下载源

1.下载node.js: Node.js --- 在任何地方运行 JavaScript (nodejs.org)

2.查看版本: windows+r输入cmd进入输入node -v命令查看版本号是否出现确认是否安装

2.替换npm下载源: npm config set registry https://registry.npmmirror.com

3.查看是否安装成功 npm -v

二、搭建项目

1.在电脑上新建一个文件夹作为vue项目的文件夹, 在此文件夹中空白处按shift键同时点击鼠标右键,选择在此处打开Powershell窗口

2.在命令行中输入以下命令: npm create vue@latest 回车,出现下图这种一直回车

一直回车到新的需要输入为止,如下图

3.进入目录 cd vue-project ,执行 npm install 安装依赖

4.然后执行 npm run dev 运行项目

5.下图网址即是进入项目链接

6.当然还有一种打开方式,是我们最常用的

右键文件夹,选择vscode打开(如果没有vscode可以查看这个链接 点我 查看解决方案 )

然后ctrl+j 打开终端,输入npm run dev即可运行

注意:如果报错如下图

那么先右键最顶部文件夹+打开终端输入npm run dev即可

下次给大家讲解进去之后的基础配置与作用,我是小辉,请多多关照!!

相关推荐
IMPYLH2 分钟前
HTML 的 <tfoot> 元素
前端·javascript·html
像风一样自由20207 分钟前
42.VueReactNextjs如何为AI应用设计前端交互
前端·人工智能·大模型·交互·rag·智能体
鬼手点金7 分钟前
Claude Code示范案例-修复 Bug 工作流
java·服务器·前端·javascript·bug·openclaw
柳杉17 分钟前
用 GPT-6 Astra 和 Tripo3D 做智慧农业 3D 大屏:从调研到可巡检园区全流程实录
前端·ai编程·数据可视化
特创数字科技22 分钟前
【uni-app x】告别系统相机限制!三端通用自定义相机组件:任意布局、静默拍照、录像、水印叠加、连拍回图一次搞定
前端·数码相机·uni-app
IT_陈寒37 分钟前
用Vue时这个响应式陷阱坑了我一整天
前端·人工智能·后端
风骏时光牛马44 分钟前
企业客户信息管理数据库
前端
paopaokaka_luck1 小时前
个人综合管理小程序(echarts数据看板、健康数据记录与趋势查看、目标拆解和进度管理、日程待办与番茄钟、习惯打卡、收支统计、个人生活记录、跨模块智能提醒)
前端·javascript·spring·小程序·数据分析·echarts·生活
霸道流氓气质1 小时前
Graph Studio Web IDE 深度实战:可视化编排、断点调试与生产级运维全指南
运维·前端·ide