2 files appear after require.ensure is packaged through webpack
the asynchronous loading code is as follows:
index.js:
require.ensure(["../mall/order"],function(require){
var order = require("../mall/order");
});
require.ensure([],function(require){
var order = require("../mall/order");
});
order.js is nothing special. Synchronize also quotes some js
.
var CryptoJS = require("crypto-js/core");
require("crypto-js/aes");
require("crypto-js/mode-ecb");
require("crypto-js/pad-pkcs7");
require("crypto-js/enc-utf8");
require("crypto-js/enc-base64");
var CollectionInfo = require("./collectInfo");
require("./user");
require("./address");
var Order = {
...
}
module.exports = Order;
order.js packaged and broken down into 2 js, can not find the reason
< hr >
import has also tried to split order.js into two js:
.
import("../mall/order").then(function(order){
var order = order;
});
finally solved, the plug-in MinChunkSizePlugin can solve
new webpack.optimize.MinChunkSizePlugin({
minChunkSize: 102400
});
order.js is packaged into two files, and then the combined volume of the two files is given to minChunkSize (appropriately enlarged a bit), and it is fine.
means that when the volume is less than this value, the chunk will not be created.
which two files do you refer to specifically? If it's something like bundle.js and 0.bundle.js, this is normal. 0.bundle.js is the file that is separated from the main bundle.js and needs to be lazily loaded.
< hr >
updated
uh. According to your updated description, have you ever tried to add a chunkName parameter to each require.ensure, which is its last parameter, so that the bundle formed for the same lazy loading logic will be packaged into the same chunk? I guess order.js was generated twice because you didn't specify chunkName, so that webpack will treat each lazy loading logic as a different chunk.
in addition, the dependencies parameter (that is, the first parameter) does not make sense if it is the module itself, and if there are no dependent modules that must be executed, just leave it blank.
Finally, I don't know what version of webpack you are using. Require.ensure is officially recommended to be abandoned, and if possible, the new import () method is recommended.
above, my humble opinion, if there are any mistakes, I hope you will forgive me.
