IE11 support issues

  • Hi all,

    Been using quasar for a while now and love this framework. Just updated some of my stuff to 0.15. However I have ran into a issue with IE11 support with my projects.

    So I created a new project with the cli (quasar init) and said yes for IE support in the cli and get the same issues with the base template as I had with my other projects. When I go to view the newly generated site IE11 only shows a white screen and and error in the console.

    The error is:

    SCRIPT1002: Syntax error

    Has anyone else had issues viewing a newly generated template site with IE11? I have confirmed that the supportIE: true is in the quasar.conf.js. Running the most up to date quasar version as well 0.15.5.

    Would love any help to solve whats going on here. Everything works great in Edge!


  • What is your OS? We have a known issue during dev on Win7 in IE11

  • Windows 10 running quasar dev

  • Admin

    Can you try again with Quasar CLI v0.15.7 pls? There’s been some improvements. Make sure that the project-locally installed quasar-cli is 0.15.7, because that’s what matters. Thank you.

  • Hi,

    I tried it on Windows 10 in IE11 with the CLI v0.15.7 but still not working for me.

    SCRIPT1002: Syntax error
    app.js (2022,1)

    Something strange is that when I upgraded, the console said quasar-cli@0.15.7 postintall and in the package.json I have
    "quasar-cli": "^0.15.7" but in my app when I use Quasar {{$q.version}} I have ‘Quasar 0.15.6’.

  • @Sweetyy quasar-cli 0.15.7 comes with Quasar 0.15.6, so it’s expected.

  • @leopiccionia thanks for the clarification :)

  • Upgraded to 0.15.7 still an issue.

  • Please try this:

    1. remove node_modules folder
    2. install packages using yarn (just yarn in console in the project folder)
    3. quasar dev and check if it’s still happening

  • @pdanpdan your solution worked for me! It seems strange to me that a dependency manager would have a impact on my compiled build. I will have to look into yarn more as I have always used npm. Thanks!

  • @pdanpdan still doesn’t work for me:

    SCRIPT1003: ':' attendu
    app.js (2203,1)

  • Admin

    Can you offer details? Copy-paste code 10 lines before and 10 lines after the offending line. Thanks.

  • Sure here it is:

    /***/ "./node_modules/vue-introjs/src/index.js":
    /***/ (function(module, __webpack_exports__, __webpack_require__) {
    "use strict";
    eval("/* WEBPACK VAR INJECTION */(function(introJs) {/* unused harmony export autoregister */\n/* harmony import */ var __WEBPACK_IMPORTED_MODULE_0__directives__ = __webpack_require__(\"./node_modules/vue-introjs/src/directives/index.js\");\n/* harmony import */ var __WEBPACK_IMPORTED_MODULE_1__timer__ = __webpack_require__(\"./node_modules/vue-introjs/src/timer.js\");\n/* global introJs */\n\n\n\nconst DEFAULT_OPTIONS = {\n    waitTimeout: 400\n};\n\nconst Plugin = {\n    install(Vue, options) {\n        options = Object.assign({}, DEFAULT_OPTIONS, options);\n\n        Vue.prototype.$intro = (...args) => {\n            return introJs(...args);\n        };\n\n        const Comp = Vue.extend(__WEBPACK_IMPORTED_MODULE_1__timer__[\"a\" /* default */]);\n        window.__introjsDiscovery = new Comp({\n            propsData: options\n        });\n\n        Vue.directive('intro', __WEBPACK_IMPORTED_MODULE_0__directives__[\"a\" /* DIRECTIVES */].intro);\n        Vue.directive('intro-step', __WEBPACK_IMPORTED_MODULE_0__directives__[\"a\" /* DIRECTIVES */].step);\n        Vue.directive('intro-position', __WEBPACK_IMPORTED_MODULE_0__directives__[\"a\" /* DIRECTIVES */].position);\n        Vue.directive('intro-tooltip-class', __WEBPACK_IMPORTED_MODULE_0__directives__[\"a\" /* DIRECTIVES */].tooltipClass);\n        Vue.directive('intro-highlight-class', __WEBPACK_IMPORTED_MODULE_0__directives__[\"a\" /* DIRECTIVES */].highlightClass);\n        Vue.directive('intro-scroll-to', __WEBPACK_IMPORTED_MODULE_0__directives__[\"a\" /* DIRECTIVES */].scrollTo);\n        Vue.directive('intro-disable-interaction', __WEBPACK_IMPORTED_MODULE_0__directives__[\"a\" /* DIRECTIVES */].disableIntegration);\n        Vue.directive('intro-hint', __WEBPACK_IMPORTED_MODULE_0__directives__[\"a\" /* DIRECTIVES */].hint);\n        Vue.directive('intro-hint-position', __WEBPACK_IMPORTED_MODULE_0__directives__[\"a\" /* DIRECTIVES */].hintPosition);\n        Vue.directive('intro-autostart', __WEBPACK_IMPORTED_MODULE_0__directives__[\"a\" /* DIRECTIVES */].autostart);\n        Vue.directive('intro-if', __WEBPACK_IMPORTED_MODULE_0__directives__[\"a\" /* DIRECTIVES */].conditional);\n    }\n};\n\n/* harmony default export */ __webpack_exports__[\"a\"] = (Plugin);\n\nfunction autoregister() {\n    if (window.Vue) {\n        window.Vue.use(Plugin);\n    }\n}\n\nautoregister();\n\n/* WEBPACK VAR INJECTION */}.call(__webpack_exports__, __webpack_require__(\"./node_modules/intro.js/intro.js\")[\"introJs\"]))\n//# sourceMappingURL=data:application/json;charset=utf-8; 
    /***/ }),

  • I found what is the problem … it’s because of that package
    I already asked for some help to make it works (Chrome, Firefox, Edge) in this post and it was working fine with the solution of @a47ae.

    I have to remove it from the quasar.conf and from the plugins section to make my app works on IE11.

    Is there any alternative to fix the issue for IE11 ? Or do you think it’s directly coming from the package ?

  • Up ! Any idea ?

Log in to reply

Looks like your connection to Quasar Framework was lost, please wait while we try to reconnect.