1
1
mirror of https://github.com/aelve/guide.git synced 2024-11-27 00:14:03 +03:00
guide/front/client/entry.client.ts
avele 469b5b5790
Front/structure refactor and building reconfigure (#277)
* DefferedPromise refactor

* Moved defferedPromise to utils folder

* Base url moved to app file

* Store modules states rewrittten according to vue doc recommendations

* Deffered promise usage moved

* removed unused packages in entries

* Structure refactor, easier building, prod building configured, tsconfig reconfigure removed useless packages

* Update front/index.html

Co-Authored-By: avele <34437766+avele@users.noreply.github.com>

* Update front/postcss.config.js

Co-Authored-By: avele <34437766+avele@users.noreply.github.com>

* Comment rewritten
2019-04-18 01:52:43 +04:00

74 lines
2.0 KiB
TypeScript

import _get from 'lodash/get'
import { createApp } from './app'
const { app, router, store } = createApp()
const STATE_KEY = '__INITIAL_STATE__'
if (window[STATE_KEY]) {
store.replaceState(window[STATE_KEY])
}
router.onReady(() => {
registerBeforeResolve()
app.$mount('#app')
})
function registerBeforeResolve () {
router.beforeEach(async (to, from, next) => {
// This case handles navigation to anchors on same page
if (to.path === from.path) {
next()
return
}
store.commit('tooglePageLoading')
if (!to.matched.length) {
store.commit('tooglePageLoading')
next()
return
}
const propsOption = to.matched[0].props.default
const props = propsOption
? typeof propsOption === 'function'
? propsOption(to)
: typeof propsOption === 'object'
? propsOption
: to.params
: {}
const routeComponent = to.matched[0].components.default
const matchedRootComponent = routeComponent.cid // Check if component already imported
? routeComponent
: (await routeComponent()).default
const matchedComponentsAndChildren = getComponentAndItsChildren(matchedRootComponent)
await Promise.all(matchedComponentsAndChildren.map(component => {
const serverPrefetch = component.options.serverPrefetch && component.options.serverPrefetch[0]
if (typeof serverPrefetch === 'function') {
return serverPrefetch.call({
$store: store,
$router: router,
...props
})
}
}))
store.commit('tooglePageLoading')
next()
})
}
function getComponentAndItsChildren (component, result?) {
if (!result) {
result = []
}
if (!result.includes(component)) {
result.push(component)
}
const children = Object.values(component.options.components)
// Parent component is also presents in components object
.filter(x => x !== component)
children.forEach(x => getComponentAndItsChildren(x, result))
return result
}