Importing TypeScript files with `?url` suffix result in the file not being transpiled
See original GitHub issueDescribe the bug
I’m using the ?url
suffix to import a TypeScript file to use it in an AudioWorklet.
import workletUrl from './audio.worklet.ts?url';
const audioContext = new AudioContext();
audioContext.audioWorklet.addModule(workletUrl);
The problem is that Vite is not transpiling my TS file into a JS one, so the worklet fails because of it.
I think Vite should either transpile the files that it knows how to transpile, and return as URL the transpiled file, or a new option should be added to tell Vite to transpile it (e.g. ?url&transpile
)
Reproduction
https://github.com/FezVrasta/vite-ts-url-import
System Info
System:
OS: macOS 12.5.1
CPU: (10) arm64 Apple M1 Max
Memory: 2.36 GB / 32.00 GB
Shell: 5.8.1 - /bin/zsh
Binaries:
Node: 16.16.0 - ~/.nvm/versions/node/v16.16.0/bin/node
Yarn: 1.22.19 - ~/.nvm/versions/node/v16.16.0/bin/yarn
npm: 8.11.0 - ~/.nvm/versions/node/v16.16.0/bin/npm
Watchman: 2022.05.16.00 - /opt/homebrew/bin/watchman
Browsers:
Brave Browser: 104.1.42.97
Chrome: 105.0.5195.52
Firefox: 103.0.1
Safari: 15.6.1
npmPackages:
vite: ^3.0.7 => 3.0.9
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.
Issue Analytics
- State:
- Created a year ago
- Comments:6 (4 by maintainers)
Top Results From Across the Web
Typescript – How to solve the problem with unresolved path ...
js file containing the line with the path alias. The actual cause of the issue is that the tsc compiler does not transpiles...
Read more >node.js - Transpiling Typescript into Javascript results in a ...
I'm just getting into typescript and my tsconfig.json ... and when I import a module in my typescript file I import it as...
Read more >TSConfig Reference - Docs on every TSConfig option
When set to true, allowUmdGlobalAccess lets you access UMD exports as globals from inside module files. A module file is a file that...
Read more >Processing TypeScript using TypeScript - Convinced Coder
However, if you import the “typescript” module in your application code, ... if the file you transpile imports other TypeScript files, ...
Read more >sass-loader - webpack - JS.ORG
It is natural to expect relative references to be resolved against the .sass / .scss file in which they are specified (like in...
Read more >
Top Related Medium Post
No results found
Top Related StackOverflow Question
No results found
Troubleshoot Live Code
Lightrun enables developers to add logs, metrics and snapshots to live code - no restarts or redeploys required.
Start Free
Top Related Reddit Thread
No results found
Top Related Hackernoon Post
No results found
Top Related Tweet
No results found
Top Related Dev.to Post
No results found
Top Related Hashnode Post
No results found
Looks like a bug that it should be transpiled by default, you can workaround it by using
new URL('./path/to/file.ts', import.meta.url)
. Though for AudioWorklet, even if?url
works you might hit https://github.com/vitejs/vite/issues/9606Duplicate of #6979