nitrojs / nitrojs/nitro

Dynamic Imports Aren't Compiled (JSX)

Open
#2,760 0 comments 1 reaction 0 assignees View on GitHub

Nobody has claimed this yet.

bug v2
Dominant language
TypeScript
Stars
11.2k
Forks
899
Avg merge
2d 24m
Merged PRs (30d)
40

Description

Environment
$ node --version
v18.20.3
$ npm ls
+-- @esbuild/linux-x64@0.20.2 extraneous
+-- @parcel/watcher-linux-x64-glibc@2.4.1 extraneous
+-- @parcel/watcher-linux-x64-musl@2.4.1 extraneous
+-- @rollup/rollup-linux-x64-gnu@4.22.5 extraneous
+-- @rollup/rollup-linux-x64-musl@4.22.5 extraneous
+-- nitropack@2.9.7
`-- node-addon-api@7.1.1 extraneous
Reproduction

stackblitz.com/edit/node-ru2nde

Describe the bug

When programmatically generating a path for importing with await import(), Nitro does not compile the imported file correctly.

const { default: _App } = import("src/App.jsx"); // 👍 `src/App.jsx` converted to `js` and imported

const { default: _App } = import(path.resolve(process.cwd(), "src/App.jsx")); // 👎 `src/App.jsx` not compiled
const { default: _App } = import(`${'/home/projects/node-ru2nde/src/App.jsx'}`) // 👎 `src/App.jsx` not compiled
Additional context

No response

Logs
Unknown file extension ".jsx" for /home/projects/node-ru2nde/src/App.jsx

  at __node_internal_captureLargerStackTrace2 (https://noderu2nde-alzg.w-corp-staticblitz.com/builtins.ddb8d84d.js:101:5335)
  at new NodeError (https://noderu2nde-alzg.w-corp-staticblitz.com/builtins.ddb8d84d.js:101:4149)
  at Object.getFileProtocolModuleFormat [as file:] (https://noderu2nde-alzg.w-corp-staticblitz.com/builtins.ddb8d84d.js:149:1318)
  at defaultGetFormat (https://noderu2nde-alzg.w-corp-staticblitz.com/builtins.ddb8d84d.js:149:1953)
  at defaultLoad (https://noderu2nde-alzg.w-corp-staticblitz.com/builtins.ddb8d84d.js:153:1154)
  at ModuleLoader.load (https://noderu2nde-alzg.w-corp-staticblitz.com/builtins.ddb8d84d.js:154:3400)
  at ModuleLoader. (https://noderu2nde-alzg.w-corp-staticblitz.com/builtins.ddb8d84d.js:154:2452)
  at new ModuleJob (https://noderu2nde-alzg.w-corp-staticblitz.com/builtins.ddb8d84d.js:155:876)
  at #s (https://noderu2nde-alzg.w-corp-staticblitz.com/builtins.ddb8d84d.js:154:2337)
  at ModuleLoader.getJobFromResolveResult (https://noderu2nde-alzg.w-corp-staticblitz.com/builtins.ddb8d84d.js:154:2195)
  at ModuleLoader.getModuleJob (https://noderu2nde-alzg.w-corp-staticblitz.com/builtins.ddb8d84d.js:154:1965)
  at async ModuleLoader.import (https://noderu2nde-alzg.w-corp-staticblitz.com/builtins.ddb8d84d.js:154:2646)

Contributor guide

Open the contributing guide

First steps

  1. Read the whole issue, then the project's contributing guide.
  2. Comment on the issue to say you are picking it up — it saves two people doing the same work.
  3. Fork the repository and make your change on a branch.
  4. Open a pull request that references the issue number.

Research direction

Start with the linked StackBlitz reproduction using Node v18.20.3 and inspect how Nitro handles the two dynamic import forms shown in the issue. No source file or test is named; done means imports using resolved or template-generated JSX paths are compiled like the literal path without the reported unknown-extension error.

Written by the indexing model from the issue text.

Assessment

Tech stack
javascript, typescript
Domain
build-system
Issue type
Bug
Difficulty
3/5
Estimated time
1-2 days
Activity status
Stale
Clarity
Mostly clear
Newbie friendliness
45/100

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.