Trouble importing from inferno-create-element in a TypeScript project

[jrf0110]

Observed Behaviour

When attempting to import from inferno-create-element, I get the following error:

import createElement from 'inferno-create-element'

Module ''inferno-create-element'' has no default export.

I dug into inferno's generated definitions file and saw this:

declare module 'inferno-create-element' {
	function createElement(component: any, props: any, ...children): any
	export = createElement;
}

Expected Current Behaviour

I would think that the .d.ts file would look like this:

declare module 'inferno-create-element' {
	export default function createElement(component: any, props: any, ...children): any
}

And indeed, changing inferno's definition file to the above seems to fix the problem.

Any thoughts on that? I'm not exactly sure if that's a bug or maybe a user error

[trueadm]

CCing @LukeSheard @nightwolfz @Schnueggel

@jrf0110 if this fixes your issue, I'm totally down with a PR to apply this fix and any others you might have. Thank you for raising this issue – I hope to do a release a bit later, so this might get in too :)

[trueadm]

@jrf0110 I've released beta24 on NPM, please let me know if that fixes your issues.

[dchest]

Hm, while typings were changed to export default, modules themselves don't actually export default:

module.exports = require('inferno/dist/inferno-create-element');

This causes mismatch between modules and typings, so it will compile but throw runtime error (I tried with TypeScript's compiler option "module": "commonjs"), because the import gets compiled into something like require('inferno-create-element').default.

The correct import for what currently module exports is

import * as createElement from 'inferno-create-element'

[trueadm]

@dchest this is more of an annoying feature/bug of TypeScript and how it deals with NPM modules. The initial require is requiring a module with default. If you have any ideas how to fix, please do raise a PR or let me know. These things are a right PITA to get perfectly right on a UMD package.

[Lodin]

@trueadm it might not be a bug at all. According to an opinion on the same problem with react import, importing npm module as default is a Babel behavior, and it is not described in the specification.

So, in my opinion, this behavior should not be treated as a bug, and we can just use code suggested by @dchest as far as it is a common approach in Typescript.

[dchest]

I think @Lodin is correct — module.exports are not equivalent to default, but I don't mind one way or the other (the default way looks cleaner though), just pointing out the the current typings in beta24 unfortunately don't work.

[trueadm]

I'm closing this for the other issue, that covers this and more. #521

[jrf0110]

Hey @trueadm I appreciate you guys deliberating and coming up with a solution here. I basically turned off programming projects this weekend, so I'll let y'all know early this week how everything goes.

[mritzco]

Found the same problem using a library leaving this here just for reference:
Original code:

import  createElement from 'inferno-create-element';

Tried one of the fixes in here

import * as createElement from 'inferno-create-element'

Checked the inferno-create-element repo and just replaced for their recommendation
This one works:

import  {createElement} from 'inferno-create-element';

Hope it helps someone else