recompiled .quasar

This commit is contained in:
Joan Sanchez 2022-03-14 15:05:58 +01:00
parent 7ce93ab676
commit a91f1fd625
4 changed files with 245 additions and 177 deletions

View File

@ -10,23 +10,37 @@
* Boot files are your "main.js" * Boot files are your "main.js"
**/ **/
import { Quasar } from 'quasar';
import RootComponent from 'app/src/App.vue';
import createRouter from 'app/src/router/index';
import { Quasar } from 'quasar'
import RootComponent from 'app/src/App.vue'
import createRouter from 'app/src/router/index'
export default async function (createAppFn, quasarUserOptions) { export default async function (createAppFn, quasarUserOptions) {
// create store and router instances // create store and router instances
const router = typeof createRouter === 'function' ? await createRouter({}) : createRouter; const router = typeof createRouter === 'function'
? await createRouter({})
: createRouter
// Create the app instance. // Create the app instance.
// Here we inject into it the Quasar UI, the router & possibly the store. // Here we inject into it the Quasar UI, the router & possibly the store.
const app = createAppFn(RootComponent); const app = createAppFn(RootComponent)
app.config.devtools = true
app.use(Quasar, quasarUserOptions)
app.config.devtools = true;
app.use(Quasar, quasarUserOptions);
// Expose the app, the router and the store. // Expose the app, the router and the store.
// Note that we are not mounting the app here, since bootstrapping will be // Note that we are not mounting the app here, since bootstrapping will be
@ -34,6 +48,6 @@ export default async function (createAppFn, quasarUserOptions) {
return { return {
app, app,
router, router
}; }
} }

View File

@ -10,51 +10,79 @@
* Boot files are your "main.js" * Boot files are your "main.js"
**/ **/
import { createApp } from 'vue';
import '@quasar/extras/roboto-font/roboto-font.css'; import { createApp } from 'vue'
import '@quasar/extras/roboto-font/roboto-font.css'
import '@quasar/extras/material-icons/material-icons.css'
import '@quasar/extras/material-icons/material-icons.css';
// We load Quasar stylesheet file // We load Quasar stylesheet file
import 'quasar/dist/quasar.sass'; import 'quasar/dist/quasar.sass'
import 'src/css/app.scss';
import createQuasarApp from './app.js';
import quasarUserOptions from './quasar-user-options.js';
console.info('[Quasar] Running SPA.');
const publicPath = ``; import 'src/css/app.scss'
async function start({ app, router }, bootFiles) {
let hasRedirected = false;
const getRedirectUrl = (url) => {
try {
return router.resolve(url).href;
} catch (err) {}
return Object(url) === url ? null : url; import createQuasarApp from './app.js'
}; import quasarUserOptions from './quasar-user-options.js'
const redirect = (url) => {
hasRedirected = true;
console.info('[Quasar] Running SPA.')
const publicPath = ``
async function start ({ app, router }, bootFiles) {
let hasRedirected = false
const getRedirectUrl = url => {
try { return router.resolve(url).href }
catch (err) {}
return Object(url) === url
? null
: url
}
const redirect = url => {
hasRedirected = true
if (typeof url === 'string' && /^https?:\/\//.test(url)) { if (typeof url === 'string' && /^https?:\/\//.test(url)) {
window.location.href = url; window.location.href = url
return; return
} }
const href = getRedirectUrl(url); const href = getRedirectUrl(url)
// continue if we didn't fail to resolve the url // continue if we didn't fail to resolve the url
if (href !== null) { if (href !== null) {
window.location.href = href; window.location.href = href
window.location.reload(); window.location.reload()
}
} }
};
const urlPath = window.location.href.replace(window.location.origin, ''); const urlPath = window.location.href.replace(window.location.origin, '')
for (let i = 0; hasRedirected === false && i < bootFiles.length; i++) { for (let i = 0; hasRedirected === false && i < bootFiles.length; i++) {
try { try {
@ -65,36 +93,57 @@ async function start({ app, router }, bootFiles) {
ssrContext: null, ssrContext: null,
redirect, redirect,
urlPath, urlPath,
publicPath, publicPath
}); })
} catch (err) { }
catch (err) {
if (err && err.url) { if (err && err.url) {
redirect(err.url); redirect(err.url)
return; return
} }
console.error('[Quasar] boot error:', err); console.error('[Quasar] boot error:', err)
return; return
} }
} }
if (hasRedirected === true) { if (hasRedirected === true) {
return; return
} }
app.use(router);
app.mount('#q-app'); app.use(router)
app.mount('#q-app')
} }
createQuasarApp(createApp, quasarUserOptions).then((app) => { createQuasarApp(createApp, quasarUserOptions)
.then(app => {
return Promise.all([ return Promise.all([
import(/* webpackMode: "eager" */ 'boot/i18n'), import(/* webpackMode: "eager" */ 'boot/i18n'),
import(/* webpackMode: "eager" */ 'boot/axios'), import(/* webpackMode: "eager" */ 'boot/axios')
]).then((bootFiles) => {
const boot = bootFiles.map((entry) => entry.default).filter((entry) => typeof entry === 'function'); ]).then(bootFiles => {
const boot = bootFiles
.map(entry => entry.default)
.filter(entry => typeof entry === 'function')
start(app, boot)
})
})
start(app, boot);
});
});

View File

@ -10,104 +10,104 @@
* Boot files are your "main.js" * Boot files are your "main.js"
**/ **/
import App from 'app/src/App.vue';
let appPrefetch =
typeof App.preFetch === 'function'
import App from 'app/src/App.vue'
let appPrefetch = typeof App.preFetch === 'function'
? App.preFetch ? App.preFetch
: // Class components return the component options (and the preFetch hook) inside __c property : (
// Class components return the component options (and the preFetch hook) inside __c property
App.__c !== void 0 && typeof App.__c.preFetch === 'function' App.__c !== void 0 && typeof App.__c.preFetch === 'function'
? App.__c.preFetch ? App.__c.preFetch
: false; : false
)
function getMatchedComponents(to, router) {
const route = to ? (to.matched ? to : router.resolve(to).route) : router.currentRoute;
if (!route) { function getMatchedComponents (to, router) {
return []; const route = to
} ? (to.matched ? to : router.resolve(to).route)
: router.currentRoute
return Array.prototype.concat.apply( if (!route) { return [] }
[],
route.matched.map((m) => { return Array.prototype.concat.apply([], route.matched.map(m => {
return Object.keys(m.components).map((key) => { return Object.keys(m.components).map(key => {
const comp = m.components[key]; const comp = m.components[key]
return { return {
path: m.path, path: m.path,
c: comp, c: comp
}; }
});
}) })
); }))
} }
export function addPreFetchHooks(router, publicPath) { export function addPreFetchHooks (router, publicPath) {
// Add router hook for handling preFetch. // Add router hook for handling preFetch.
// Doing it after initial route is resolved so that we don't double-fetch // Doing it after initial route is resolved so that we don't double-fetch
// the data that we already have. Using router.beforeResolve() so that all // the data that we already have. Using router.beforeResolve() so that all
// async components are resolved. // async components are resolved.
router.beforeResolve((to, from, next) => { router.beforeResolve((to, from, next) => {
const urlPath = window.location.href.replace(window.location.origin, ''), const
urlPath = window.location.href.replace(window.location.origin, ''),
matched = getMatchedComponents(to, router), matched = getMatchedComponents(to, router),
prevMatched = getMatchedComponents(from, router); prevMatched = getMatchedComponents(from, router)
let diffed = false; let diffed = false
const preFetchList = matched const preFetchList = matched
.filter((m, i) => { .filter((m, i) => {
return ( return diffed || (diffed = (
diffed || !prevMatched[i] ||
(diffed = prevMatched[i].c !== m.c ||
!prevMatched[i] || prevMatched[i].c !== m.c || m.path.indexOf('/:') > -1) // does it has params? m.path.indexOf('/:') > -1 // does it has params?
); ))
}) })
.filter( .filter(m => m.c !== void 0 && (
(m) => typeof m.c.preFetch === 'function'
m.c !== void 0 &&
(typeof m.c.preFetch === 'function' ||
// Class components return the component options (and the preFetch hook) inside __c property // Class components return the component options (and the preFetch hook) inside __c property
(m.c.__c !== void 0 && typeof m.c.__c.preFetch === 'function')) || (m.c.__c !== void 0 && typeof m.c.__c.preFetch === 'function')
) ))
.map((m) => (m.c.__c !== void 0 ? m.c.__c.preFetch : m.c.preFetch)); .map(m => m.c.__c !== void 0 ? m.c.__c.preFetch : m.c.preFetch)
if (appPrefetch !== false) { if (appPrefetch !== false) {
preFetchList.unshift(appPrefetch); preFetchList.unshift(appPrefetch)
appPrefetch = false; appPrefetch = false
} }
if (preFetchList.length === 0) { if (preFetchList.length === 0) {
return next(); return next()
} }
let hasRedirected = false; let hasRedirected = false
const redirect = (url) => { const redirect = url => {
hasRedirected = true; hasRedirected = true
next(url); next(url)
}; }
const proceed = () => { const proceed = () => {
if (hasRedirected === false) {
next();
}
};
preFetchList if (hasRedirected === false) { next() }
.reduce( }
(promise, preFetch) =>
promise.then(
() =>
hasRedirected === false && preFetchList.reduce(
preFetch({ (promise, preFetch) => promise.then(() => hasRedirected === false && preFetch({
currentRoute: to, currentRoute: to,
previousRoute: from, previousRoute: from,
redirect, redirect,
urlPath, urlPath,
publicPath, publicPath
}) })),
),
Promise.resolve() Promise.resolve()
) )
.then(proceed) .then(proceed)
.catch((e) => { .catch(e => {
console.error(e); console.error(e)
proceed(); proceed()
}); })
}); })
} }

View File

@ -10,6 +10,11 @@
* Boot files are your "main.js" * Boot files are your "main.js"
**/ **/
import { Notify } from 'quasar';
export default { config: {}, plugins: { Notify } };
import {Notify} from 'quasar'
export default { config: {},plugins: {Notify} }