`@jsxImportSource` does not imply a module, breaking emit

[kitsonk]

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.

[andrewbranch]

cc Wesley Wigham (@weswigham), I know there were a lot of discussions about implicit moduleness of new React code, don’t remember where we landed.

[weswigham]

Yeah, we'd like to change it so we can always parse things as modules under certain compiler settings, but to do so would likely require a breaking change to put parser API, which is why we put off doing it. Once we're okay taking a breaking change to our parser API, though (or introduce a new parser API?), I imagine we can make the change.