Transforming index.html sets Content-Type: application/javascript

[jakobrosenberg]

Do NOT ignore this template or your issue will have a very high chance to be closed without comment.

Describe the bug

Transforming index.html sets Content-Type: application/javascript for index.html.

Should be text/html.

Reproduction

Please provide a link to a repo that can reproduce the problem you ran into.

  const server = vite.createServer({
    ...options,
    transforms: [{
      test: ({ id }) => id === '/',
      transform: ({ code }) => code.replace('__SCRIPT__', '<script>...</script>')
    }],
  }).listen(3000)

System Info

• required vite version: 1.0.0-beta.11
• required Operating System: Windows
• required Node version: 12.14.1

Logs (Optional if provided reproduction)

[vite] failed to parse / for import rewrite.
If you are using JSX, make sure to named the file with the .jsx extension.

[jakobrosenberg]

I suspect this could be caused by me transforming directly in createServer rather than resolving options from a config file.

[jakobrosenberg]

So I tried moving the transform into the config file instead and loading it through resolveConfig. As a result index.html isn't accessible through transform. 😢

[underfin]

Note: the plguin will not work on build, because you only match the dev id(request uri), it's diffrent for build(real file path).

[jakobrosenberg]

Thanks for you the reply @underfin.

What's the correct approach for transforming index.html?

[jakobrosenberg]

The real issue here seems to be the build function ignoring the transform of index.html. This makes it impossible for me to implement Vite in a framework where I need update index.html with framework specifics before Vite processes it.

[yyx990803]

Transforms are for resources imported using import inside JavaScript only, so they are always considered JS after the transform. index.html is served directly and not a JS resource.

Looks like we need a separate option for pre-processing the HTML.

[yyx990803]

#556