Uncaught TypeError: isObject is not a function (with useBuiltIns: usage)

See original GitHub issue

I’m building my TypeScript project using Webpack and Babel with @babel/preset-env:

{
  module : {
    rules : [{
      test : /\.(js|ts)$/,
      loader : "babel-loader",
      options : {
        babelrc : false,
        cacheDirectory : false,
        sourceType : "unambiguous",
        presets : [
          "@babel/preset-typescript",
          ["@babel/preset-env", {
            modules : false,
            useBuiltIns : "usage",
            corejs : {
              version : "3.6.2",
              proposals : true
            }
          }]
        ],
        plugins : [
          ["@babel/plugin-proposal-class-properties", { loose: true }]
        ]
      }
    }
}

At runtime (with my Chrome browser) I get the following error:

Uncaught TypeError: isObject is not a function

document-create-element.js:7 Uncaught TypeError: isObject is not a function
    at eval (document-create-element.js:7)
    at Object../node_modules/core-js/internals/document-create-element.js (main.js:4057)
    at __webpack_require__ (main.js:70)
    at eval (ie8-dom-define.js:7)
    at Object../node_modules/core-js/internals/ie8-dom-define.js (main.js:4303)
    at __webpack_require__ (main.js:70)
    at eval (object-define-property.js:5)
    at Object../node_modules/core-js/internals/object-define-property.js (main.js:4669)
    at __webpack_require__ (main.js:70)
    at eval (es.object.define-property.js:5)

With the exact same configuration switching from useBuiltIns : "usage" to "entry" everything works perfectly 🤔

I tried multiple versions of core-js v3.6.2, v3.6.0, v3.5.0 and v3.4.8 resulting with the same error. But with core-js v3.6.1 I get a different runtime error:

Uncaught TypeError: $ is not a function

es.array.index-of.js:16 Uncaught TypeError: $ is not a function
    at eval (es.array.index-of.js:16)
    at Object../node_modules/core-js/modules/es.array.index-of.js (main.js:5560)
    at __webpack_require__ (main.js:70)
    at eval (regexp-exec.js:3)
    at Object../node_modules/core-js/internals/regexp-exec.js (main.js:4926)
    at __webpack_require__ (main.js:70)
    at eval (es.regexp.exec.js:7)
    at Object../node_modules/core-js/modules/es.regexp.exec.js (main.js:6729)
    at __webpack_require__ (main.js:70)
    at eval (indexed-object.js:1)

Issue Analytics

  • State:closed
  • Created 4 years ago
  • Reactions:13
  • Comments:15 (4 by maintainers)

github_iconTop GitHub Comments

12reactions
yvelecommented, Apr 2, 2020

@kaline For more details about this solution, see https://stackoverflow.com/a/59647913/1480391

They should be excluded from babel-loader in your Webpack config

{
  module : {
    rules : [{
      test : /\.js$/,
+      exclude : [
+        /\bcore-js\b/,
+        /\bwebpack\/buildin\b/
+      ],
      loader : "babel-loader",
      options: { ... }
   }]
}
9reactions
mattwelkecommented, May 27, 2020

Got it to work!

My most recent issue was after I excluded enough from the Babel transform, the polyfills seemed to work, but then I wasn’t getting some of my dependencies bundled in correctly. It kept the CommonJS export syntax. This is because I was a doing a thorough test, including the package async (which uses ES6+ code, that I needed to be transpiled) and also a few of my own test dependencies, which I published to NPM after including a few ES6 features in each. I used CommonJS syntax to export from them, not realizing that out of the box, Babel can’t handle that.

I found that I had to add the line sourceType: 'unambiguous' to my Babel config to get it to recognize the CommonJS modules and include them in the bundle properly. I found this by digging deep into the “Misc” section of Babel’s docs.

So for anyone struggling with this again, know that the solution (today, at least), is to have a wide exclude to protect the core-js polyfill and the build tools from transpilation, and to include the line sourceType: 'unambiguous' if you have a mix of ES modules and CommonJS modules that you want to include in your bundle.

Read more comments on GitHub >

github_iconTop Results From Across the Web

How to exclude core-js using useBuiltIns: "usage"
You need to exclude both core-js and webpack/buildin from the Babel transpilation. You can use the folling exclude Regexes:
Read more >
Debian Bug report logs - #954993 core-js and webpack is not ...
Subject: core-js and webpack is not working well together (breaks ... clone button drop down etc) TypeError: isObject is not a function ......
Read more >
[Solved]-.flat is not a function only with jest-babel.js
Edit: Using it in a create-react-app project that is not ejected, so I don't access webpack files and I don't have a custom...
Read more >
从Babel7 编译node_modules 报错说起 - HK Talk
Uncaught TypeError : $ is not a function ... Uncaught TypeError: isObject is not a function (with useBuiltIns: usage) ...
Read more >
babel/preset-env - Babel 中文文档
This behavior is deprecated because it isn't possible to use @babel/polyfill with different core-js versions. useBuiltIns: 'usage'. Adds specific imports for ...
Read more >

github_iconTop Related Medium Post

No results found

github_iconTop Related StackOverflow Question

No results found

github_iconTroubleshoot Live Code

Lightrun enables developers to add logs, metrics and snapshots to live code - no restarts or redeploys required.
Start Free

github_iconTop Related Reddit Thread

No results found

github_iconTop Related Hackernoon Post

No results found

github_iconTop Related Tweet

No results found

github_iconTop Related Dev.to Post

No results found

github_iconTop Related Hashnode Post

No results found