New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Wrong order of ES6 imports. How I can make the order manual? #9411

Open
akopchinskiy opened this Issue Jan 25, 2019 · 6 comments

Comments

Projects
None yet
3 participants
@akopchinskiy
Copy link

akopchinskiy commented Jan 25, 2019

Babel compiles imports in wrong order and this is causing errors and breaks the whole app. When I use manual load through html>head everything is working fine.
How can I make Babel compile the code in order that I defined?

@babel-bot

This comment has been minimized.

Copy link
Collaborator

babel-bot commented Jan 25, 2019

Hey @akopchinskiy! We really appreciate you taking the time to report an issue. The collaborators
on this project attempt to help as many people as possible, but we're a limited number of volunteers,
so it's possible this won't be addressed swiftly.

If you need any help, or just have general Babel or JavaScript questions, we have a vibrant Slack
community
that typically always has someone willing to help. You can sign-up here
for an invite.

@akopchinskiy akopchinskiy changed the title Wrong order of imports. How I can make the order manual? Wrong order of ES6 imports. How I can make the order manual? Jan 25, 2019

@nicolo-ribaudo

This comment has been minimized.

Copy link
Member

nicolo-ribaudo commented Jan 25, 2019

Can you provide an example of input code, your config and how Babel reorders the imports?

@akopchinskiy

This comment has been minimized.

Copy link
Author

akopchinskiy commented Feb 5, 2019

@nicolo-ribaudo

// module1.js
export const A = 1;

// module2.js
export const B = 2;

// module3.js
console.log(A, B);

// app.js
import './module1';
import './module2';
import './module3';

Babel output like that:

// bundle.js
console.log(A, B); // undefined, undefined
const A = 1;
const B = 2;

Simple as that.

@nicolo-ribaudo

This comment has been minimized.

Copy link
Member

nicolo-ribaudo commented Feb 5, 2019

Babel doesn't bundle files: it's a bug with your bundler (webpack or rollup maybe?).
Also, if you don't export those variable and import them in module3 you won't be able to log them.

@akopchinskiy

This comment has been minimized.

Copy link
Author

akopchinskiy commented Feb 6, 2019

@nicolo-ribaudo I presume you're wrong. Babel checks modules dependencies and sort them in a specific order for a bundler (webpack currently).
p.s. I just forgot to add export in the example, it was late evening, sry.

@nicolo-ribaudo

This comment has been minimized.

Copy link
Member

nicolo-ribaudo commented Feb 6, 2019

I presume you're wrong. Babel checks modules dependencies and sort them in a specific order for a bundler

No it doesn't. The bundler gives Babel a file, Babel gives back the output for that file. It doesn't even know that there are multiple files

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment