Vue3初体验（1）

1、Vite简单操作

安装

yarn global add create-vite-app@1.18.0

创建项目

文档的命令

npm init vite-app 项目名
yarn create vite-app 项目名

等价于

全局安装后
cva 项目名
或
npx create-vite-app 项目名

2、Vue3与Vue2的区别

• Vue3的Template支持多个跟标签，Vue2不支持
• Vue3有createApp()，而Vue2是new Vue()
• createApp(组件)，new Vue({template,render})

3、Vue-router 4

3.1 查看所有版本号

npm info vue-router versions

3.2 安装vue-router 4

yarn add vue-router@4.0.0-beta.3

3.3 初始化vue-router

新建history对象

在main.ts中添加

import {
   createWebHashHistory, createRouter} from 'vue-router'

const history = createWebHashHistory()

新建router对象

const router = createRouter({
   
  history,
  routes: [
    {
   path: '/', component: Easyw},
  ],
});

app.use(router)

const app = createApp(App);
app.use(router);
app.mount('#app'); // 挂载组件

在