使用Vite创建Vue项目能否自动生成VueX和Vue Router相关文件？

Vite 官方默认的基础 Vue 项目模板仅提供最小化的可运行目录结构，本身不内置开箱生成 Vue Router、Vuex 相关文件的能力，你可以通过以下几种方式实现和 Vue CLI 类似的初始化效果：

方法1：使用官方 create-vue 脚手架初始化 #

官方推出的 create-vue 是基于 Vite 的 Vue 项目初始化工具，支持在创建阶段交互式选择需要集成的生态能力，勾选 Vue Router、Pinia（Vuex 官方推荐的下一代状态管理方案）后会自动生成对应的目录结构和初始配置，操作步骤如下：

1. 执行初始化命令

npm create vue@latest

2. 按照终端提示选择是否启用 TypeScript、JSX 支持，在路由、状态管理选项处选择「是」，工具会自动完成对应文件的生成和依赖安装。

方法2：使用第三方预制 Vite 模板 #

如果你需要直接使用 Vuex 而非 Pinia，可以选择社区维护的适配 Vite 的 Vue 项目模板，这类模板通常已经提前配置好 Vue Router、Vuex、CSS 预处理器等常用开发能力，创建完成后可直接进入业务开发，不需要手动调整基础配置。

已有 Vite 项目手动补装配置 #

如果已经基于最小模板创建了项目，可以手动安装依赖补充对应配置：

• 安装 Vue Router

npm install vue-router@4

新建 src/router/index.js 写入基础路由配置后，在项目入口 main.js 中注册路由插件即可。

• 安装 Vuex

npm install vuex@4

新建 src/store/index.js 写入基础状态管理配置后，在项目入口 main.js 中注册 Vuex 插件即可。

内容的提问来源于stack exchange，提问作者Felix