vite: Unexpected content if there's `import()` in a js file and import with `?url`
Describe the bug
I import a worker.js
’s URL using
import WorkerURL from "@/vendors/worker.js?url"
And vite serves worker URL to browser with added file header if there’s a import()
in the worker file
import { injectQuery as __vite__injectQuery } from "/@vite/client";
// origin worker file contents
// ........
// ........
and cause error Uncaught SyntaxError: Cannot use import statement outside a module
Reproduction
https://github.com/rwv/vite-import-url-issue
Steps to reproduce
Run npm run dev
and npm run build
and open the web page.
System Info
System:
OS: Linux 5.4 Ubuntu 20.04.1 LTS (Focal Fossa)
CPU: (16) x64 Intel(R) Xeon(R) CPU E5-2680 0 @ 2.70GHz
Memory: 24.60 GB / 31.40 GB
Container: Yes
Shell: 5.8 - /usr/bin/zsh
Binaries:
Node: 16.15.1 - ~/.nvm/versions/node/v16.15.1/bin/node
Yarn: 1.22.19 - ~/.nvm/versions/node/v16.15.1/bin/yarn
npm: 8.11.0 - ~/.nvm/versions/node/v16.15.1/bin/npm
Used Package Manager
npm
Logs
No response
Validations
- Follow our Code of Conduct
- Read the Contributing Guidelines.
- Read the docs.
- Check that there isn’t already an issue that reports the same bug to avoid creating a duplicate.
- Make sure this is a Vite issue and not a framework-specific issue. For example, if it’s a Vue SFC related bug, it should likely be reported to vuejs/core instead.
- Check that this is a concrete bug. For Q&A open a GitHub Discussion or join our Discord Chat Server.
- The provided reproduction is a minimal reproducible example of the bug.
About this issue
- Original URL
- State: closed
- Created 2 years ago
- Reactions: 1
- Comments: 17 (7 by maintainers)
Somewhat related to https://github.com/vitejs/vite/pull/12995, maybe we can inline the
injectQuery
instead of importing it.@bluwy that looks amazing! I was halfway through writing a similar solution, I should’ve checked first 😅 . I think inlining the function is the way to go for sure 👍