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相关文档:

相关推荐
不会敲代码15 小时前
手写 Zustand:三十分钟带你搞懂状态管理库的核心原理
前端·javascript·源码
神奇的程序员5 小时前
重构了自己5年前写的截图插件
前端·javascript·架构
橙淮5 小时前
从优化到安全再到未来 ——JavaScript 全维度技术指南
javascript
UXbot7 小时前
一人独立交付 UI + 前端:AI 驱动 UI 设计工具的五大功能模块深度评测
前端·低代码·ui·设计模式·交互
kobesdu7 小时前
【ROS2实战笔记-19】ROS2 生命周期节点的启动顺序、状态转换陷阱与热备方案
java·前端·笔记·机器人·ros·ros2
诚实可靠王大锤7 小时前
React Native 输入框与按钮焦点冲突解决方案(rn版本0.70.3)
前端·javascript·react native·react.js
kyriewen7 小时前
测试妹子让我写单测,我偷偷用AI一天干完一周的活
前端·chatgpt·cursor
2601_957780848 小时前
Claude Code 2026年最新部署指南:从环境搭建到技能扩展
前端·人工智能·ai编程·claude
zhangfeng11338 小时前
workbuddy 专家 “前端开发师” 结合nvidia-mistral-small-4-119b-2603 项目计划-前端界面开发.md
前端·人工智能·免费
IT_陈寒10 小时前
为什么Java的Stream并行处理反而变慢了?
前端·人工智能·后端