I've been modernizing some old gulp config where js files are concatenated and then minified by migrating to webpack.

Some of bundles contained libraries such as moment.js and isotope-docs.min.js, When bundling with webpack I would get error that specific file or path is not found.

For example looking at moment.js There is require("./locale/" t) which causes my webpack to fail since i dont have locale directory.

Why would bundled js file have require function when browsers dont understand that?

CodePudding user response：

Before ES modules became a thing, JavaScript did not have an official module syntax. Also, developers wanted to write a library once for both Node.js and the browser. The closest thing available was Node.js's require(), which does not exist on the browser.

So what tools like Browserify and Rollup would do is polyfill an implementation of require() (e.g. wrap the code in a "UMD"). This way, the module worked on any plaform and require() calls work as if in Node.js (its implementation may vary and can be extended because dealing with the filesystem is very different from dealing with a network).

CodePudding user response：

Found a fix, you can just add to webpack confing under module noParse e.g

webpack.config.js

module: { 
 rules: [ ... ]
 noParse: /moment.min.js|isotope-docs.min.js/
}