Show blank page on IE11 when add firebase to Vue Project

Question

• My Vue project used Firebase Auth for sign in and sign up but when added firebase package to project, it show blank page on ie11. Firebase and Vue Cli Plugin Babel package:

"firebase": "9.6.1",
"@vue/cli-plugin-babel": "4.4.4"

• Babel config:

module.exports = {
    presets: [['@vue/app', { useBuiltIns: 'entry' }]]
}

Thanks

Answer 1

I read Firebase docs in here: https://firebase.google.com/docs/web/environments-js-sdk#suggested-polyfills. I resolved this problem as follow:

• babel.config.js:

module.exports = {
  presets: [['@vue/app', { useBuiltIns: 'entry' }]]
}

• In main.js

import 'core-js/stable'
import 'cross-fetch/polyfill'
import 'indexeddb-getall-shim'

• In Package.json: Add more pakage:

"cross-fetch": "^3.1.5"
"core-js": "3.6.5",
"indexeddb-getall-shim": "^1.3.6"

• In vue.config.js:

transpileDependencies: [

// can be string or regex

'@firebase',

/graphql/ ]

But i still don't understand the problem.