I've been trying to debug an issue with the Bootstrap library. It extends jquery and it expects the var jQuery to be a global, but I get the error 'jQuery is not defined'. I've been trying to follow the Global Namespace example, but I think there is an issue.
The issue is not apparent in the example because the var name and the lib symbol name are the same, eg.
var globalModules = {
moment: "moment"
};
However, in my case, the library symbol is jquery, and the global var that Bootstrap expects is jQuery. It seems to me that the importRule is using the globalModules key/value opposite to the exposeRules.
When I make the following changes to common.webpack.config.js, I'm able to use Boostrap without the 'jQuery undefined' error.
If you can confirm this issue, it may be helpful to change the example to use different var name and library symbol name.
Also, there is another issue for my understanding. In the importMap above I use the key jqueryDNC in the InputMap. It seems that the name I use there doesn't matter. Based on all the docs I thought the key for the importMap would need to be the var name used by Bootstrap (ie. the global var name for jquery, ie. typically jQuery or $). However, that doesn't seem to be the case. My program works no matter what I name that key. Then I thought this might mean the importRule simply isn't needed because the exportRule creates the desired global variable name, but my program breaks if I omit the importRule. So it must be that the presence of the import rule has some other side effect. Can you provide any further insight on what is going on here?
I've been trying to debug an issue with the Bootstrap library. It extends jquery and it expects the var jQuery to be a global, but I get the error 'jQuery is not defined'. I've been trying to follow the Global Namespace example, but I think there is an issue.
The issue is not apparent in the example because the var name and the lib symbol name are the same, eg.
However, in my case, the library symbol is jquery, and the global var that Bootstrap expects is jQuery. It seems to me that the importRule is using the globalModules key/value opposite to the exposeRules.
When I make the following changes to common.webpack.config.js, I'm able to use Boostrap without the 'jQuery undefined' error.
If you can confirm this issue, it may be helpful to change the example to use different var name and library symbol name.
Also, there is another issue for my understanding. In the importMap above I use the key jqueryDNC in the InputMap. It seems that the name I use there doesn't matter. Based on all the docs I thought the key for the importMap would need to be the var name used by Bootstrap (ie. the global var name for jquery, ie. typically jQuery or $). However, that doesn't seem to be the case. My program works no matter what I name that key. Then I thought this might mean the importRule simply isn't needed because the exportRule creates the desired global variable name, but my program breaks if I omit the importRule. So it must be that the presence of the import rule has some other side effect. Can you provide any further insight on what is going on here?