Description
This is Re: #40502 cc @weswigham @DanielRosenwasser
Using the new JSX transform and Preact as import source, TypeScript doesn't seem to pick up the JSX types that are shipped by Preact. It works as described in #40502 with additionally installed @types/react
, but not with the types that come with Preact itself. Daniel suggested filing a new bug 😄
TypeScript Version: 4.1.0-dev.20201015
Search Terms: Preact, JSX, JSX Transform
Code
{
"compilerOptions": {
...
"jsx": "react-jsx",
"jsxImportSource": "preact",
"types": ["preact/jsx-runtime"],
}
}
This is the d.ts
file that contains the JSX definitions: https://github.com/preactjs/preact/blob/master/jsx-runtime/src/index.d.ts
import { render } from "preact";
function App() {
return (
<>
<h1>Hello World</h1>
</>
);
}
const node = document.querySelector("#app");
if (node) {
render(<App />, node);
}
export default {};
Note: The JSX definitions are in the jsx
and jsxDEV
namespaces. I thought this might be an issue. But If I move JSX into the global namespace with
declare global {
export import JSX = JSXInteral;
}
I get a compile error: Cannot read property 'get' of undefined
Expected behavior: Since TypeScript knows to pull in jsx from preact/jsx-runtime
, I'd expect it to pull in JSX types from preact/jsx-runtime/src/index.d.ts
.
Actual behavior: JSX element implicitly has type 'any' because no interface 'JSX.IntrinsicElements' exists.ts(7026)
Playground Link: I have a branch in a repo: https://github.com/ddprrt/preact-typescript-starter/tree/jsx-transform
Related Issues: #40502