Object is not a function error using v7.13.x

[tianleiwufeng]

Bug Report

Current behavior

my package.json using babel v6,while some package like react-redux using babel ^7.1.1.
babel v6 comile v7.13.x to image above,i think thatis the question

- Babel version(s): [package.json v6 ,error package v7.13.x]
- Node/npm version: [v12]
- OS: [macos]
- How you are using Babel: [`webpack`]

[babel-bot]

Hey @tianleiwufeng! We really appreciate you taking the time to report an issue. The collaborators on this project attempt to help as many people as possible, but we're a limited number of volunteers, so it's possible this won't be addressed swiftly.

If you need any help, or just have general Babel or JavaScript questions, we have a vibrant Slack community that typically always has someone willing to help. You can sign-up here for an invite."

[nicolo-ribaudo]

Which webpack version are you using?

[tianleiwufeng]

Which webpack version are you using?

4 latest

[nicolo-ribaudo]

Can you share your webpack config? I added a test for webpack 4 at #12883 and it passes 🤔

[LeventLei]

I have the same problem

[nicolo-ribaudo]

Can you share your webpack config?

[LeventLei]

Can you share your webpack config?

[nicolo-ribaudo]

Are you using https://github.com/mkatrenik/webpackrc?

[LeventLei]

@nicolo-ribaudo I used https://github.com/sorrycc/roadhog for my project, this project worked very well since yesterday morning, when I remove all my node_modules , this problem came out

[tianleiwufeng]

thanks ,i solved this problem by adding mjs in webpack confg.
{
exclude: [ /.(js|jsx|mjs|html|json)$/],
loader: 'file-loader',
options: {
name: config.mediaChunkFileName,
},
}

why not use .js

[nicolo-ribaudo]

why not use .js

Because:

1. It has a different meaning in Node.js
2. mjs supported by default in every bundler

The only problem is when you configure webpack to handle mjs files with a different loader (file-loader in your case).

[LeventLei]

I still can't solve my problem, what else can I apply for your help @nicolo-ribaudo

[LeventLei]

Other projects we used https://github.com/dvajs/dva dva for the cli tool , also have the same problem when runing or buided

[nicolo-ribaudo]

I'll check later, if you could create a repository that shows the issue it will help a lot finding the problem 🙏

[LeventLei]

object-not-defined.zip
this is my project simple,thanks @nicolo-ribaudo

[nicolo-ribaudo]

@LeventLei Thanks 👍

EDIT: Using Yarn instead of npm I can get past these errors and I successfully reproduce the problem.

What command should I run after npm install? I tried npm run build, npm run start and npm run umi but they all throw different errors:

dev/babel-bugs/object-not-defined via ⬢ v15.10.0 
➜ npm run build

> build
> cross-env APP_ENV=pro --max_old_space_size=8192 roadhog build

Build failed: Cannot read property 'compilation' of undefined
TypeError: Cannot read property 'compilation' of undefined
    at ProgressPlugin.apply (/home/nicolo/Documenti/dev/babel-bugs/object-not-defined/node_modules/webpack/lib/ProgressPlugin.js:193:19)
    at Compiler.apply (/home/nicolo/Documenti/dev/babel-bugs/object-not-defined/node_modules/af-webpack/node_modules/webpack/node_modules/tapable/lib/Tapable.js:375:16)
    at webpack (/home/nicolo/Documenti/dev/babel-bugs/object-not-defined/node_modules/af-webpack/node_modules/webpack/lib/webpack.js:33:19)
    at buildWebpack (/home/nicolo/Documenti/dev/babel-bugs/object-not-defined/node_modules/af-webpack/lib/build.js:100:41)
    at build (/home/nicolo/Documenti/dev/babel-bugs/object-not-defined/node_modules/af-webpack/lib/build.js:117:3)
    at /home/nicolo/Documenti/dev/babel-bugs/object-not-defined/node_modules/roadhog/lib/build.js:77:24
    at new Promise (<anonymous>)
    at Object._default [as default] (/home/nicolo/Documenti/dev/babel-bugs/object-not-defined/node_modules/roadhog/lib/build.js:46:10)
    at Object.<anonymous> (/home/nicolo/Documenti/dev/babel-bugs/object-not-defined/node_modules/roadhog/lib/scripts/build.js:22:28)
    at Module._compile (node:internal/modules/cjs/loader:1091:14)
    at Object.Module._extensions..js (node:internal/modules/cjs/loader:1120:10)
    at Module.load (node:internal/modules/cjs/loader:971:32)
    at Function.Module._load (node:internal/modules/cjs/loader:812:14)
    at Function.executeUserEntryPoint [as runMain] (node:internal/modules/run_main:76:12)
    at node:internal/main/run_main_module:17:47

dev/babel-bugs/object-not-defined via ⬢ v15.10.0 took 2s 
➜ npm run start

> start
> cross-env roadhog server

Failed to compile.

TypeError: Cannot read property 'compilation' of undefined
    at ProgressPlugin.apply (/home/nicolo/Documenti/dev/babel-bugs/object-not-defined/node_modules/webpack/lib/ProgressPlugin.js:193:19)
    at Compiler.apply (/home/nicolo/Documenti/dev/babel-bugs/object-not-defined/node_modules/af-webpack/node_modules/webpack/node_modules/tapable/lib/Tapable.js:375:16)
    at webpack (/home/nicolo/Documenti/dev/babel-bugs/object-not-defined/node_modules/af-webpack/node_modules/webpack/lib/webpack.js:33:19)
    at createCompiler (/home/nicolo/Documenti/dev/babel-bugs/object-not-defined/node_modules/af-webpack/lib/WebpackDevServerUtils.js:108:16)
    at /home/nicolo/Documenti/dev/babel-bugs/object-not-defined/node_modules/af-webpack/lib/dev.js:65:64
    at processTicksAndRejections (node:internal/process/task_queues:94:5)


dev/babel-bugs/object-not-defined via ⬢ v15.10.0 took 2s 
➜ npm run umi

> umi
> umi-lib build

ℹ  info      Clean dist directory
ℹ  info      Build umd
✖  error     Error: Could not resolve entry (/home/nicolo/Documenti/dev/babel-bugs/object-not-defined/src/main.js) 
    at error (/home/nicolo/Documenti/dev/babel-bugs/object-not-defined/node_modules/rollup/dist/rollup.js:3601:30)
    at /home/nicolo/Documenti/dev/babel-bugs/object-not-defined/node_modules/rollup/dist/rollup.js:17949:17
    at async Promise.all (index 0)
npm ERR! code 1
npm ERR! path /home/nicolo/Documenti/dev/babel-bugs/object-not-defined
npm ERR! command failed
npm ERR! command sh -c umi-lib build

npm ERR! A complete log of this run can be found in:
npm ERR!     /home/nicolo/.npm/_logs/2021-02-24T13_48_12_575Z-debug.log

PS: It's not the cause of the bug, but the first thing I noticed is that two of your dependencies (react-scripts and roadhog) have @babel/core as a peerDependency, so you need to add @babel/core to your devDependencies so that they can correctly find it (even if they currently find it, any change in your node_modules layout could break react-scripts or roadhog by making @babel/core "disappear").

[nicolo-ribaudo]

@LeventLei This is a bug in af-webpack (a dependency of roadhog): it tells webpack "If an extension is not one of html|ejs|json|js|jsx|ts|tsx|css|less|scss|sass, load it as a string URL instead of executing it". Webpack's default behavior would be to load .mjs files as JavaScript, but af-webpack prevents it from doing so.

As a workaround, you can add urlLoaderExcludes: [/\.mjs$/, /\.cjs$/], to your .webpackrc.js config (I also added .cjs because it's another JS extension that af-webpack doesn't handle correctly, even if it's not related to the current error), but I strongly suggest reporting this bug to af-webpack so that they can fix it.

[beiifeng]

@LeventLei This is a bug in af-webpack (a dependency of roadhog): it tells webpack "If an extension is not one of html|ejs|json|js|jsx|ts|tsx|css|less|scss|sass, load it as a string URL instead of executing it". Webpack's default behavior would be to load .mjs files as JavaScript, but af-webpack prevents it from doing so.

As a workaround, you can add urlLoaderExcludes: [/\.mjs$/, /\.cjs$/], to your .webpackrc.js config (I also added .cjs because it's another JS extension that af-webpack doesn't handle correctly, even if it's not related to the current error), but I strongly suggest reporting this bug to af-webpack so that they can fix it.

I don't find config urlLoaderExcludes before. Not in roadhog's README , no af-webpack repository. Now, I find it in af-webpack's code.
Thank you.

[nicolo-ribaudo]

I found it directly in the af-webpack source code 😄

[LeventLei]

@nicolo-ribaudo It really works for me , much appreciated