Nuxt.js: Internet Explorer 11 issue - Object.assign polyfill gets resetted

[simllll]

Hi all,
has anyone else expierneced the following weird issue with iexplorer 11? I always run into "Object.assign" is not a function errors.. even though it actually is polyfilled. At least during the beginning, somehow (magically?) it gets resetted to undefined after the final page load.
So if i output "Object.assign" during page load, it has a function in it, but if I try it to use it later one (by anothr functino or just by typing it in the console) it tells me that object.assign is not defined anymore.

I get errors like:

Das Objekt unterstützt die Eigenschaft oder Methode "assign" nicht
./node_modules/vue-js-modal/dist/ssr.index.js in t.default.methods.genEventObject at line 469:0
./node_modules/vue/dist/vue.runtime.esm.js in n at line 185:0

I polyfilled it with my own class, with predefined polyfillers and so on.. no change. I even tried to "re-polyfill" it after a while and after the final page load.. but without success. I will appriciate any clue or hint from this awesome nuxt community!!
Thanks guys

_{This question is available on Nuxt.js community (#c1981)}

[jake-a-wood]

Looks like you managed to work around it by following your suggestion here.

It was a bit confusing so I'll restate it here:

build: {
    vendor: ['babel-polyfill'],
    babel: {
        presets: [
            ['vue-app', {
                useBuiltIns: true,
                targets: { ie: 11, uglify: true },
            },
            ],
        ],
    },
},

Using this configuration adjustment, I was able to run my nuxt app in IE11.

[simllll]

Yep, my current Babel config is following

babel: {
            presets({isServer}) {
                return [
                    [
                        'vue-app',
                        {
                            // useBuiltIns: true,
                            targets: isServer ? { node: 'current' } : {ie: 11, uglify: true}
                        }]
                ];
            }
        },

And I only include the polyfills I need with a plug-in which is included with ssr: false.

 plugins: [
        { src: '~plugins/polyfill.js', ssr: false },
...]

Simon

[jake-a-wood]

Thanks for figuring this out! Saved me a lot of time.

[usb248]

Doesn't work on last version of nuxt 1.4.0.

  build: {
    vendor: ['babel-polyfill','eventsource-polyfill'],
    babel: {
      presets({isServer}) {
        return [
          ['vue-app',
            {
              useBuiltIns: true,
              targets: isServer ? { node: 'current' } : {ie: 11, uglify: true}
            }
          ]
        ];
      },
      plugins: [
        ["transform-imports", {
          "vuetify": {
            "transform": "vuetify/es5/components/${member}",
            "preventFullImport": true
          }
        }]
      ]
    },
    extractCSS: {
      allChunks: true
    },
    extend(config, ctx) {
      if (ctx.isServer) {
        config.externals = [
          nodeExternals({
            whitelist: [/^vuetify/]
          })
        ]
      }
    }
  },

Still error in IE11 ....

[krestaino]

@usb248 Try this.

build: {
    ...

    extend(config, ctx) {
      ...

      if (ctx.isClient) {
        config.entry.vendor.push('babel-polyfill')
      }

[lock[bot]]

This thread has been automatically locked since there has not been any recent activity after it was closed. Please open a new issue for related bugs.