《从零搭建Vue3项目实战》（AI辅助搭建Vue3+ElemntPlus后台管理项目）零基础入门系列第一篇:开发环境准备

🤟致敬读者

• 🟩感谢阅读🟦笑口常开🟪生日快乐⬛早点睡觉

📘博主相关

• 🟧博主信息🟨博客首页🟫专栏推荐🟥活动信息

---

---

📃文章前言

• 🔷文章均为学习工作中整理的笔记。
• 🔶如有错误请指正，共同学习进步。

---

《从零搭建Vue3项目实战》零基础入门系列第一篇:开发环境准备（AI辅助搭建Vue3+ElemntPlus后台管理项目）

从零搭建Vue3项目实战，借助AI工具辅助学习和代码生成，零基础小白亦可轻松上手实现。

以下为系列篇所有文章：
《从零搭建Vue3项目实战》零基础入门系列第一篇:开发环境准备
《从零搭建Vue3项目实战》零基础入门系列第二篇:项目创建和初始化
《从零搭建Vue3项目实战》零基础入门系列第三篇:ElementPlus引入和应用
《从零搭建Vue3项目实战》零基础入门系列第四篇:登录页面实现
《从零搭建Vue3项目实战》零基础入门系列第五篇:登录页面优化及使用AI学习代码
《从零搭建Vue3项目实战》零基础入门系列第六篇:页面跳转功能实现（Router的引入和使用）
《从零搭建Vue3项目实战》零基础入门系列第七篇:菜单栏实现
《从零搭建Vue3项目实战》零基础入门系列第八篇:菜单栏优化和阶段项目源码
《从零搭建Vue3项目实战》零基础入门系列第九篇:用户管理功能实现
《从零搭建Vue3项目实战》零基础入门系列第十篇:商品管理功能实现
《从零搭建Vue3项目实战》零基础入门系列第十一篇:订单管理功能实现
《从零搭建Vue3项目实战》零基础入门系列第十二篇（完结篇）:数据统计功能实现
《从零搭建Vue3项目实战》零基础入门一篇通关（AI辅助搭建Vue3+ElemntPlus后台管理项目）

系列文章均收录在前端vue3入门实战专栏中，可订阅专栏了解更多内容

开发环境准备

1. Node环境安装和配置

检查环境
返回版本则表示已经安装配置，否则则参考文章进行安装配置：node的下载、安装、配置和使用（node.js下载安装和配置、npm命令汇总、cnpm的使用）

node -v

npm -v

2. VsCode开发工具安装和配置

VSCode下载安装指南

3. AI辅助工具插件安装

VSCode中搜索插件Lingma（Lingma - Alibaba Cloud AI Coding Assistant）
检查是否已安装，未安装直接安装，并登录阿里云账号，可用淘宝、支付宝、阿里云、钉钉登录

4. Vue官方插件

Vue插件安装
搜索Vue Officail插件，如未安装直接安装，Vue official 用于前端框架vue开发项目

5. 浏览器跳转插件Live Server

Live Server 用于从vscode中打开页面到浏览器
安装Live Server后可直接在代码页面鼠标右键跳转到浏览器打开

6. VSCode自动保存

Settings–User–Commonly Used – Files: Auto Save项，默认off，修改为afterDelay
修改后会自动保存你修改的代码，无需按Ctrl+S，（页面自动刷新）

以上就是开发环境准备的所有内容

---

---

📜文末寄语

• 🟠关注我，获取更多内容。
• 🟡技术动态、实战教程、问题解决方案等内容持续更新中。
• 🟢《全栈知识库》技社区，集结全栈各领域开发者，期待你的加入。
• 🔵​加入开发者的《专属社群》，分享交流，技术之路不再孤独，一起变强。
• 🟣点击下方名片获取更多内容🍭🍭🍭👇

---