Vue3快速入门(一)环境配置与项目创建

开发环境:

  • vue 版本:vue3
  • node 版本:18.3 以上 淘宝镜像配置
  • 开发工具:VsCode

目录

1、node下载

node官网:https://nodejs.cn/download/

[2、vue-cll 安装](#2、vue-cll 安装)

3、淘宝镜像配置

[4、VsCode 的下载安装](#4、VsCode 的下载安装)

[5、安装 Chrome 浏览器](#5、安装 Chrome 浏览器)

6、万事俱备,开始创建vue3项目

[(1)vite 的安装](#(1)vite 的安装)

(2)项目文件夹创建

[(3)创建 vue3+Ts 项目](#(3)创建 vue3+Ts 项目)

(4)安装依赖运行vue3项目


1、node下载

node官网:https://nodejs.cn/download/

2、vue-cll 安装

javascript 复制代码
//安装vue脚手架
npm install -g @vue/cli  

vue -V  //查看版本信息,能够查看到就说明安装成功了

3、淘宝镜像配置

bash 复制代码
1、查看当前镜像路径
npm config get registry

2、更换npm为国内镜像
// npm config set registry https://registry.npm.taobao.org (旧的已废弃)
npm config set registry https://registry.npmmirror.com (新的)

3、检查镜像是否配置成功
npm config get registry

4、VsCode 的下载安装

5、安装 Chrome 浏览器

  • (2)插件工具下载与安装:

6、万事俱备,开始创建vue3项目

(1)vite 的安装

javascript 复制代码
Vite 需要 Node.js 版本 >= 12.0.0。

//全局安装vite 
npm install -g vite
//查看版本
vite -v

(2)项目文件夹创建

(3)创建 vue3+Ts 项目

javascript 复制代码
npm create vue@latest //创建vite 工程项目

(4)安装依赖运行vue3项目

  • 此时vue3+TS+vite的项目已经创建完成

更多Vue3相关文档:

相关推荐
jktantan6 小时前
Vue keep-alive 切标签后滚动位置回顶?因为 onDeactivated 里读到的 scrollTop 是 0
前端·javascript·vue.js
总要学点什么6 小时前
第89篇:三维特效-螺旋圆效果——让螺旋臂卷起一圈圈外扩的涟漪
开发语言·javascript·ecmascript·webgl·cesium·空间分析·1024程序员节
2601_962885727 小时前
quotes 字段全解:涨跌幅、振幅、换手率的口径与单位
java·前端·spring
excel7 小时前
encodeURI 和 encodeURIComponent 有什么区别?
前端
前端精髓7 小时前
调用openrouter的免费API模型
java·前端·javascript
赛博守夜人8 小时前
AI安全攻防与治理之十四:AI 安全测试不能脱离传统安全,Web、API、移动端与模型攻击面的组合拳
前端·人工智能·安全
开开心心_Every8 小时前
快速隐藏程序工具自定义快捷键一键切换
java·开发语言·前端·spring·智能手机·word·intellij-idea
networknomad8 小时前
OpenReplay:自己搭的会话回放工具,给前端排错用的
前端·其他
缓慢更新9 小时前
AI 辅助生成单测:从接口定义到用例的流水线
java·服务器·前端·网络·数据库·人工智能
陈随易10 小时前
AI 运维服务器,安全又可靠的方法
前端·后端·程序员