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

Kevin

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”
]

rstoenescu

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

Kevin

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

Kevin

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

Kevin

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”
},

rstoenescu

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

gvorster

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

Kevin

(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

whax

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

gvorster

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
  }
]

whax

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 ?

gvorster

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.

muratak18

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 ?

km333

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

vendor.b1df99dd.js:21 TypeError: n.e is not a function
at component (vendor.b1df99dd.js:21)
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.)

rstoenescu

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.

rstoenescu

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

36serg6

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

36serg6

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.

Kevin

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.

ali bougarne

the same problem happen to me but only when i try to deploy to heroku @rstoenescu
the resolution that i make was by importing the entire .vue component

No More Posting New Topics!

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