I am trying to enable support for IE 11 using babel polyfills. However, after running npm run prod, the file generated produces the following error in the browser:

Uncaught ReferenceError: require is not defined

This is the very beginning of the app.es5.js, hence the require:

"use strict";var _regenerator=_interopRequireDefault(require("@babel/runtime/regenerator"));

Looking a this stackoverflow anser, my webpack.mix.js seems pretty accurate. This is my webpack.mix.js:

mix.js('resources/js/app.js', 'public/js')
    .extract()
    .babel(['public/js/app.js', 'public/js/vendor.js'], 'public/js/app.es5.js')
    .sass('resources/sass/app.scss', 'public/css')
    .sass('resources/sass/pdf.scss', 'public/css')
    .version();

Here is my .babelrc:

{
  "presets": [
    [
      "@babel/preset-env", {
      "targets": {
        "browsers": ["IE 11, last 2 versions"]
      }
    }
    ]
  ]
}

Why am I receiving this error?

1 Answers

0
Fredrik On Best Solutions

Turns out it was CKEditor that was causing this. Commenting out this line: import ClassicEditor from "@ckeditor/ckeditor5-build-classic"; solved it.

You can read more about the CKEditor build process here.