123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347 |
- import Vue from 'vue'
- import { decode, parsePath, withoutBase, withoutTrailingSlash, normalizeURL } from 'ufo'
- <% utilsImports = [
- ...(features.asyncData || features.fetch) ? [
- 'getMatchedComponentsInstances',
- 'getChildrenComponentInstancesUsingFetch',
- 'promisify',
- 'globalHandleError',
- 'urlJoin'
- ] : [],
- ...features.layouts ? [
- 'sanitizeComponent'
- ]: []
- ] %>
- <% if (utilsImports.length) { %>import { <%= utilsImports.join(', ') %> } from './utils'<% } %>
- import NuxtError from '<%= components.ErrorPage ? components.ErrorPage : "./components/nuxt-error.vue" %>'
- <% if (loading) { %>import NuxtLoading from '<%= (typeof loading === "string" ? loading : "./components/nuxt-loading.vue") %>'<% } %>
- <% if (buildIndicator) { %>import NuxtBuildIndicator from './components/nuxt-build-indicator'<% } %>
- <% css.forEach((c) => { %>
- import '<%= relativeToBuild(resolvePath(c.src || c, { isStyle: true })) %>'
- <% }) %>
- <% if (features.layouts) { %>
- <%= Object.keys(layouts).map((key) => {
- if (splitChunks.layouts) {
- return `const _${hash(key)} = () => import('${layouts[key]}' /* webpackChunkName: "${wChunk('layouts/' + key)}" */).then(m => sanitizeComponent(m.default || m))`
- } else {
- return `import _${hash(key)} from '${layouts[key]}'`
- }
- }).join('\n') %>
- <% if (splitChunks.layouts) { %>
- let resolvedLayouts = {}
- const layouts = { <%= Object.keys(layouts).map(key => `"_${key}": _${hash(key)}`).join(',') %> }<%= isTest ? '// eslint-disable-line' : '' %>
- <% } else { %>
- const layouts = { <%= Object.keys(layouts).map(key => `"_${key}": sanitizeComponent(_${hash(key)})`).join(',') %> }<%= isTest ? '// eslint-disable-line' : '' %>
- <% } %>
- <% } %>
- export default {
- render (h, props) {
- <% if (loading) { %>const loadingEl = h('NuxtLoading', { ref: 'loading' })<% } %>
- <% if (features.layouts) { %>
- const layoutEl = h(this.layout || 'nuxt')
- const templateEl = h('div', {
- domProps: {
- id: '__layout'
- },
- key: this.layoutName
- }, [layoutEl])
- <% } else { %>
- const templateEl = h('nuxt')
- <% } %>
- <% if (features.transitions) { %>
- const transitionEl = h('transition', {
- props: {
- name: '<%= layoutTransition.name %>',
- mode: '<%= layoutTransition.mode %>'
- },
- on: {
- beforeEnter (el) {
- // Ensure to trigger scroll event after calling scrollBehavior
- window.<%= globals.nuxt %>.$nextTick(() => {
- window.<%= globals.nuxt %>.$emit('triggerScroll')
- })
- }
- }
- }, [templateEl])
- <% } %>
- return h('div', {
- domProps: {
- id: '<%= globals.id %>'
- }
- }, [
- <% if (loading) { %>loadingEl, <% } %>
- <% if (buildIndicator) { %>h(NuxtBuildIndicator), <% } %>
- <% if (features.transitions) { %>transitionEl<% } else { %>templateEl<% } %>
- ])
- },
- <% if (features.clientOnline || features.layouts) { %>
- data: () => ({
- <% if (features.clientOnline) { %>
- isOnline: true,
- <% } %>
- <% if (features.layouts) { %>
- layout: null,
- layoutName: '',
- <% } %>
- <% if (features.fetch) { %>
- nbFetching: 0
- <% } %>
- }),
- <% } %>
- beforeCreate () {
- Vue.util.defineReactive(this, 'nuxt', this.$options.nuxt)
- },
- created () {
- // Add this.$nuxt in child instances
- this.$root.$options.<%= globals.nuxt %> = this
- if (process.client) {
- // add to window so we can listen when ready
- window.<%= globals.nuxt %> = <%= (globals.nuxt !== '$nuxt' ? 'window.$nuxt = ' : '') %>this
- <% if (features.clientOnline) { %>
- this.refreshOnlineStatus()
- // Setup the listeners
- window.addEventListener('online', this.refreshOnlineStatus)
- window.addEventListener('offline', this.refreshOnlineStatus)
- <% } %>
- }
- // Add $nuxt.error()
- this.error = this.nuxt.error
- // Add $nuxt.context
- this.context = this.$options.context
- },
- <% if (loading || isFullStatic) { %>
- async mounted () {
- <% if (loading) { %>this.$loading = this.$refs.loading<% } %>
- <% if (isFullStatic) {%>
- if (this.isPreview) {
- if (this.$store && this.$store._actions.nuxtServerInit) {
- <% if (loading) { %>this.$loading.start()<% } %>
- await this.$store.dispatch('nuxtServerInit', this.context)
- }
- await this.refresh()
- <% if (loading) { %>this.$loading.finish()<% } %>
- }
- <% } %>
- },
- <% } %>
- watch: {
- 'nuxt.err': 'errorChanged'
- },
- <% if (features.clientOnline) { %>
- computed: {
- isOffline () {
- return !this.isOnline
- },
- <% if (features.fetch) { %>
- isFetching () {
- return this.nbFetching > 0
- },<% } %>
- <% if (nuxtOptions.target === 'static') { %>
- isPreview () {
- return Boolean(this.$options.previewData)
- },<% } %>
- },
- <% } %>
- methods: {
- <%= isTest ? '/* eslint-disable comma-dangle */' : '' %>
- <% if (features.clientOnline) { %>
- refreshOnlineStatus () {
- if (process.client) {
- if (typeof window.navigator.onLine === 'undefined') {
- // If the browser doesn't support connection status reports
- // assume that we are online because most apps' only react
- // when they now that the connection has been interrupted
- this.isOnline = true
- } else {
- this.isOnline = window.navigator.onLine
- }
- }
- },
- <% } %>
- async refresh () {
- <% if (features.asyncData || features.fetch) { %>
- const pages = getMatchedComponentsInstances(this.$route)
- if (!pages.length) {
- return
- }
- <% if (loading) { %>this.$loading.start()<% } %>
- const promises = pages.map((page) => {
- const p = []
- <% if (features.fetch) { %>
- // Old fetch
- if (page.$options.fetch && page.$options.fetch.length) {
- p.push(promisify(page.$options.fetch, this.context))
- }
- if (page.$fetch) {
- p.push(page.$fetch())
- } else {
- // Get all component instance to call $fetch
- for (const component of getChildrenComponentInstancesUsingFetch(page.$vnode.componentInstance)) {
- p.push(component.$fetch())
- }
- }
- <% } %>
- <% if (features.asyncData) { %>
- if (page.$options.asyncData) {
- p.push(
- promisify(page.$options.asyncData, this.context)
- .then((newData) => {
- for (const key in newData) {
- Vue.set(page.$data, key, newData[key])
- }
- })
- )
- }
- <% } %>
- return Promise.all(p)
- })
- try {
- await Promise.all(promises)
- } catch (error) {
- <% if (loading) { %>this.$loading.fail(error)<% } %>
- globalHandleError(error)
- this.error(error)
- }
- <% if (loading) { %>this.$loading.finish()<% } %>
- <% } %>
- },
- <% if (splitChunks.layouts) { %>async <% } %>errorChanged () {
- if (this.nuxt.err) {
- <% if (loading) { %>
- if (this.$loading) {
- if (this.$loading.fail) {
- this.$loading.fail(this.nuxt.err)
- }
- if (this.$loading.finish) {
- this.$loading.finish()
- }
- }
- <% } %>
- let errorLayout = (NuxtError.options || NuxtError).layout;
- if (typeof errorLayout === 'function') {
- errorLayout = errorLayout(this.context)
- }
- <% if (splitChunks.layouts) { %>
- await this.loadLayout(errorLayout)
- <% } %>
- this.setLayout(errorLayout)
- }
- },
- <% if (features.layouts) { %>
- <% if (splitChunks.layouts) { %>
- setLayout (layout) {
- <% if (debug) { %>
- if(layout && typeof layout !== 'string') {
- throw new Error('[nuxt] Avoid using non-string value as layout property.')
- }
- <% } %>
- if (!layout || !resolvedLayouts['_' + layout]) {
- layout = 'default'
- }
- this.layoutName = layout
- let _layout = '_' + layout
- this.layout = resolvedLayouts[_layout]
- return this.layout
- },
- loadLayout (layout) {
- const undef = !layout
- const nonexistent = !(layouts['_' + layout] || resolvedLayouts['_' + layout])
- let _layout = '_' + ((undef || nonexistent) ? 'default' : layout)
- if (resolvedLayouts[_layout]) {
- return Promise.resolve(resolvedLayouts[_layout])
- }
- return layouts[_layout]()
- .then((Component) => {
- resolvedLayouts[_layout] = Component
- delete layouts[_layout]
- return resolvedLayouts[_layout]
- })
- .catch((e) => {
- if (this.<%= globals.nuxt %>) {
- return this.<%= globals.nuxt %>.error({ statusCode: 500, message: e.message })
- }
- })
- },
- <% } else { %>
- setLayout (layout) {
- <% if (debug) { %>
- if(layout && typeof layout !== 'string') {
- throw new Error('[nuxt] Avoid using non-string value as layout property.')
- }
- <% } %>
- if (!layout || !layouts['_' + layout]) {
- layout = 'default'
- }
- this.layoutName = layout
- this.layout = layouts['_' + layout]
- return this.layout
- },
- loadLayout (layout) {
- if (!layout || !layouts['_' + layout]) {
- layout = 'default'
- }
- return Promise.resolve(layouts['_' + layout])
- },
- <% } /* splitChunks.layouts */ %>
- <% } /* features.layouts */ %>
- <% if (isFullStatic) { %>
- getRouterBase() {
- return withoutTrailingSlash(this.$router.options.base)
- },
- getRoutePath(route = '/') {
- const base = this.getRouterBase()
- return withoutTrailingSlash(withoutBase(parsePath(route).pathname, base))
- },
- getStaticAssetsPath(route = '/') {
- const { staticAssetsBase } = window.<%= globals.context %>
- return urlJoin(staticAssetsBase, this.getRoutePath(route))
- },
- <% if (nuxtOptions.generate.manifest) { %>
- async fetchStaticManifest() {
- return window.__NUXT_IMPORT__('manifest.js', normalizeURL(urlJoin(this.getStaticAssetsPath(), 'manifest.js')))
- },
- <% } %>
- setPagePayload(payload) {
- this._pagePayload = payload
- this._fetchCounters = {}
- },
- async fetchPayload(route, prefetch) {
- const path = decode(this.getRoutePath(route))
- <% if (nuxtOptions.generate.manifest) { %>
- const manifest = await this.fetchStaticManifest()
- if (!manifest.routes.includes(path)) {
- if (!prefetch) { this.setPagePayload(false) }
- throw new Error(`Route ${path} is not pre-rendered`)
- }
- <% } %>
- const src = urlJoin(this.getStaticAssetsPath(route), 'payload.js')
- try {
- const payload = await window.__NUXT_IMPORT__(path, normalizeURL(src))
- if (!prefetch) { this.setPagePayload(payload) }
- return payload
- } catch (err) {
- if (!prefetch) { this.setPagePayload(false) }
- throw err
- }
- }
- <% } %>
- },
- <% if (loading) { %>
- components: {
- NuxtLoading
- }
- <% } %>
- <%= isTest ? '/* eslint-enable comma-dangle */' : '' %>
- }
|