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

相关推荐
烛阴1 小时前
从0到1掌握盒子模型:精准控制网页布局的秘诀
前端·javascript·css
前端工作日常4 小时前
我理解的`npm pack` 和 `npm install <local-path>`
前端
李剑一4 小时前
说个多年老前端都不知道的标签正确玩法——q标签
前端
嘉小华4 小时前
大白话讲解 Android屏幕适配相关概念(dp、px 和 dpi)
前端
姑苏洛言4 小时前
在开发跑腿小程序集成地图时,遇到的坑,MapContext.includePoints(Object object)接口无效在组件中使用无效?
前端
七八书4 小时前
Vue3 组件通信全解析:从基础到进阶的实用指南
vue.js
奇舞精选4 小时前
Prompt 工程实用技巧:掌握高效 AI 交互核心
前端·openai
用户3802258598244 小时前
vue3源码解析:模块总览
vue.js
Danny_FD5 小时前
React中可有可无的优化-对象类型的使用
前端·javascript
用户757582318555 小时前
混合应用开发:企业降本增效之道——面向2025年移动应用开发趋势的实践路径
前端