Error while const or let in js file being merged

[Demiurg-ls]

Hi,

A bug has hit me while I was trying to process webpack task. After adding a new file to a list of meged *.js an error has appeared:

webpack --mode=production --optimize-minimize
buffer.js:207
    throw new ERR_INVALID_ARG_TYPE(
    ^
TypeError [ERR_INVALID_ARG_TYPE]: The first argument must be one of type string, Buffer, ArrayBuffer, Array, or Array-like Object. Received type undefined
    at Function.from (buffer.js:207:11)
    at writeOut (C:\_DATA\Projects\Inne\DopokiStarczyTchu.pl\DopokiStarczyTchu.pl\DopokiStarczyTchu.pl\node_modules\webpack\lib\Compiler.js:410:26)
    at asyncLib.forEachLimit (C:\_DATA\Projects\Inne\DopokiStarczyTchu.pl\DopokiStarczyTchu.pl\DopokiStarczyTchu.pl\node_modules\webpack\lib\Compiler.js:426:7)
    at objectIteratorWithKey (C:\_DATA\Projects\Inne\DopokiStarczyTchu.pl\DopokiStarczyTchu.pl\DopokiStarczyTchu.pl\node_modules\neo-async\async.js:3508:9)
    at done (C:\_DATA\Projects\Inne\DopokiStarczyTchu.pl\DopokiStarczyTchu.pl\DopokiStarczyTchu.pl\node_modules\neo-async\async.js:3526:9)
    at C:\_DATA\Projects\Inne\DopokiStarczyTchu.pl\DopokiStarczyTchu.pl\DopokiStarczyTchu.pl\node_modules\graceful-fs\graceful-fs.js:45:10
    at FSReqWrap.oncomplete (fs.js:145:20)

The reason was using "let" and "const" in added "lazyload.2.x.js". After I has changed all instances to "var" the file has been merged successfully. The fragment of my webpack config file:

plugins: [
        ...,
    new MergeIntoSingleFilePlugin({
        files: [
            {
                src: [
                    path.join(__dirname, './wwwroot/assets/_src/js/scripts.js'),
                    path.join(__dirname, './wwwroot/assets/_src/js/dst.scripts.js')
                ],
                dest: code => {
                    const min = require("uglify-js").minify(
                        code, {
                            sourceMap: { filename: 'site.bundle.min.js', url: 'site.bundle.min.js.map' }
                        });
                    return { 'site.bundle.js': code, 'site.bundle.min.js': min.code, 'site.bundle.min.js.map': min.map }
                }
            },
            {
                src: [
                                        ...,
                    **path.join(__dirname, './wwwroot/assets/plugins/lazyload/lazyload.2.x.js'),**
                                        ...
                ],
                dest: code => {
                    const min = require("uglify-js").minify(
                        code, {
                            sourceMap: { filename: 'vendors.bundle.min.js', url: 'vendors.bundle.min.js.map' }
                        });
                    return { 'vendors.bundle.js': code, 'vendors.bundle.min.js': min.code, 'vendors.bundle.min.js.map': min.map }
                }
            }
        ]
    })
],

Best regards
Demiurg-ls

[markshapiro]

@Demiurg-ls it it seems to be the js minifier problem maybe? the minifier seems to return undefined and passes it as content of file, my library merges the files in the order in the list as is, without wrapping them in new scope as opposed to using loaders, and this may cause conflicting variables issue which may be solved with const/let in this case, maybe you could try merging the files with conflicting variables into different final js files or seeing exactly what error does the minifer throw

[kakarlus]

i have the same problem, it's because of the uglify-js.

i used Terser js inside the transform like below:

transform: {
    'assets/js/plugins.js': code => Terser.minify(code).code
}

const remained as const but still got minified xD