Webpack从模块中提取依赖于外部作用域的功能

Question

I notice this bug sometimes when there is very little code inside a function of a module:

// module A
import data from "data.json";

export function getSomeData() {
    return data;
}

// module B
impoort { getSomeData } from "moduleA";

alert(getSomeData());

Then the error is something along the lines of

TypeError: data_json__WEBPACK_IMPORTED_MODULE_1__ is undefined

I notice at the top of module B there are some binding exports (whatever that is)

/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "getSomeData", function() { return getSomeData; });

And this is making me think that whenever possible, in order to optimize things, webpack is bundling it so that only this function gets executed but it misses that it's dependent on data from the module itself. How can I prevent this from happening (other than writing better code, duh)?

Answer 1

I'm posting this for any lost souls in the future.

I found the reason it was that I was including module B in module A as well and this appears to be a very smart way webpack handles recursive includes (where node would return an empty object). Sadly for people without the proper knowledge like myself this could be pretty frustrating and time consuming to debug.

Hope it helps someone.