Named exports get imported using a default import (which doesn't work) #215

nachoaIvarez · 2017-01-21T19:07:41Z

Take a look at this scenario

// a.js
exports.x = 'x';
exports.y = 'y';

// b.js
var a = require('./a.js');

console.log(a.x);
console.log(a.y);

// > x
// > y

✅ Works

Gets transpiled to:

// a.js
export var x = 'x';
export var y = 'y';

// b.js
import a from './a';

console.log(a.x);
console.log(a.y);

// > export 'default' (imported as 'a') was not found in './a'

❌ Nope.

In order to solve this you need a manual change, so:

// b.js
import { x, y } from './a';

console.log(x);
console.log(y);

// > x
// > y

✅ There we go. But again, this is a manual change.

Once I solved all those kind of issues, all the rest of safe transforms worked like a charm 👍.

I know, in order to figure out this kind of scenarios, lebab should do a lot of extra heavy lifting and run checks of usage across files. This issue is not a feature request. Just pointing out that commonjs is not that safe, specially when using it through --replace. Thoughts?

The text was updated successfully, but these errors were encountered:

nene · 2017-01-21T20:38:59Z

Yeah, I agree.

I wrote the transform originally when I was just starting out using ES6 modules and I didn't really understand some of the crucial differences. Haven't really touched it much since.

So yeah, I agree it deserves to be moved into unsafe category.

Refs #215

nene · 2017-01-21T20:51:15Z

Done.

Digging into this I realized there are several other issues with commonjs transform that should have categorized it as unsafe.

alexewerlof · 2018-01-15T13:59:47Z

@nene thank you for Lebab.

I hit this wall too soon. What if

// a.js
exports.x = 'x';
exports.y = 'y';

gets transferred to:

export var __lebabModuleExports = {};
export __lebabModuleExports.x = 'x';
export __lebabModuleExports.y = 'y';

nene · 2018-01-15T15:36:35Z

While that would be doable, it results in code that has an obviously auto-generated look. But the goal of Lebab is to produce human-readable ES6 code.

I think the better fix for this is actually on the import side. Instead of doing:

import a from './a';

You would simply need to:

import * as a from './a';

The tricky bit is for Lebab to decide which form of import it should use. Lebab would need to know whether the imported file uses default export or named exports. Currently though there are technical limitations to be overcome for implementing this as the commonjs transform only "sees" one file at a time.

nene added a commit that referenced this issue Jan 21, 2017

Categorize commonjs transform as unsafe

73d80ef

Refs #215

nene added a commit that referenced this issue Jan 21, 2017

Also reorder commonjs in CLI help output

17f7eab

Refs #215

nene closed this as completed Jan 21, 2017

nene changed the title ~~Is the commonjs transform actually safe?~~ Named exports get imported using a default import (which doesn't work) Jan 15, 2018

nene reopened this Jan 15, 2018

nene added the bug label Sep 10, 2018

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

Named exports get imported using a default import (which doesn't work) #215

Named exports get imported using a default import (which doesn't work) #215

nachoaIvarez commented Jan 21, 2017 •

edited

Loading

nene commented Jan 21, 2017

nene commented Jan 21, 2017

alexewerlof commented Jan 15, 2018

nene commented Jan 15, 2018

Named exports get imported using a default import (which doesn't work) #215

Named exports get imported using a default import (which doesn't work) #215

Comments

nachoaIvarez commented Jan 21, 2017 • edited Loading

nene commented Jan 21, 2017

nene commented Jan 21, 2017

alexewerlof commented Jan 15, 2018

nene commented Jan 15, 2018

nachoaIvarez commented Jan 21, 2017 •

edited

Loading