Web前端:Vue开发环境搭建

一、搭建开发环境:

1.nodejs安装:

下载地址:

html 复制代码
https://nodejs.org/dist/v20.13.1/node-v20.13.1-x64.msi

查看版本号:

bash 复制代码
node -v

2.安装nrm(用于指定国内镜像源,加速依赖包下载速度):

安装nrm:

bash 复制代码
npm install nrm -g

查看镜像源列表:

bash 复制代码
nrm ls

使用国内镜像源:

bash 复制代码
nrm use taobao

3.安装vue-cli脚手架(用于创建工程):

(1)先卸载已存在的旧vue-cli脚手架:

bash 复制代码
npm uninstall vue-cli -g

(2)安装vue-cli脚手架:

bash 复制代码
npm install -g @vue/cli

4.安装Visual Studio Code:

下载地址:

html 复制代码
https://code.visualstudio.com/docs/?dv=win64user

安装Vetur插件(代码自动提示):

二、使用vue-cli脚手架创建工程:

1.命令行输入创建命令:

bash 复制代码
vue create 工程名

2.根据需要选择项目配置,见下图:

可选择默认或手动配置:

勾选需要的功能:

选择vue版本:

3.打开Visual Studio Code,将整个工程拖拽到Visual Studio Code(会自动加载)。

4.启动项目:

bash 复制代码
npm run serve
相关推荐
_丿丨丨_5 小时前
XSS(跨站脚本攻击)
前端·网络·xss
天天进步20155 小时前
前端安全指南:防御XSS与CSRF攻击
前端·安全·xss
呼啦啦呼啦啦啦啦啦啦6 小时前
利用pdfjs实现的pdf预览简单demo(包含翻页功能)
android·javascript·pdf
拾光拾趣录7 小时前
括号生成算法
前端·算法
拾光拾趣录8 小时前
requestIdleCallback:让你的网页如丝般顺滑
前端·性能优化
前端 贾公子8 小时前
vue-cli 模式下安装 uni-ui
前端·javascript·windows
拾光拾趣录8 小时前
链表合并:双指针与递归
前端·javascript·算法
@大迁世界8 小时前
前端:优秀架构的坟墓
前端·架构
拼图2098 小时前
element-plus——图标推荐
javascript·vue.js·elementui
期待のcode9 小时前
图片上传实现
java·前端·javascript·数据库·servlet·交互