Vite: Provide path option and apply transform for index.html

Created on 8 Jul 2020  路  3Comments  路  Source: vitejs/vite

Is your feature request related to a problem? Please describe.
I'm trying to integrate Vite into a framework. The rigid index.html unfortunately makes this impossible.

The framework itself needs to transform index.html while 3rd part integrations require hacks to work with index.html in the project root.

Describe the solution you'd like
Providing a path option for index.html and apply transforms during build.

Describe alternatives you've considered
I tried centering the framework around Vite's index.html convention, but had to give up as it broke compatibility with other integrations.

Additional context
Hardcoding file structures when there's no technical requirement should always be avoided IMO. Good practices may be intended, but any value is lost when the price is incompatibility and ugly hacks.

enhancement html

All 3 comments

You can actually use a custom server plugin to serve whatever HTML you want:

createServer({
  configureServer: ({ app }) => app.use(async (ctx, next) => {
    // wait for vite history fallback
    // this redirects all valid paths to `index.html`
    await next()
    if (ctx.url.endsWith('.html')) {
      ctx.body = ... // serve whatever html you want or transform ctx.body (if exists)
      ctx.status = 200
    }
  })
})

Thanks for the suggestion @yyx990803. I got it working for development, but build is another story. Not sure how to tackle that.

https://github.com/vitejs/vite/blob/master/src/node/build/index.ts#L268

Another related thing that would be really nice is to be able to have index.pug (or other language) transformed to index.html, so that all the HTML in a project could be written in pug/etc rather than only components.

Was this page helpful?
0 / 5 - 0 ratings