AljoschaMeyer
AljoschaMeyer4mo ago

Working around imports without a file extension

I'm facing an apparent contradiction between the requirements for importing modules, and the import statements generated by jsx compilation. The deno module docs cleary state that imports must explicitly specify a file extension:
It adopts browser-like module resolution, meaning that file names must be specified in full. You may not omit the file extension and there is no special handling of index.js. import { add, multiply } from "./arithmetic.ts";
When deno compiles jsx/tsx, it inserts import statements that violate this requirement:
When using the automatic transforms, Deno will try to import a JSX runtime module that is expected to conform to the new JSX API and is located at either jsx-runtime or jsx-dev-runtime. For example if a JSX import source is configured to react, then the emitted code will add this to the emitted file: import { jsx as _jsx } from "react/jsx-runtime";
As someone who is not deeply familiar with javascript/typescript tooling and modules, this leaves me completely stumped. I can successfully configure deno to use a custom jsx factory, but it refuses to compile due to faulty imports that it itself inserted and that I cannot seem to influence. To turn this into a question: help?
3 Replies
AljoschaMeyer
AljoschaMeyer4mo ago
Later, the deno jsx docs propose using import maps as a workaround:
In situations where the import source plus /jsx-runtime or /jsx-dev-runtime is not resolvable to the correct module, an import map can be used to instruct Deno where to find the module.
That sentence seems to imply that there also are situations where "import source plus /jsx-runtime or /jsx-dev-runtime" is resolvable. What would these situations look like? I'm hesitant about import maps as a workaround because the import map docs explicitly warn that they are only used for applications but not for libraries. There has to be a way to use custom jsx in libraries, though. Right?
blint
blint4mo ago
I agree that it would make sense for a lib to use its own JSX runtime. Even with @jsxImportSource pragma, it seems we can't set a local runtime without import map. Currently, I work around this by calling jsx function manually in regular ts files.
AljoschaMeyer
AljoschaMeyer4mo ago
Found a similar question on here, unfortunately no answers: https://discord.com/channels/684898665143206084/1105151692766457907/1105151692766457907