0

Hi I have build a webcomponent using vue. It is working perfectly in chrome . But it is returning a blank screen in IE 11. I have given babel configuaration . I think the issue is the arrow operator not getting transpilled.

package.json

{
    "name": "web-component-project",
    "version": "0.1.0",
    "private": true,
    "scripts": {
        "serve": "vue-cli-service serve",
        "build": "vue-cli-service build",
        "build:prod": "vue-cli-service build --target wc --name email-compose ./src/views/EmailCompose.vue"
    },
    "dependencies": {
        "axios": "^0.19.2",
        "babel-core": "^6.26.3",
        "babel-loader": "^8.0.6",
        "babel-polyfill": "^6.26.0",
        "babel-preset-es2015": "^6.24.1",
        "babel-preset-stage-2": "^6.24.1",
        "core-js": "^3.6.4",
        "cors": "^2.8.5",
        "dotenv": "^8.2.0",
        "express": "^4.17.1",
        "query-string": "^5.1.1",
        "vue": "^2.6.11",
        "webcomponentsjs": "^1.0.2"
    },
    "devDependencies": {
        "@babel/preset-env": "^7.8.4",
        "@vue/cli-plugin-babel": "~4.2.0",
        "@vue/cli-service": "~4.2.0",
        "@webcomponents/webcomponentsjs": "^2.4.2",
        "copy-webpack-plugin": "^5.1.1",
        "vue-template-compiler": "^2.6.11",
        "webpack-cli": "^3.3.11"
    }
}

babel.config.js

module.exports = {
    presets: [
        ['@vue/app', {
            polyfills: [
                'es6.promise', // already default included now
                'es6.array.iterator', // already default included now
                'es6.symbol',
                'es6.object.assign'
            ]
        }]
    ]
}

is this due to vue-wc-wrapper.js ? should I add that to transpile dependencies ?

Gander
  • 1,854
  • 1
  • 23
  • 30
Harikrishnan
  • 31
  • 1
  • 3
  • paste the code as code. Pasting any way you prevent easy interpretation. – Gander Feb 27 '20 at 08:55
  • What's the error message from the developer tools? – abraham Feb 27 '20 at 13:04
  • Is there any error in console in IE 11? If there is, the error points to which line? Besides, you could give the [minimal sample](https://stackoverflow.com/help/minimal-reproducible-example) code which can reproduce the issue. So that we can test and see how to help. Only with the package.json file seems not helpful to locate the issue. – Yu Zhou Feb 28 '20 at 02:59

0 Answers0