-
Notifications
You must be signed in to change notification settings - Fork 13k
Closed
Labels
Fix AvailableA PR has been opened for this issueA PR has been opened for this issueNeeds InvestigationThis issue needs a team member to investigate its status.This issue needs a team member to investigate its status.
Description
Bug Report
π Search Terms
jsxImportSource
π Version & Regression Information
- This has existed in every version I have tried since the pragma was introduced.
β― Playground Link
Playground link with relevant code - broken
Playground link with relevant code - working
π» Code
The following code...
/** @jsxImportSource react */
function App() {
return (
<div>
<h1>Hello, world!</h1>
</div>
);
}
<App />;
console.log("Hey!");
Will emit:
"use strict";
/** @jsxImportSource react */
function App() {
return (_jsx("div", { children: _jsx("h1", { children: "Hello, world!" }, void 0) }, void 0));
}
_jsx(App, {}, void 0);
console.log("Hey!");
Which is broken, because there is no _jsx
symbol being imported.
But the following code:
/** @jsxImportSource react */
function App() {
return (
<div>
<h1>Hello, world!</h1>
</div>
);
}
<App />;
console.log("Hey!");
export {};
Will change the emit to:
import { jsx as _jsx } from "react/jsx-runtime";
/** @jsxImportSource react */
function App() {
return (_jsx("div", { children: _jsx("h1", { children: "Hello, world!" }, void 0) }, void 0));
}
_jsx(App, {}, void 0);
console.log("Hey!");
Where the _jsx
symbol is being imported.
π Actual behavior
When there are no imports/exports, but a @jsxImportSource
pragma, the JSX is transformed expecting the _jsx
symbol to be imported, but the import never occurs.
π Expected behavior
The a @jsxImportSource
pragma implies that the file is a module and not a script and ensure that the emitted symbols are actually imported.
Metadata
Metadata
Assignees
Labels
Fix AvailableA PR has been opened for this issueA PR has been opened for this issueNeeds InvestigationThis issue needs a team member to investigate its status.This issue needs a team member to investigate its status.