Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Failed to load module script: The server responded with a non-JavaScript MIME type of "text/html". #108

Closed
albertog opened this issue May 9, 2020 · 6 comments

Comments

@albertog
Copy link

albertog commented May 9, 2020

After update from vite v0.12.0 to v0.13.2 the vite failed saying in browser console

Failed to load module script: The server responded with a non-JavaScript MIME type of "text/html". Strict MIME type checking is enforced for module scripts per HTML spec.
shared:442

Uncaught ReferenceError: process is not defined at shared:442

vite v0.13.2

Dev server running at:

Local: http://localhost:3000/
Network: http://192.168.1.132:3000/

albertog@elitebook ~/Documentos/work/myapp $ yarn DEBUG-dev
yarn run v1.22.4
warning package.json: No license field
$ DEBUG=vite* vite
vite v0.13.2

Dev server running at:

Local: http://localhost:3000/
Network: http://192.168.1.132:3000/

vite:server server ready in 493ms. +0ms
vite:history redirecting / to /index.html +0ms
vite:history redirecting /@hmr to /index.html +2s
vite:resolve (vue) vue -> node_modules/@vue/runtime-dom/dist/runtime-dom.esm-bundler.js +0ms
vite:history not redirecting /router.js (relative url) +14ms
vite:sfc /home/albertog/Documentos/work/myapp/App.vue parsed in 36ms. +0ms
vite:rewrite /@modules/vue: rewriting +0ms
vite:rewrite "@vue/runtime-core" --> "/@modules/@vue/runtime-core" +5ms
vite:hmr /@modules/vue imports /@modules/@vue/runtime-core +0ms
vite:rewrite "@vue/runtime-core" --> "/@modules/@vue/runtime-core" +2ms
vite:hmr /@modules/vue imports /@modules/@vue/runtime-core +0ms
vite:rewrite "@vue/shared" --> "/@modules/@vue/shared" +1ms
vite:hmr /@modules/vue imports /@modules/@vue/shared +1ms
vite:sfc /home/albertog/Documentos/work/myapp/views/Home.vue parsed in 156ms. +222ms
vite:hmr serving hmr client +182ms
vite:sfc /home/albertog/Documentos/work/myapp/App.vue parse cache hit +16ms
vite:sfc /App.vue template compiled in 35ms. +36ms
vite:resolve (vue) @vue/shared -> node_modules/@vue/shared/dist/shared.esm-bundler.js +349ms
vite:resolve (redirect) animate.css -> animate.css +2ms
vite:rewrite (skipped) /@modules/animate.css +251ms
vite:sfc /home/albertog/Documentos/work/myapp/views/Home.vue parse cache hit +41ms
vite:sfc /views/Home.vue template compiled in 187ms. +187ms
vite:resolve (vue) @vue/runtime-core -> node_modules/@vue/runtime-core/dist/runtime-core.esm-bundler.js +223ms
vite:resolve (node_modules) vue-router/dist/vue-router.esm.js -> node_modules/vue-router/dist/vue-router.esm.js +2ms
vite:resolve (node_modules) animate.css/animate.css -> node_modules/animate.css/animate.css +3ms
vite:rewrite /@modules/@vue/shared: no imports found. +210ms
vite:rewrite /@modules/vue-router/dist/vue-router.esm.js: rewriting +20ms
vite:rewrite "vue" --> "/@modules/vue" +19ms
vite:hmr /@modules/vue-router/dist/vue-router.esm.js imports /@modules/vue +319ms
vite:rewrite /@modules/@vue/runtime-core: rewriting +183ms
vite:rewrite "@vue/reactivity" --> "/@modules/@vue/reactivity" +10ms
vite:hmr /@modules/@vue/runtime-core imports /@modules/@vue/reactivity +192ms
vite:rewrite "@vue/reactivity" --> "/@modules/@vue/reactivity" +0ms
vite:hmr /@modules/@vue/runtime-core imports /@modules/@vue/reactivity +0ms
vite:rewrite "@vue/shared" --> "/@modules/@vue/shared" +1ms
vite:hmr /@modules/@vue/runtime-core imports /@modules/@vue/shared +1ms
vite:rewrite /@modules/animate.css/animate.css: rewriting +3s
vite:rewrite "vite/hmr" --> "/vite/hmr" +21ms
vite:resolve (vue) @vue/reactivity -> node_modules/@vue/reactivity/dist/reactivity.esm-bundler.js +3s
vite:rewrite /@modules/@vue/reactivity: rewriting +20ms
vite:rewrite "@vue/shared" --> "/@modules/@vue/shared" +1ms
vite:hmr /@modules/@vue/reactivity imports /@modules/@vue/shared +3s
vite:history redirecting / to /index.html +41s
vite:history redirecting /@hmr to /index.html +79ms
vite:resolve (vue) vue -> node_modules/@vue/runtime-dom/dist/runtime-dom.esm-bundler.js +38s
vite:sfc /home/albertog/Documentos/work/myapp/App.vue parse cache hit +41s
vite:history not redirecting /router.js (relative url) +29ms
vite:sfc /home/albertog/Documentos/work/myapp/views/Home.vue parse cache hit +54ms
vite:resolve (cached redirect) animate.css -> animate.css +63ms
vite:rewrite (skipped) /@modules/animate.css +38s
vite:hmr serving hmr client +38s
vite:sfc /home/albertog/Documentos/work/myapp/App.vue parse cache hit +12ms
vite:sfc /App.vue template cache hit +0ms
vite:resolve (vue) @vue/runtime-core -> node_modules/@vue/runtime-core/dist/runtime-core.esm-bundler.js +8ms
vite:resolve (vue) @vue/shared -> node_modules/@vue/shared/dist/shared.esm-bundler.js +2ms
vite:resolve (cached) vue-router/dist/vue-router.esm.js -> node_modules/vue-router/dist/vue-router.esm.js +10ms
vite:resolve (cached) animate.css/animate.css -> node_modules/animate.css/animate.css +26ms
vite:sfc /home/albertog/Documentos/work/myapp/views/Home.vue parse cache hit +902ms
vite:sfc /views/Home.vue template cache hit +2ms
vite:resolve (vue) @vue/reactivity -> node_modules/@vue/reactivity/dist/reactivity.esm-bundler.js +865ms
vite:history redirecting / to /index.html +33s
vite:history redirecting /@hmr to /index.html +633ms
vite:sfc /home/albertog/Documentos/work/myapp/App.vue parse cache hit +33s
vite:resolve (vue) vue -> node_modules/@vue/runtime-dom/dist/runtime-dom.esm-bundler.js +33s
vite:history not redirecting /router.js (relative url) +6ms
vite:resolve (cached redirect) animate.css -> animate.css +36ms
vite:rewrite (skipped) /@modules/animate.css +34s
vite:sfc /home/albertog/Documentos/work/myapp/views/Home.vue parse cache hit +69ms
vite:hmr serving hmr client +34s
vite:sfc /home/albertog/Documentos/work/myapp/App.vue parse cache hit +4ms
vite:sfc /App.vue template cache hit +0ms
vite:resolve (vue) @vue/runtime-core -> node_modules/@vue/runtime-core/dist/runtime-core.esm-bundler.js +36ms
vite:resolve (vue) @vue/shared -> node_modules/@vue/shared/dist/shared.esm-bundler.js +23ms
vite:resolve (cached) vue-router/dist/vue-router.esm.js -> node_modules/vue-router/dist/vue-router.esm.js +1ms
vite:resolve (cached) animate.css/animate.css -> node_modules/animate.css/animate.css +1ms
vite:sfc /home/albertog/Documentos/work/myapp/views/Home.vue parse cache hit +1s
vite:sfc /views/Home.vue template cache hit +1ms
vite:resolve (vue) @vue/reactivity -> node_modules/@vue/reactivity/dist/reactivity.esm-bundler.js +1s

Describe the bug

A clear and concise description of what the bug is.

System Info

  • required vite version:
  • required Operating System:
  • required Node version:
  • Optional:
    • npm/yarn version
    • Installed vue version (from yarn.lock or package-lock.json)
    • Installed @vue/compiler-sfc version

Logs

  1. run vite or vite build with the DEBUG environment variable set to vite:* - e.g. modify the dev script in your package.json to:

    DEBUG=vite:* vite

    On windows, you will need cross-env:

    cross-env DEBUG=vite:* vite
  2. Provide the error log here.

Reproduction

Provide a link to a reproduction repo if applicable.

@albertog albertog added the bug label May 9, 2020
@yyx990803
Copy link
Member

You'll need to provide the actual reproduction. This error message doesn't help at all.

Also, try open your devtools Network tab, tick "disable cache" and reload the page.

@albertog
Copy link
Author

Ok when I have disabled cached It have worked propertly thanks

@beetaa
Copy link

beetaa commented May 16, 2020

@albertog when I import components without the '.vue' extension, I get the same error. just try to fix this by simply add the extension to your component's path.

@bloqhead
Copy link

@beetaa thank you! This fixed my issue.

For anyone reading:

  • Change this: import Pagination from './components/Pagination'
  • To this: import Pagination from './components/Pagination.vue'

@qnp
Copy link
Contributor

qnp commented Apr 5, 2021

I came across the same problem. The point is that I am porting a vue-cli-3 app to vite, it is a very big webapp so I have hundreds of imports as import Component from './components/Component' without the .vue and I don't think the solution to add .vue to all imports can be looked at acceptable.

However, looking into this answer, I bet I have no other choice than to bend over the "by design" requirement...
#178 (comment)

@williamyorkl
Copy link

@qnp bro, is it possible to write a tool based on AST to solved this problem ?

@github-actions github-actions bot locked and limited conversation to collaborators Jul 16, 2021
Sign up for free to subscribe to this conversation on GitHub. Already have an account? Sign in.
Labels
None yet
Projects
None yet
Development

No branches or pull requests

6 participants