IE11 support issues

mitchellmonaghan

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
app.js(1183,9)

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!

Thanks,
Mitch

benoitranque

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

mitchellmonaghan

Windows 10 running quasar dev

rstoenescu

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.

Sweetyy

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’.

leopiccionia

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

Sweetyy

@leopiccionia thanks for the clarification

mitchellmonaghan

Upgraded to 0.15.7 still an issue.

pdanpdan

Please try this:

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

mitchellmonaghan

@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!

Sweetyy

@pdanpdan still doesn’t work for me:

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

rstoenescu

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

Sweetyy

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; 
[...]

/***/ }),

Sweetyy

I found what is the problem … it’s because of that package https://www.npmjs.com/package/vue-introjs…
I already asked for some help to make it works (Chrome, Firefox, Edge) in this post http://forum.quasar-framework.org/topic/1919/0-15-with-vue-introjs/12 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 ?

Sweetyy

Up ! Any idea ?

Sweetyy

Maybe is it possible to disable a plugin only on IE ?

No More Posting New Topics!

IE11 support issues