穀風

[Vite](https://vitejs.dev/) では、以下のように `rollupOptions.input` を指定することでマルチページアプリケーションを作ることが可能です。

```js
`title: "vite.config.ts"
export default defineConfig({
  // 省略
  build: {
    rollupOptions: {
      input: {
        main: resolve(__dirname, 'src/main/index.html'),
        admin: resolve(__dirname, 'src/admin/index.html'),
        user: resolve(__dirname, 'src/user/index.html'),
      },
    },
  },
});
```

参考


[Build Options | Vite](https://rollupjs.org/configuration-options/#input)



場合によっては便利なのですが、この設定をした上で [Vue Router](https://router.vuejs.org/) のようなルーティング機能を使うと問題がおこるので注意しなければなりません。

例えば `main` 以下に `/main/users/1200` のようなサブページを作りたい場合、ルーターの設定をしただけでは動かないはずです。

この場合、サーバーは `/main/users/1200` などというページが存在しないので、特定のページに rewrite します。
これが、 Vite の dev server の場合、デフォルトで `/index.html` なのです。つまり、そんなページは存在しないとエラーを吐かれてしまいます。

これを、 `/main.html` に rewrite するよう、設定を変更しなければなりません。