CODEWITHSUNDEEP
javascriptwebpackbabeljspolyfillscore-js
Mykhailo Kuzmich
Mykhailo Kuzmich

Reputation: 11

ProvidePlugin Object method polyfill issue

I have webpack + babel setup.

module: {
  rules: [
    {
      test: /\.(js|jsx)?$/,
      use: {
        loader: 'babel-loader',
        options: babelOptions
      }
    }
  ]
}

And also, I am using ProvidePlugin to polyfill Object. However, I want to be able to write custom logic for it, for example, polyfill methods only is they are custom or missing on the page where script will be run (pages could be random, as they are customer's)

new webpack.ProvidePlugin({
  Object: path.resolve(__dirname, './src/polyfills/object.js'),
})

// content of polyfills/object.js
const { default: isNative } = require('../utils/isNative');

let polyfilledObject = Object;

if (!polyfilledObject || !isNative(polyfilledObject)) {
    polyfilledObject = require('core-js/library/fn/object');
}

if (!polyfilledObject.getOwnPropertyDescriptors || !isNative(polyfilledObject.assign)) {
    polyfilledObject.getOwnPropertyDescriptors = require('core-js/library/fn/object/get-own-property-descriptors');
}

module.exports = polyfilledObject;

The issue I am facing is Error: _iobject.js:4 Uncaught TypeError: Object is not a function from core-js file.

However, if I change "Object" to for example "ObjectPoly" inside ProvidePlugin, it works fine, and calling ObjectPoly inside of my project results in Object with polyfilled methods (if they are missing or custom).

P.S. I've set an debugger at _iobject.js:4, logging Object results in "native code" when I am using ObjectPolly in ProvidePlugin. While logs only {} when using Object in ProvidePlugin. So seems like native Object is getting rewritten by either babel or webpack

Upvotes: 1

Views: 47

Answers (0)

Related Questions