Visual Studio Code: There is no interface "JSX.IntrinsicElements" (nano-jsx@0.0.21)

[jrson83]

Describe the bug

This is maybe not related to Nano JSX at all, but when I npm i nano-jsx@0.0.21 I get the following message in VSCode, when creating HTML-Elements like <div> in .tsx files.

The JSX element implicitly contains the type "any" because there is no interface "JSX.IntrinsicElements".

Have a question?

I was searching on Google how to fix the Issue in VSCode, but I havn't found any working solution. ATM I downgraded to 0.0.20, since the Issue is resolved with it.

[yandeu]

Can you please try to add the following types?

declare namespace JSX {
  interface IntrinsicElements {
    [elemName: string]: any
  }
  interface ElementClass {
    render: any
  }
  interface ElementChildrenAttribute {
    children: any
  }
}

[jrson83]

Ok, I don't get it. If I install 0.0.21 and check node_modules/nano-jsx/typings/global.d.ts I can see:

declare namespace JSX {
  interface IntrinsicElements {
    [elemName: string]: any
  }
  interface ElementClass {
    render: any
  }
  interface ElementChildrenAttribute {
    children: any
  }
}

I also tried adding it to app/typings/modules.d.ts and created app/typings/global.d.ts, but when I open the modules file it says Duplicate index signature for type "string".. I installed typescript globally and in the bottom right status bar I tried selecting TypeScript and TypeScript React.

Somehow the <div /> still throws the same error.

My VSCode settings.json:

"[typescriptreact]": {
        "editor.defaultFormatter": "esbenp.prettier-vscode"
    },
    "files.associations": {
        "*.tsx": "typescript"
    }

[yandeu]

Please try v22 and this example

[jrson83]

The example is running fine. Thank you very much!

I also upgraded my current dist to 0.0.22. Did you make any changes to the image module?

Error: Cannot find module 'D:\_nano\new\node_modules\nano-jsx\lib\components\img'

But the files exists.

Also I'm getting warning when using:

const html = (body: any, head: string[] = [], footer: string[] = []) => { ...

TS2345: Argument of type 'HTMLElement[]' is not assignable to parameter of type 'string[]'.

When I change string to any, the error is fixed.

Also getting the error:

Error: Cannot find module 'D:\_nano\new\node_modules\nano-jsx\lib\core'

[yandeu]

Everything seems to work again in v23.

[jrson83]

Everything seems to work again in v23.

Thanks I will test later today and report.

[jrson83]

Thanks! It is working. I'll close the issue.