vue vite 创建多页面项目

Vue Vite是一个快速的构建工具，可以用于创建Vue.js项目。它提供了一种简单的方式来创建多页面项目。下面是使用Vue Vite创建多页面项目的步骤：

1. 首先，确保你已经安装了Node.js和npm。你可以在终端中运行以下命令来检查它们的版本：

node -v
npm -v

2. 接下来，你需要全局安装Vite。在终端中运行以下命令：

npm install -g create-vite

3. 创建一个新的Vue Vite项目。在终端中运行以下命令：

create-vite my-project

这将创建一个名为`my-project`的新文件夹，并在其中初始化一个Vue Vite项目。

4. 进入项目文件夹：

cd my-project

5. 安装项目依赖：

npm install

6. 创建多页面配置文件。在项目根目录下创建一个名为`vite.config.js`的文件，并添加以下内容：

import { defineConfig } from 'vite'

export default defineConfig({
  build: {
    rollupOptions: {
      input: {
        page1: 'src/page1/main.js',
        page2: 'src/page2/main.js',
        // 添加更多页面的入口文件
      }
    }
  }
})

这里假设你的多页面项目有两个页面，分别是`page1`和`page2`。你可以根据实际情况添加更多页面的入口文件。

7. 创建页面文件。在`src`文件夹下创建`page1`和`page2`文件夹，并在每个文件夹中创建一个名为`main.js`的入口文件。

8. 运行项目。在终端中运行以下命令启动开发服务器：

npm run dev

这将启动一个本地开发服务器，并在浏览器中打开默认页面。

至此，你已经成功创建了一个Vue Vite多页面项目。你可以根据需要添加更多页面，并在`vite.config.js`中配置它们的入口文件。