第一步：安装vite （1）、去Node.js 官网安装node
1、安装 Node.js >=12.0.0
二、搭建vite项目
（1）、安装全局vite
npm install -g create-vite-app 第二步：创建项目 创建基于 vite 的 vue3 项目，执行以下代码：
create-vite-app create-vite-app vue3-vite-demo 注意：此处可能会出现create-vite-app : 无法加载文件 C:\Users 的错误；
解决方法：
1、搜索框输入：Windos PowerShell 并且以管理员身份运行
2、打开了命令行之后,输入set-ExecutionPolicy RemoteSigned，并且把权限改权限为A，然后通过 get-ExecutionPolicy 查看当前的状态：
3、最后我们就可以使用命令创建项目了！
创建完成的项目结构是这样的：
package.json 中可以看到依赖非常少，只有 vite 和 @vue/compiler-sfc ，没有 babel，因为 vite 是通过浏览器去解析模块。
接下来需要手动下载依赖：
$ npm install 1
然后启动项目：
$ npm run dev 注意 vite dev server 默认端口是3000，这边改为了 8000 端口，后面会讲怎么改配置。
现在的项目只能用来写写 HelloWorld，还不能够进行实际的开发，下面来介绍一下项目配置。
2、引入vue-router 查看vue-router版本：
$ npm info vue-router versions 直接安装最新的版本vue-router：
$ npm install vue-router 在src目录下创建以下目录：
- src |- router ||- index.js |- views |- home.vue |- about.vue
在router -> index.js中添加如下代码：
import { createRouter, createWebHistory } from 'vue-router' // 开启历史模式 // vue2中使用的mode：history 实现 const routerHistory = createWebHistory(); const router = createRouter({ history: routerHistory, routes: [ { path:'/', redirect:'/home' }, { path:'/home', component: () => import('../view/home.vue') }, { path:'/about', component: () => import('../view/about.vue') }, ] }) export default router 在main.js中修改代码：
import { createApp } from 'vue' import App from './App.vue' import './index.css' // 引入路由 import router from "./router"; createApp(App).use(router).mount("#app"); 在App.vue中修改代码：
在重新启动，打开页面，就已经默认路由指向的页面了。到这里，vue3.0+vite+router搭建项目就已经完成了。
下一篇，继续为大家分享一下vite.config.js和Element plus等的配置。
最后，感谢您的阅读。
你学到了什么，欢迎补充！！
欢迎大家留言讨论，祝工作顺利、生活愉快！