TypeScript 2 TSX preserve and noimplicitany error TS2602: the global type 'JSX.Element' does not exist

Question

I'm using TypeScript 2 and TSX with the preserve (not React) setting and with "noImplicitAny" enabled:

"noImplicitAny": true,
"jsx": "preserve"

The problem is, I keep getting this error when trying to build a simple TSX file:

error TS2602: JSX element implicitly has type 'any' because the global type 'JSX.Element' does not exist.

Here's an example of my TSX file:

'use strict';

import m from './m';

export default {
  view() {
    return (
      <h1>Hello Mithril!</h1>
    );
  }
};

I'm trying to get TSX working with a non-React stack (Mithril). Thanks in advance!

Answer 1

Due to the lack of reputation it won't let me comment on youen's answer above so I'll include this in an answer of my own.

First of all, you can include this gist at the top of your project and name it something like mithril-jsx.d.ts so that typescript will see it as a type definition and won't compile it. The linked gist simply declares JSX.element as m.Vnode<any, any> and lists every HTML element under JSX.IntrinsicElements as any. Not a huge deal but a time saver.

Second, and the reason I'm even posting this: You do not need gulp or any other tool to compile .tsx files to mithril-using .js ones. All you have to do is specify these in your tsconfig.json

{
  "compilerOptions": {
    //...your other stuff here
    "jsx": "react",
    "jsxFactory": "m"
  }
}

More information about the compiler options here: http://www.typescriptlang.org/docs/handbook/compiler-options.html

Answer 2

I am also developing with Mithril(2.0.3) and TypeScript(3.5.3).

TS7026: JSX element implicitly has type 'any' because no interface 'JSX.IntrinsicElements' exists.

This error message can be resolved by installing @types/react.

npm install --save-dev @types/react

tsconfig.json has the following settings.

{
  "compilerOptions": {
    "jsx": "react",
    "jsxFactory": "m"
  }
}