Quasar V16 - Build - n.e is not a function



  • Hello,

    I’have problem with latest quasar-cli.
    I start a new projet with command ‘quasar init XXXX’.
    I use “quasar dev” in my new projet XXXX, he is launched.
    If i use command “quasar build” and “http-server ./dist/spa-mat/”, i have a white page in my browser with this message in my console “n.e is not a function”.

    thanks for your help.

    Quasar info :
    Operating System Linux(4.13.0-43-generic) - linux/x64
    NodeJs 8.11.2

    Global packages
    NPM 5.5.1
    yarn Not installed
    quasar-cli 0.16.1
    vue-cli 2.9.3
    cordova 8.0.0

    Important local packages
    quasar-cli 0.16.1 (Quasar Framework CLI)
    quasar-framework 0.16.0 (Build responsive websites, PWAs, hybrid mobile apps and Electron apps, all simultaneously using same codebase)
    quasar-extras 2.0.1 (Quasar Framework fonts, icons and i18n.)
    vue 2.5.16 (Reactive, component-oriented view layer for modern web interfaces.)
    vue-router 3.0.1 (Official router for Vue.js 2)
    vuex 3.0.1 (state management for Vue.js)
    electron Not installed
    electron-packager Not installed
    electron-builder Not installed
    @babel/core 7.0.0-beta.46 (Babel compiler core.)
    webpack 4.8.3 (Packs CommonJs/AMD modules for the browser. Allows to split your codebase into multiple bundles, which can be loaded on demand. Support loaders to preprocess files, i.e. json, jsx, es7, css, less, … and your custom stuff.)
    webpack-dev-server 3.1.4 (Serves a webpack app. Updates the browser on changes.)
    workbox-webpack-plugin 3.2.0 (A plugin for your Webpack build process, helping you generate a manifest of local files that workbox-sw should precache.)

    package.json :
    “dependencies”: {
    “axios”: “^0.18.0”
    },
    “devDependencies”: {
    “babel-eslint”: “^8.2.2”,
    “eslint”: “^4.18.2”,
    “eslint-config-standard”: “^11.0.0”,
    “eslint-friendly-formatter”: “^4.0.1”,
    “eslint-loader”: “^2.0.0”,
    “eslint-plugin-import”: “^2.9.0”,
    “eslint-plugin-node”: “^6.0.1”,
    “eslint-plugin-promise”: “^3.7.0”,
    “eslint-plugin-standard”: “^3.0.1”,
    “eslint-plugin-vue”: “^4.3.0”,
    “quasar-cli”: “^0.16.1”
    },
    “engines”: {
    “node”: “>= 8.9.0”,
    “npm”: “>= 5.6.0”
    },
    “browserslist”: [
    "> 1%",
    “last 2 versions”,
    “not ie <= 10”
    ]


  • Admin

    Need more details. What browser? What is the full error?



  • I use chrome or firefox and i have the same error.

    error:
    TypeError: n.e is not a function
    at component (vendor.cfda41fd.js:14)
    at vendor.cfda41fd.js:14
    at vendor.cfda41fd.js:14
    at Array.map (<anonymous>)
    at vendor.cfda41fd.js:14
    at Array.map (<anonymous>)
    at Gt (vendor.cfda41fd.js:14)
    at vendor.cfda41fd.js:14
    at f (vendor.cfda41fd.js:14)
    at r (vendor.cfda41fd.js:14)
    o @ vendor.cfda41fd.js:14
    (anonymous) @ vendor.cfda41fd.js:14
    (anonymous) @ vendor.cfda41fd.js:14
    (anonymous) @ vendor.cfda41fd.js:14
    (anonymous) @ vendor.cfda41fd.js:14
    (anonymous) @ vendor.cfda41fd.js:14
    (anonymous) @ vendor.cfda41fd.js:14
    Gt @ vendor.cfda41fd.js:14
    (anonymous) @ vendor.cfda41fd.js:14
    f @ vendor.cfda41fd.js:14
    r @ vendor.cfda41fd.js:14
    r @ vendor.cfda41fd.js:14
    Wt @ vendor.cfda41fd.js:14
    JJXq.ee.confirmTransition @ vendor.cfda41fd.js:14
    JJXq.ee.transitionTo @ vendor.cfda41fd.js:14
    JJXq.Me.init @ vendor.cfda41fd.js:14
    beforeCreate @ vendor.cfda41fd.js:14
    Ve @ vendor.cfda41fd.js:20
    t._init @ vendor.cfda41fd.js:20
    sr @ vendor.cfda41fd.js:20
    JJXq @ vendor.cfda41fd.js:14
    c @ runtime~app.bc551001.js:1
    9 @ app.5273c3f7.js:1
    c @ runtime~app.bc551001.js:1
    n @ runtime~app.bc551001.js:1
    e @ runtime~app.bc551001.js:1
    (anonymous) @ app.5273c3f7.js:1



  • I tried to update my installation but I still have the error.

    quasar info:
    Operating System Linux(4.13.0-43-generic) - linux/x64
    NodeJs 8.11.2

    Global packages
    NPM 6.1.0
    yarn 1.7.0
    quasar-cli 0.16.3
    vue-cli 2.9.3
    cordova 8.0.0

    Important local packages
    quasar-cli 0.16.3 (Quasar Framework CLI)
    quasar-framework 0.16.0 (Build responsive websites, PWAs, hybrid mobile apps and Electron apps, all simultaneously using same codebase)
    quasar-extras 2.0.2 (Quasar Framework fonts, icons and i18n.)
    vue 2.5.16 (Reactive, component-oriented view layer for modern web interfaces.)
    vue-router 3.0.1 (Official router for Vue.js 2)
    vuex 3.0.1 (state management for Vue.js)
    electron Not installed
    electron-packager Not installed
    electron-builder Not installed
    @babel/core 7.0.0-beta.49 (Babel compiler core.)
    webpack 4.9.1 (Packs CommonJs/AMD modules for the browser. Allows to split your codebase into multiple bundles, which can be loaded on demand. Support loaders to preprocess files, i.e. json, jsx, es7, css, less, … and your custom stuff.)
    webpack-dev-server 3.1.4 (Serves a webpack app. Updates the browser on changes.)
    workbox-webpack-plugin 3.2.0 (A plugin for your Webpack build process, helping you generate a manifest of local files that workbox-sw should precache.)

    The project is available here: https://github.com/MrDrannoc/quasar-16-example



  • if i try to use a project in quasar V15, i haven’t any problem…

    quasar info:
    Operating System Linux(4.13.0-43-generic) - linux/x64
    NodeJs 8.11.2

    Global packages
    NPM 6.1.0
    yarn 1.7.0
    quasar-cli 0.15.7
    vue-cli 2.9.3
    cordova 8.0.0

    Important local packages
    quasar-cli 0.15.7 (Quasar Framework CLI)
    quasar-framework 0.15.6 (Build responsive websites, PWAs, hybrid mobile apps and Electron apps, all simultaneously using same codebase)
    quasar-extras 1.0.2 (Quasar Framework fonts, icons and i18n.)
    vue 2.5.13 (Reactive, component-oriented view layer for modern web interfaces.)
    vue-router 3.0.1 (Official router for Vue.js 2)
    vuex 3.0.1 (state management for Vue.js)
    electron Not available
    babel-core 6.26.0 (Babel compiler core.)
    webpack 3.11.0 (Packs CommonJs/AMD modules for the browser. Allows to split your codebase into multiple bundles, which can be loaded on demand. Support loaders to preprocess files, i.e. json, jsx, es7, css, less, … and your custom stuff.)
    webpack-dev-server 2.11.1 (Serves a webpack app. Updates the browser on changes.)

    package.json:
    “dependencies”: {
    “axios”: “^0.17.1”
    },
    “devDependencies”: {
    “babel-eslint”: “8.2.1”,
    “eslint”: “4.15.0”,
    “eslint-config-standard”: “10.2.1”,
    “eslint-friendly-formatter”: “3.0.0”,
    “eslint-loader”: “1.7.1”,
    “eslint-plugin-import”: “2.7.0”,
    “eslint-plugin-node”: “5.2.0”,
    “eslint-plugin-promise”: “3.4.0”,
    “eslint-plugin-standard”: “3.0.1”,
    “eslint-plugin-vue”: “4.0.0”,
    “quasar-cli”: “^0.15.6”
    },


  • Admin

    Try to copy-paste here 10 lines of the code before and after the error in vendor. Thank you.



  • I have the same today after upgrading.

    I deployed a temporary app here http://boyanapp.s3-website-eu-west-1.amazonaws.com/ using quasar build
    where you can see the error in the console, hope it helps.

    Error in Chrome 66 / Firefox 59:
    vendor.d277bd90.js:14 TypeError: n.e is not a function
    at component (vendor.d277bd90.js:14)
    at vendor.d277bd90.js:14
    at vendor.d277bd90.js:14
    at Array.map (<anonymous>)
    at vendor.d277bd90.js:14
    at Array.map (<anonymous>)
    at Zt (vendor.d277bd90.js:14)
    at vendor.d277bd90.js:14
    at h (vendor.d277bd90.js:14)
    at i (vendor.d277bd90.js:14)
    o @ vendor.d277bd90.js:14

    quasar info:

    Operating System Linux(2.6.32-642.13.1.el6.x86_64) - linux/x64
    NodeJs 9.11.1

    Global packages
    NPM 5.6.0
    yarn Not installed
    quasar-cli 0.16.3
    vue-cli 2.9.3
    cordova You have been opted out of telemetry. To change this, run: cordova telemetry on.
    6.5.0

    Important local packages
    quasar-cli 0.16.3 (Quasar Framework CLI)
    quasar-framework 0.16.0 (Build responsive websites, PWAs, hybrid mobile apps and Electron apps, all simultaneously using same codebase)
    quasar-extras 2.0.2 (Quasar Framework fonts, icons and i18n.)
    vue 2.5.16 (Reactive, component-oriented view layer for modern web interfaces.)
    vue-router 3.0.1 (Official router for Vue.js 2)
    vuex 3.0.1 (state management for Vue.js)
    electron Not installed
    electron-packager Not installed
    electron-builder Not installed
    @babel/core 7.0.0-beta.49 (Babel compiler core.)
    webpack 4.9.1 (Packs CommonJs/AMD modules for the browser. Allows to split your codebase into multiple bundles, which can be loaded on demand. Support loaders to preprocess files, i.e. json, jsx, es7, css, less, … and your custom stuff.)
    webpack-dev-server 3.1.4 (Serves a webpack app. Updates the browser on changes.)
    workbox-webpack-plugin 3.2.0 (A plugin for your Webpack build process, helping you generate a manifest of local files that workbox-sw should precache.)



  • (p(!1,“uncaught error during route navigation:”),console.error(t))),n&&n(t)};if(E(t,r)&&t.matched.length===r.matched.length)return this.ensureURL(),o();var s=te(this.current.matched,t.matched),a=s.updated,u=s.deactivated,l=s.activated,c=[].concat(ie(u),this.router.beforeHooks,re(a),l.map(function(t){return t.beforeEnter}),Ht(l));this.pending=t;var h=function(e,n){if(i.pending!==t)return o();try{e(t,r,function(t){!1===t||m(t)?(i.ensureURL(!0),o(t)):“string”===typeof t||“object”===typeof t&&(“string”===typeof t.path||“string”===typeof t.name)?(o(),“object”===typeof t&&t.replace?i.replace(t):i.push(t)):n(t)})}catch(t){o(t)}};Ut(c,h,function(){var n=[],r=function(){return i.current===t},s=se(l,n,r),a=s.concat(i.router.resolveHooks);Ut(a,h,function(){if(i.pending!==t)return o();i.pending=null,e(t),i.router.app&&i.router.app.$nextTick(function(){n.forEach(function(t){t()})})})})},Gt.prototype.updateRoute=function(t){var e=this.current;this.current=t,this.cb&&this.cb(t),this.router.afterHooks.forEach(function(n){n&&n(t,e)})};var le=function(t){function e(e,n){var i=this;t.call(this,e,n);var r=e.options.scrollBehavior;r&&At();var o=ce(this.base);window.addEventListener(“popstate”,function(t){var n=i.current,s=ce(i.base);i.current===T&&s===o||i.transitionTo(s,function(t){r&&kt(e,t,n,!0)})})}return t&&(e.proto=t),e.prototype=Object.create(t&&t.prototype),e.prototype.constructor=e,e.prototype.go=function(t){window.history.go(t)},e.prototype.push=function(t,e,n){var i=this,r=this,o=r.current;this.transitionTo(t,function(t){Qt(V(i.base+t.fullPath)),kt(i.router,t,o,!1),e&&e(t)},n)},e.prototype.replace=function(t,e,n){var i=this,r=this,o=r.current;this.transitionTo(t,function(t){Ft(V(i.base+t.fullPath)),kt(i.router,t,o,!1),e&&e(t)},n)},e.prototype.ensureURL=function(t){if(ce(this.base)!==this.current.fullPath){var e=V(this.base+this.current.fullPath);t?Qt(e):Ft(e)}},e.prototype.getCurrentLocation=function(){return ce(this.base)},e}(Gt);function ce(t){var e=window.location.pathname;return t&&0===e.indexOf(t)&&(e=e.slice(t.length)),(e||"/")+window.location.search+window.location.hash}var he=function(t){function e(e,n,i){t.call(this,e,n),i&&de(this.base)||fe()}return t&&(e.proto=t),e.prototype=Object.create(t&&t.prototype),e.prototype.constructor=e,e.prototype.setupListeners=function(){var t=this,e=this.router,n=e.options.scrollBehavior,i=$t&&n;i&&At(),window.addEventListener($t?“popstate”:“hashchange”,function(){var e=t.current;fe()&&t.transitionTo(pe(),function(n){i&&kt(t.router,n,e,!0),$t||ge(n.fullPath)})})},e.prototype.push=function(t,e,n){var i=this,r=this,o=r.current;this.transitionTo(t,function(t){ve(t.fullPath),kt(i.router,t,o,!1),e&&e(t)},n)},e.prototype.replace=function(t,e,n){var i=this,r=this,o=r.current;this.transitionTo(t,function(t){ge(t.fullPath),kt(i.router,t,o,!1),e&&e(t)},n)},e.prototype.go=function(t){window.history.go(t)},e.prototype.ensureURL=function(t){var e=this.current.fullPath;pe()!==e&&(t?ve(e):ge(e))},e.prototype.getCurrentLocation=function(){return pe()},e}(Gt);function de(t){var e=ce(t);if(!/^/#/.test(e))return window.location.replace(V(t+"/#"+e)),!0}function fe(){var t=pe();return"/"===t.charAt(0)||(ge("/"+t),!1)}function pe(){var t=window.location.href,e=t.indexOf("#");return-1===e?"":t.slice(e+1)}function me(t){var e=window.location.href,n=e.indexOf("#"),i=n>=0?e.slice(0,n):e;return i+"#"+t}function ve(t){$t?Qt(me(t)):window.location.hash=t}function ge(t){$t?Ft(me(t)):window.location.replace(me(t))}var ye=function(t){function e(e,n){t.call(this,e,n),this.stack=[],this.index=-1}return t&&(e.proto=t),e.prototype=Object.create(t&&t.prototype),e.prototype.constructor=e,e.prototype.push=function(t,e,n){var i=this;this.transitionTo(t,function(t){i.stack=i.stack.slice(0,i.index+1).concat(t),i.index++,e&&e(t)},n)},e.prototype.replace=function(t,e,n){var i=this;this.transitionTo(t,function(t){i.stack=i.stack.slice(0,i.index).concat(t),e&&e(t)},n)},e.prototype.go=function(t){var e=this,n=this.index+t;if(!(n<0||n>=this.stack.length)){var i=this.stack[n];this.confirmTransition(i,function(){e.index=n,e.updateRoute(i)})}},e.prototype.getCurrentLocation=function(){var t=this.stack[this.stack.length-1];return t?t.fullPath:"/"},e.prototype.ensureURL=function(){},e}(Gt),be=function(t){void 0===t&&(t={}),this.app=null,this.apps=[],this.options=t,this.beforeHooks=[],this.resolveHooks=[],this.afterHooks=[],this.matcher=xt(t.routes||[],this);var e=t.mode||“hash”;switch(this.fallback=“history”===e&&!$t&&!1!==t.fallback,this.fallback&&(e=“hash”),F||(e=“abstract”),this.mode=e,e){case"history":this.history=new le(this,t.base);break;case"hash":this.history=new he(this,t.base,this.fallback);break;case"abstract":this.history=new ye(this,t.base);break;default:0}},_e={currentRoute:{configurable:!0}};function Me(t,e){return t.push(e),function(){var n=t.indexOf(e);n>-1&&t.splice(n,1)}}function we(t,e,n){var i=“hash”===n?"#"+e:e;return t?V(t+"/"+i):i}be.prototype.match=function(t,e,n){return this.matcher.match(t,e,n)},_e.currentRoute.get=function(){return this.history&&this.history.current},be.prototype.init=function(t){var e=this;if(this.apps.push(t),!this.app){this.app=t;var n=this.history;if(n instanceof le)n.transitionTo(n.getCurrentLocation());else if(n instanceof he){var i=function(){n.setupListeners()};n.transitionTo(n.getCurrentLocation(),i,i)}n.listen(function(t){e.apps.forEach(function(e){e._route=t})})}},be.prototype.beforeEach=function(t){return Me(this.beforeHooks,t)},be.prototype.beforeResolve=function(t){return Me(this.resolveHooks,t)},be.prototype.afterEach=function(t){return Me(this.afterHooks,t)},be.prototype.onReady=function(t,e){this.history.onReady(t,e)},be.prototype.onError=function(t){this.history.onError(t)},be.prototype.push=function(t,e,n){this.history.push(t,e,n)},be.prototype.replace=function(t,e,n){this.history.replace(t,e,n)},be.prototype.go=function(t){this.history.go(t)},be.prototype.back=function(){this.go(-1)},be.prototype.forward=function(){this.go(1)},be.prototype.getMatchedComponents=function(t){var e=t?t.matched?t:this.resolve(t).route:this.currentRoute;return e?[].concat.apply([],e.matched.map(function(t){return Object.keys(t.components).map(function(e){return t.components[e]})})):[]},be.prototype.resolve=function(t,e,n){var i=Mt(t,e||this.history.current,n,this),r=this.match(i,e),o=r.redirectedFrom||r.fullPath,s=this.history.base,a=we(s,o,this.mode);return{location:i,route:r,href:a,normalizedTo:i,resolved:r}},be.prototype.addRoutes=function(t){this.matcher.addRoutes(t),this.history.current!==T&&this.history.transitionTo(this.history.getCurrentLocation())},Object.defineProperties(be.prototype,_e),be.install=Q,be.version=“3.0.1”,F&&window.Vue&&window.Vue.use(be);var xe=be,Se=[{path:"/",component:function(){return n.e(0).then(n.bind(null,“ez0Y”))},children:[{path:"",component:function(){return n.e(0).then(n.bind(null,“kmF/”))}}]},{path:"*",component:function(){return n.e(0).then(n.bind(null,“7l0S”))}}];o[“a”].use(xe);var Ce=new xe({mode:“history”,base:"/",scrollBehavior:function(){return{y:0}},routes:Se}),je=Ce,Ae=function(t){var e=Number(t.version.split(".")[0]);if(e>=2)t.mixin({beforeCreate:i});else{var n=t.prototype._init;t.prototype._init=function(t){void 0===t&&(t={}),t.init=t.init?[i].concat(t.init):i,n.call(this,t)}}function i(){var t=this.$options;t.store?this.$store=“function”===typeof t.store?t.store():t.store:t.parent&&t.parent.$store&&(this.$store=t.parent.$store)}},ke=“undefined”!==typeof window&&window.VUE_DEVTOOLS_GLOBAL_HOOK;function Ie(t){ke&&(t._devtoolHook=ke,ke.emit(“vuex:init”,t),ke.on(“vuex:travel-to-state”,function(e){t.replaceState(e)}),t.subscribe(function(t,e){ke.emit(“vuex:mutation”,t,e)}))}function Te(t,e){Object.keys(t).forEach(function(n){return e(t[n],n)})}function Le(t){return null!==t&&“object”===typeof t}function Ne(t){return t&&“function”===typeof t.then}var Ee=function(t,e){this.runtime=e,this._children=Object.create(null),this._rawModule=t;var n=t.state;this.state=(“function”===typeof n?n():n)||{}},De={namespaced:{configurable:!0}};De.namespaced.get=function(){return!!this._rawModule.namespaced},Ee.prototype.addChild=function(t,e){this._children[t]=e},Ee.prototype.removeChild=function(t){delete this._children[t]},Ee.prototype.getChild=function(t){return this._children[t]},Ee.prototype.update=function(t){this._rawModule.namespaced=t.namespaced,t.actions&&(this._rawModule.actions=t.actions),t.mutations&&(this._rawModule.mutations=t.mutations),t.getters&&(this._rawModule.getters=t.getters)},Ee.prototype.forEachChild=function(t){Te(this._children,t)},Ee.prototype.forEachGetter=function(t){this._rawModule.getters&&Te(this._rawModule.getters,t)},Ee.prototype.forEachAction=function(t){this._rawModule.actions&&Te(this._rawModule.actions,t)},Ee.prototype.forEachMutation=function(t){this._rawModule.mutations&&Te(this._rawModule.mutations,t)},Object.defineProperties(Ee.prototype,De);var Oe=function(t){this.register([],t,!1)};function qe(t,e,n){if(e.update(n),n.modules)for(var i in n.modules){if(!e.getChild(i))return void 0;qe(t.concat(i),e.getChild(i),n.modules[i])}}Oe.prototype.get=function(t){return t.reduce(function(t,e){return t.getChild(e)},this.root)},Oe.prototype.getNamespace=function(t){var e=this.root;return t.reduce(function(t,n){return e=e.getChild(n),t+(e.namespaced?n+"/":"")},"")},Oe.prototype.update=function(t){qe([],this.root,t)},Oe.prototype.register=function(t,e,n){var i=this;void 0===n&&(n=!0);var r=new Ee(e,n);if(0===t.length)this.root=r;else{var o=this.get(t.slice(0,-1));o.addChild(t[t.length-1],r)}e.modules&&Te(e.modules,function(e,r){i.register(t.concat®,e,n)})},Oe.prototype.unregister=function(t){var e=this.get(t.slice(0,-1)),n=t[t.length-1];e.getChild(n).runtime&&e.removeChild(n)};var $e;var ze=function(t){var e=this;void 0===t&&(t={}),!$e&&“undefined”!==typeof window&&window.Vue&&Ge(window.Vue);var n=t.plugins;void 0===n&&(n=[]);var i=t.strict;void 0===i&&(i=!1);var r=t.state;void 0===r&&(r={}),“function”===typeof r&&(r=r()||

    thanks for your help



  • Hi,

    i’ve got the same error after update to the latest version.

    The problem seems to come from the import() of pages inside the routes.js file

    Replace

    component: () => import('pages/404')
    

    by

    component: PageNotFound
    

    and make import on the Top

    import PageNotFound from 'pages/404'
    

    Repeat it for all your routes



  • I tried this and using quasar build I still get the same error.

    import indexPage from 'pages/index'
    import testPage from 'pages/test'
    import favPage from 'pages/favorite'
    import listPage from 'pages/list'
    import searchPage from 'pages/search'
    import adminPage from 'pages/admin'
    import infoPage from 'pages/admin-radio-info'
    import notfoundPage from 'pages/404'
    import layoutDefault from 'layouts/default'
    
    export default [
      {
        path: '/',
        component: layoutDefault,
        children: [
          { path: '', component: indexPage },
          { path: 'test', component: testPage },
          { path: 'favorite', component: favPage },
          { path: 'list', name: 'listPage', component: listPage },
          { path: 'search', component: searchPage },
          { path: 'admin', component: adminPage },
          { path: 'admin-radio-info', component: infoPage }
        ]
      },
    
      { // Always leave this as last one
        path: '*',
        component: notfoundPage
      }
    ]
    


  • Here is mine :

    import LayoutDefault from 'layouts/default'
    import HomePage from 'pages/index'
    import RegisterPage from 'pages/register'
    import LoginPage from 'pages/login'
    import LogoutPage from 'pages/logout'
    import AccountPage from 'pages/account/index'
    import PageNotFound from 'pages/404'
    import ProfilePage from 'pages/account/profile'
    
    export default [
      {
        path: '/',
        component: LayoutDefault,
        children: [
          {
            name: 'home',
            path: '',
            component: HomePage
          },
          {
            name: 'register',
            path: '/register',
            component: RegisterPage
          },
          {
            name: 'login',
            path: '/login',
            component: LoginPage
          },
          {
            name: 'logout',
            path: '/logout',
            component: LogoutPage
          },
          {
            name: 'account',
            path: '/account',
            component: AccountPage
          },
          {
            name: 'accountProfile',
            path: '/account/profile',
            component: ProfilePage
          }
        ]
      },
    
      { // Always leave this as last one
        path: '*',
        component: PageNotFound
      }
    ]
    

    Here are my dependencies

      "dependencies": {
        "axios": "^0.18.0",
        "dotenv": "^5.0.1",
        "node-sass": "^4.9.0",
        "sass-loader": "^7.0.1",
        "vue-i18n": "^7.3.3",
        "vue-moment": "^4.0.0-0",
        "vuelidate": "^0.7.4",
        "vuelidate-error-extractor": "^1.3.1"
      },
      "devDependencies": {
        "babel-eslint": "^8.2.1",
        "eslint": "^4.18.2",
        "eslint-config-standard": "^11.0.0",
        "eslint-friendly-formatter": "^4.0.1",
        "eslint-loader": "^2.0.0",
        "eslint-plugin-import": "^2.9.0",
        "eslint-plugin-node": "^6.0.1",
        "eslint-plugin-promise": "^3.7.0",
        "eslint-plugin-standard": "^3.0.1",
        "eslint-plugin-vue": "^4.3.0",
        "quasar-cli": "^0.16.0"
      },
      "engines": {
        "node": ">= 8.9.0",
        "npm": ">= 5.6.0",
        "yarn": ">= 1.6.0"
      },
      "browserslist": [
        "> 1%",
        "last 2 versions",
        "not ie <= 10"
      ]
    }
    

    My Quasar Version

    quasar --version
    0.16.4
    

    Did you tried to build the “hello world” package ?



  • You’re right! It is indeed the changes in routes.js file that solves it.

    I’m using AWS S3 to host my app and I was using the aws sync option to deploy my files. So must be a caching issue I think.
    I am now removing the old files first before a new deploy.

    It’s all working now.



  • Hi I’m having the same issue. As I see to solve the problem we need to change the way of importing components. But I have a question about the solution.
    If I import the pages at the top of the routes.js, Do I still benefit of lazy loading or not ?



  • Same issue after both dev -m pwa and also build -m pwa

    1. vendor.b1df99dd.js:21 TypeError: n.e is not a function
      at component (vendor.b1df99dd.js:21)

    2. Also getting (in prod build running from my local machine)
      Error during service worker registration: DOMException: Only secure origins are allowed (see: https://goo.gl/Y0ZkNV).
      I don’t remember getting this before.

    Operating System Linux(4.13.0-43-generic) - linux/x64
    NodeJs 8.11.2

    Global packages
    NPM 5.6.0
    yarn Not installed
    quasar-cli 0.16.4
    vue-cli 3.0.0-beta.15
    cordova Not installed

    Important local packages
    quasar-cli 0.16.4 (Quasar Framework CLI)
    quasar-framework 0.16.0 (Build responsive websites, PWAs, hybrid mobile apps and Electron apps, all simultaneously using same codebase)
    quasar-extras 2.0.2 (Quasar Framework fonts, icons and i18n.)
    vue 2.5.16 (Reactive, component-oriented view layer for modern web interfaces.)
    vue-router 3.0.1 (Official router for Vue.js 2)
    vuex 3.0.1 (state management for Vue.js)
    electron Not installed
    electron-packager Not installed
    electron-builder Not installed
    @babel/core 7.0.0-beta.49 (Babel compiler core.)
    webpack 4.9.1 (Packs CommonJs/AMD modules for the browser. Allows to split your codebase into multiple bundles, which can be loaded on demand. Support loaders to preprocess files, i.e. json, jsx, es7, css, less, … and your custom stuff.)
    webpack-dev-server 3.1.4 (Serves a webpack app. Updates the browser on changes.)
    workbox-webpack-plugin 3.2.0 (A plugin for your Webpack build process, helping you generate a manifest of local files that workbox-sw should precache.)


  • Admin

    If it’s a problem with lazy loading, it’s Webpack’s fault, not Quasar’s. In any case, I couldn’t reproduce this no matter how hard I tried. That is why I am kindly asking you to create a minimal reproduction project folder then zip it (without node_modules) and send it to me on Discord (rstoenescu). Thank you.


  • Admin

    I’ve been told by a developer that in his case using lazy loading solves this webpack issue.



  • Hello, @rstoenescu.
    I have the same issue.

    I figured out that error “n.e is not a function” appears, because webpack skip definition of this function while build command execute:

    node_modules/webpack/lib/MainTemplate.js:105
    alt text

    But I can’t find reason.

    Please try to reproduce from my zip.

    There are zip of my sample project (without node_modules):
    http://sergnet.ddns.net/public/quasar/main_bk.zip

    And separately whole node_modules folder:
    http://serg.shad.com.ua/public/quasar/node_modules.zip

    Quasar info:

    Operating System Linux(3.19.0-80-generic) - linux/x64
    NodeJs 8.11.1

    Global packages
    NPM 5.6.0
    yarn Not installed
    quasar-cli 0.16.4
    vue-cli 2.9.6
    cordova Not installed

    Important local packages
    quasar-cli 0.16.4 (Quasar Framework CLI)
    quasar-framework 0.16.0 (Build responsive websites, PWAs, hybrid mobile apps and Electron apps, all simultaneously using same codebase)
    quasar-extras 2.0.2 (Quasar Framework fonts, icons and i18n.)
    vue 2.5.16 (Reactive, component-oriented view layer for modern web interfaces.)
    vue-router 3.0.1 (Official router for Vue.js 2)
    vuex 3.0.1 (state management for Vue.js)
    electron Not installed
    electron-packager Not installed
    electron-builder Not installed
    @babel/core 7.0.0-beta.49 (Babel compiler core.)
    webpack 4.12.1 (Packs CommonJs/AMD modules for the browser. Allows to split your codebase into multiple bundles, which can be loaded on demand. Support loaders to preprocess files, i.e. json, jsx, es7, css, less, … and your custom stuff.)
    webpack-dev-server 3.1.4 (Serves a webpack app. Updates the browser on changes.)
    workbox-webpack-plugin 3.2.0 (A plugin for your Webpack build process, helping you generate a manifest of local files that workbox-sw should precache.)



  • I found that the error appears in my case only with a specific folder structure with a specific folder name.

    Example where error appears:

    Project Name Quasar:
    test

    The path to the quasar project folder:
    <public_root>/quasar/test

    The path to quasar.conf.js:
    <public_root>/quasar/test/quasar.conf.js

    Path to the dist folder:
    <public_root>/test

    I have two additional lines in the file quasar.conf.js:
    build: {
    distDir: ‘…/…/test’,
    publicPath: ‘test’,

    }

    And if I rename the folder “quasar” to any other name, the error will disappear!

    Example where there is no error:

    Project Name Quasar:
    test

    The path to the quasar project folder:
    <public_root>/some-folder/test

    The path to quasar.conf.js:
    <public_root>/some-folder/test/quasar.conf.js

    Path to the dist folder:
    <public_root>/test

    I have two additional lines in the file quasar.conf.js:
    build: {
    distDir: ‘…/…/test’,
    publicPath: ‘test’,

    }

    Is it really the reason of the error that name of the folder is “quasar” in which the project folder?

    Please check somebody this in your environment.



  • I tried the same project on a windows seven and I have no problem, yet I have a directory “Quasar” in my project. I tried to rename it under linux and I still have the problem.