Vue3概述

时间:2024-10-14 07:13:16

1. Vue3概述

1.1 Vue3简介

2020年9月18日,Vue.js发布3.0版本,代号:One Piece。

1.2 vite简介

vite是新一代前端构建工具,官网地址:Vite中文网

1.3 Vue2和Vue3区别

Vue2的API设计是Options(配置)风格的。

Vue3的API设计是Composition(组合)风格的。

2. 环境搭建

2.1 Node.js环境

# 检查node.js版本:
node -v
# 检查npm版本:
npm -v

2.2 基于vue-cli创建Vue3工程

(1)配置vue-cli环境

  • 安装或者升级@vue/cli
npm install -g @vue/cli
  • 查看@vue/cli版本,确保@vue/cli版本在4.5.0以上
vue --version

(2)创建命令

npm install -g @vue/cli

(3)配置

(4)启动

cd vue_test

npm run serve

 2.3 基于vite创建Vue3工程

(1)创建命令

npm create vue@latest

(2)具体配置

(3)安装配置

npm install

(4)运行

npm run dev

2.4 浏览器插件安装

vue_dev_tools.crx

vue3_dev_tools.crx