1、创建 Vue3 工程
基于 vue-cli 创建（基于webpack实现）
备注：目前
vue-cli已处于维护模式，官方推荐基于Vite创建项目。
// 查看 @vue/cli版本，确保@vue/cli版本在4.5.0以上
vue --version
// 安装或者升级你的@vue/cli
npm install -g @vue/cli
// 执行创建命令
vue create vue_demo
基于 vite 创建（推荐）
-
vite是新一代前端构建工具，官网地址：https://vitejs.cn -
vite的优势如下：- 轻量快速的热重载（HMR），能实现极速的服务启动。
- 对
TypeScript、JSX、CSS等支持开箱即用。 - 真正的按需编译，不再等待整个应用编译完成。
- 创建项目请看上面笔记
- https://blog.csdn.net/qq_33365152/article/details/132917242
2、Vue3 项目开发 vscode 插件推荐
自动补充 ref 变量 value 插件配置方法 
文章来源：https://www.toymoban.com/news/detail-828515.html
文章来源地址https://www.toymoban.com/news/detail-828515.html
3、Vue3 核心语法
【optionsAPI】与【CompositionAPI】
-
Vue2的API设计是Options（配置）风格的。（选项式API） -
Vue3的API设计是Composition（组合）风格的。
Options API 的弊端
-
Options类型的API，数据、方法、计算属性等，是分散在：data、methods、computed中的，若想新增或者修改一个需求，就需要分别修改：data、methods、computed，不便于维护和复用。
Composition API 的优势
- 可以用函数的方式，更加优雅的组织代码，让相关功能的代码更加有序的组织在一起。
4、【拉开序幕的 setup】
- setup概念
-
setup是Vue3中一个新的配置项，值是一个函数，它是Composition API“表演的舞台”，组合中所用到的：数据、方法、计算属性、监听…等等，均配置在setup中。 - 特点如下：
-
setup函数返回的对象中的内容，可直接在模板中使用 -
setup中访问this是undefined -
setup函数会在beforeCreate之间调用，它是“领先”所有钩子执行的。
-
5、Vue3 自定义组件命名插件推荐
- 插件名称
vite-plugin-vue-setup-extend - 安装
npm install vite-plugin-vue-setup-extend -D
- 配置，在
vite.config.ts文件中
import {
defineConfig } from "vite";
import vue from "@vitejs/plugin-vue";
import {
fileURLToPath, URL } from "node:url";
import VueSetupExtend from "vite-plugin-vue-setup-extend";
export default defineConfig({
plugins: [vue(到了这里，关于最新 Vue3、TypeScript、组合式API、setup语法糖 学习笔记的文章就介绍完了。如果您还想了解更多内容，请在右上角搜索TOY模板网以前的文章或继续浏览下面的相关文章，希望大家以后多多支持TOY模板网！
