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

strang behavior with es6 re-export syntax. defect? #6795

Closed
bochen2014 opened this Issue Nov 11, 2017 · 4 comments

Comments

Projects
None yet
3 participants
@bochen2014

bochen2014 commented Nov 11, 2017

I ran into a very strange issue today. here is my code

// index.js
export * from './actions'; // can only be put in the front
export { default as QuizListContainer } from './containers/quizListContainer';
export { default as QuizListReducer } from './reducers';
// if you put it at the bottom, it won't work
// export * from './actions';

this also works

import  QuizListContainer  from './containers/quizListContainer';
import QuizListReducer  from './reducers';
export {
    QuizListContainer,
    QuizListReducer
}
export * from './actions';

but they should all be the same. Is this a known issue?

$ yarn list babel-core babel-loader babel-preset-es2015 babel-preset-react
yarn list v1.0.2
warning package.json: No license field
warning server@1.0.0: No license field
├─ babel-core@6.26.0
├─ babel-loader@7.1.2
├─ babel-preset-es2015@6.24.1
├─ babel-preset-react@6.24.1
Done in 1.35s.
@babel-bot

This comment has been minimized.

Show comment
Hide comment
@babel-bot

babel-bot Nov 11, 2017

Collaborator

Hey @bochen2014! 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.

Collaborator

babel-bot commented Nov 11, 2017

Hey @bochen2014! 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.

@bochen2014

This comment has been minimized.

Show comment
Hide comment
@bochen2014

bochen2014 Nov 11, 2017

i had a quick look at the transpiled code for export * from './actions'

var _actions = require('./actions');
Object.keys(_actions).forEach(function (key) {
  if (key === "default" || key === "__esModule") return;
  Object.defineProperty(exports, key, {
    enumerable: true,
    get: function get() {
      return _actions[key];
    }
  });
});

it seems all right to me. I couldn't think of a reason why putting in at the top or at the bottom would make a difference. any clue??

bochen2014 commented Nov 11, 2017

i had a quick look at the transpiled code for export * from './actions'

var _actions = require('./actions');
Object.keys(_actions).forEach(function (key) {
  if (key === "default" || key === "__esModule") return;
  Object.defineProperty(exports, key, {
    enumerable: true,
    get: function get() {
      return _actions[key];
    }
  });
});

it seems all right to me. I couldn't think of a reason why putting in at the top or at the bottom would make a difference. any clue??

@bochen2014

This comment has been minimized.

Show comment
Hide comment
@bochen2014

bochen2014 Nov 11, 2017

I figured it out. It was because I imported index.js from a module that was re-exported by index.js.

├── folder
│   ├── index.js
│   └── actions.js
│   └── component.js
│   
|

index.js

export {default as Component} from './component'
export * from './actions';

actions.js

export const action1= 'action1';

component.js

import React from 'react';
import { action1} from './index'
console.log(` action1= ${action1}  ==> returns undefined`)
export default ()=><h1>component</h1>

as I said before, if I swap the order of the exports in index.js, or use a different syntax, it will be working fine. I'm not sure if this is an issue or not

https://github.com/bochen2014/babel-6759

bochen2014 commented Nov 11, 2017

I figured it out. It was because I imported index.js from a module that was re-exported by index.js.

├── folder
│   ├── index.js
│   └── actions.js
│   └── component.js
│   
|

index.js

export {default as Component} from './component'
export * from './actions';

actions.js

export const action1= 'action1';

component.js

import React from 'react';
import { action1} from './index'
console.log(` action1= ${action1}  ==> returns undefined`)
export default ()=><h1>component</h1>

as I said before, if I swap the order of the exports in index.js, or use a different syntax, it will be working fine. I'm not sure if this is an issue or not

https://github.com/bochen2014/babel-6759

@bochen2014 bochen2014 closed this Nov 11, 2017

@bochen2014 bochen2014 reopened this Nov 11, 2017

@loganfsmyth

This comment has been minimized.

Show comment
Hide comment
@loganfsmyth

loganfsmyth Mar 5, 2018

Member

This is most likely fixed by the module transform rewrite in 7.x

Member

loganfsmyth commented Mar 5, 2018

This is most likely fixed by the module transform rewrite in 7.x

@loganfsmyth loganfsmyth closed this Mar 5, 2018

@lock lock bot added the outdated label Jun 4, 2018

@lock lock bot locked as resolved and limited conversation to collaborators Jun 4, 2018

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