@nuxt/vue-app - npm Package Compare versions

Comparing version 2.14.12 to 2.15.0

dist/vue-app.js

 /*!
- * @nuxt/vue-app v2.14.12 (c) 2016-2020
-
- * - All the amazing contributors
- * Released under the MIT License.
+ * @nuxt/vue-app v2.15.0 (c) 2016-2021
+ * Released under the MIT License
+ * Repository: https://github.com/nuxt/nuxt.js
  * Website: https://nuxtjs.org
@@ -19,4 +18,4 @@ */
 var dependencies = {
-	"@nuxt/ufo": "^0.5.0",
 	"node-fetch": "^2.6.1",
+	ufo: "^0.6.6",
 	unfetch: "^4.2.0",
@@ -27,5 +26,5 @@ vue: "^2.6.12",
 	"vue-no-ssr": "^1.1.1",
-	"vue-router": "^3.4.9",
+	"vue-router": "^3.5.1",
 	"vue-template-compiler": "^2.6.12",
-	vuex: "^3.6.0"
+	vuex: "^3.6.2"
 };
@@ -32,0 +31,0 @@

index.d.ts

 // Dummy type definition file to provide backward compatibility
 // around Nuxt modules extending `@nuxt/vue-app` for Nuxt < 2.9
-declare module "@nuxt/vue-app"
+declare module '@nuxt/vue-app'

package.json

 {
   "name": "@nuxt/vue-app",
-  "version": "2.14.12",
+  "version": "2.15.0",
   "repository": "nuxt/nuxt.js",
@@ -16,4 +16,4 @@ "license": "MIT",
   "dependencies": {
-    "@nuxt/ufo": "^0.5.0",
     "node-fetch": "^2.6.1",
+    "ufo": "^0.6.6",
     "unfetch": "^4.2.0",
@@ -24,5 +24,5 @@ "vue": "^2.6.12",
     "vue-no-ssr": "^1.1.1",
-    "vue-router": "^3.4.9",
+    "vue-router": "^3.5.1",
     "vue-template-compiler": "^2.6.12",
-    "vuex": "^3.6.0"
+    "vuex": "^3.6.2"
   },
@@ -29,0 +29,0 @@ "publishConfig": {

template/App.js

 import Vue from 'vue'
+import { decode, parsePath, withoutBase, withoutTrailingSlash, normalizeURL } from 'ufo'
 <% utilsImports = [
@@ -299,10 +300,7 @@ ...(features.asyncData || features.fetch) ? [
     getRouterBase() {
-      return (this.$router.options.base || '').replace(/\/+$/, '')
+      return withoutTrailingSlash(this.$router.options.base)
     },
     getRoutePath(route = '/') {
       const base = this.getRouterBase()
-      if (base && route.startsWith(base)) {
-        route = route.substr(base.length)
-      }
-      return (route.replace(/\/+$/, '') || '/').split('?')[0].split('#')[0]
+      return withoutTrailingSlash(withoutBase(parsePath(route).pathname, base))
     },
@@ -316,3 +314,3 @@ getStaticAssetsPath(route = '/') {
       async fetchStaticManifest() {
-      return window.__NUXT_IMPORT__('manifest.js', encodeURI(urlJoin(this.getStaticAssetsPath(), 'manifest.js')))
+      return window.__NUXT_IMPORT__('manifest.js', normalizeURL(urlJoin(this.getStaticAssetsPath(), 'manifest.js')))
     },
@@ -322,10 +320,10 @@ <% } %>
       this._pagePayload = payload
-      this._payloadFetchIndex = 0
+      this._fetchCounters = {}
     },
-    async fetchPayload(route) {
+    async fetchPayload(route, prefetch) {
+      const path = decode(this.getRoutePath(route))
       <% if (nuxtOptions.generate.manifest) { %>
       const manifest = await this.fetchStaticManifest()
-      const path = this.getRoutePath(route)
       if (!manifest.routes.includes(path)) {
-        this.setPagePayload(false)
+        if (!prefetch) { this.setPagePayload(false) }
         throw new Error(`Route ${path} is not pre-rendered`)
@@ -336,7 +334,7 @@ }
       try {
-        const payload = await window.__NUXT_IMPORT__(decodeURI(route), encodeURI(src))
-        this.setPagePayload(payload)
+        const payload = await window.__NUXT_IMPORT__(path, normalizeURL(src))
+        if (!prefetch) { this.setPagePayload(payload) }
         return payload
       } catch (err) {
-        this.setPagePayload(false)
+        if (!prefetch) { this.setPagePayload(false) }
         throw err
@@ -343,0 +341,0 @@ }

template/client.js

@@ -18,3 +18,4 @@ import Vue from 'vue'
   globalHandleError,
-  isSamePath
+  isSamePath,
+  urlJoin
 } from './utils.js'
@@ -24,4 +25,6 @@ import { createApp<% if (features.layouts) { %>, NuxtError<% } %> } from './index.js'
 import NuxtLink from './components/nuxt-link.<%= features.clientPrefetch ? "client" : "server" %>.js' // should be included after ./index.js
-<% if (isFullStatic) { %>import './jsonp'<% } %>
+<% if (isFullStatic) { %>import { installJsonp } from './jsonp'<% } %>
 
+<% if (isFullStatic) { %>installJsonp()<% } %>
+
 <% if (features.fetch) { %>
@@ -50,2 +53,7 @@ // Fetch mixin
 
+const $config = NUXT.config || {}
+if ($config.app) {
+  __webpack_public_path__ = urlJoin($config.app.cdnURL, $config.app.assetsPath)
+}
+
 Object.assign(Vue.config, <%= serialize(vue.config) %>)<%= isTest ? '// eslint-disable-line' : '' %>
@@ -52,0 +60,0 @@

template/components/nuxt-link.client.js

@@ -20,3 +20,3 @@ import Vue from 'vue'
   entries.forEach(({ intersectionRatio, target: link }) => {
-    if (intersectionRatio <= 0) {
+    if (intersectionRatio <= 0 || !link.__prefetch) {
       return
@@ -116,3 +116,3 @@ }
         if (this.<%= globals.nuxt %>)
-          this.<%= globals.nuxt %>.fetchPayload(href).catch(() => {})
+          this.<%= globals.nuxt %>.fetchPayload(href, true).catch(() => {})
       }
@@ -119,0 +119,0 @@ <% } %>

template/index.js

@@ -79,6 +79,10 @@ import Vue from 'vue'
 const originalRegisterModule = Vuex.Store.prototype.registerModule
-const baseStoreOptions = { preserveState: process.client }
 
 function registerModule (path, rawModule, options = {}) {
-  return originalRegisterModule.call(this, path, rawModule, { ...baseStoreOptions, ...options })
+  const preserveState = process.client && (
+    Array.isArray(path)
+      ? !!path.reduce((namespacedState, path) => namespacedState && namespacedState[path], this.state)
+      : path in this.state
+  )
+  return originalRegisterModule.call(this, path, rawModule, { preserveState, ...options })
 }
@@ -88,3 +92,3 @@ <% } %>
 async function createApp(ssrContext, config = {}) {
-  const router = await createRouter(ssrContext)
+  const router = await createRouter(ssrContext, config)
 
@@ -91,0 +95,0 @@ <% if (store) { %>

template/jsonp.js

@@ -78,4 +78,7 @@ const chunks = {} // chunkId => exports
 
-window.__NUXT_JSONP__ = function (chunkId, exports) { chunks[chunkId] = exports }
-window.__NUXT_JSONP_CACHE__ = chunks
-window.__NUXT_IMPORT__ = importChunk
+export function installJsonp() {
+  window.__NUXT_JSONP__ = function (chunkId, exports) { chunks[chunkId] = exports }
+  window.__NUXT_JSONP_CACHE__ = chunks
+  window.__NUXT_IMPORT__ = importChunk
+}
+

template/mixins/fetch.client.js

 import Vue from 'vue'
-import { hasFetch, normalizeError, addLifecycleHook } from '../utils'
+import { hasFetch, normalizeError, addLifecycleHook, createGetCounter } from '../utils'
 
@@ -41,3 +41,3 @@ const isSsrHydration = (vm) => vm.$vnode && vm.$vnode.elm && vm.$vnode.elm.dataset && vm.$vnode.elm.dataset.fetchKey
   this._hydrated = true
-  this._fetchKey = +this.$vnode.elm.dataset.fetchKey
+  this._fetchKey = this.$vnode.elm.dataset.fetchKey
   const data = nuxtState.fetch[this._fetchKey]
@@ -68,3 +68,13 @@
   this._hydrated = true
-  this._fetchKey = this.<%= globals.nuxt %>._payloadFetchIndex++
+
+  const defaultKey = this.$options._scopeId || this.$options.name || ''
+  const getCounter = createGetCounter(this.<%= globals.nuxt %>._fetchCounters, defaultKey)
+
+  if (typeof this.$options.fetchKey === 'function') {
+    this._fetchKey = this.$options.fetchKey.call(this, getCounter)
+  } else {
+    const key = 'string' === typeof this.$options.fetchKey ? this.$options.fetchKey : defaultKey
+    this._fetchKey = key ? key + ':' + getCounter(key) : String(getCounter(key))
+  }
+
   const data = this.<%= globals.nuxt %>._pagePayload.fetch[this._fetchKey]
@@ -71,0 +81,0 @@

template/mixins/fetch.server.js

 import Vue from 'vue'
-import { hasFetch, normalizeError, addLifecycleHook, purifyData } from '../utils'
+import { hasFetch, normalizeError, addLifecycleHook, purifyData, createGetCounter } from '../utils'
 
@@ -22,3 +22,3 @@ async function serverPrefetch() {
   // Define an ssrKey for hydration
-  this._fetchKey = this.$ssrContext.nuxt.fetch.length
+  this._fetchKey = this._fetchKey || this.$ssrContext.fetchCounters['']++
 
@@ -30,3 +30,9 @@ // Add data-fetch-key on parent element of Component
   // Add to ssrContext for window.__NUXT__.fetch
-  this.$ssrContext.nuxt.fetch.push(this.$fetchState.error ? { _error: this.$fetchState.error } : purifyData(this._data))
+  <% if (debug) { %>
+  if (this.$ssrContext.nuxt.fetch[this._fetchKey] !== undefined) {
+    console.warn(`Duplicate fetch key detected (${this._fetchKey}). This may lead to unexpected results.`)
+  }
+  <% } %>
+  this.$ssrContext.nuxt.fetch[this._fetchKey] =
+    this.$fetchState.error ? { _error: this.$fetchState.error } : purifyData(this._data)
 }
@@ -46,2 +52,12 @@
 
+    const defaultKey = this.$options._scopeId || this.$options.name || ''
+    const getCounter = createGetCounter(this.$ssrContext.fetchCounters, defaultKey)
+
+    if (typeof this.$options.fetchKey === 'function') {
+      this._fetchKey = this.$options.fetchKey.call(this, getCounter)
+    } else {
+      const key = 'string' === typeof this.$options.fetchKey ? this.$options.fetchKey : defaultKey
+      this._fetchKey = key ? key + ':' + getCounter(key) : String(getCounter(key))
+    }
+
     // Added for remove vue undefined warning while ssr
@@ -48,0 +64,0 @@ this.$fetch = () => {} // issue #8043

template/router.js

 import Vue from 'vue'
 import Router from 'vue-router'
-import { normalizeURL, decode } from '@nuxt/ufo'
+import { normalizeURL, decode } from 'ufo'
 import { interopDefault } from './utils'<%= isTest ? '// eslint-disable-line no-unused-vars' : '' %>
@@ -86,8 +86,3 @@ import scrollBehavior from './router.scrollBehavior.js'
 
-// TODO: remove in Nuxt 3
 const emptyFn = () => {}
-const originalPush = Router.prototype.push
-Router.prototype.push = function push (location, onComplete = emptyFn, onAbort) {
-  return originalPush.call(this, location, onComplete, onAbort)
-}
 
@@ -110,13 +105,12 @@ Vue.use(Router)
 
-function decodeObj(obj) {
-  for (const key in obj) {
-    if (typeof obj[key] === 'string') {
-      obj[key] = decode(obj[key])
-    }
+export function createRouter (ssrContext, config) {
+  const base = (config.app && config.app.basePath) || routerOptions.base
+  const router = new Router({ ...routerOptions, base  })
+
+  // TODO: remove in Nuxt 3
+  const originalPush = router.push
+  router.push = function push (location, onComplete = emptyFn, onAbort) {
+    return originalPush.call(this, location, onComplete, onAbort)
   }
-}
 
-export function createRouter () {
-  const router = new Router(routerOptions)
-
   const resolve = router.resolve.bind(router)
@@ -127,7 +121,3 @@ router.resolve = (to, current, append) => {
     }
-    const r = resolve(to, current, append)
-    if (r && r.resolved && r.resolved.query) {
-      decodeObj(r.resolved.query)
-    }
-    return r
+    return resolve(to, current, append)
   }
@@ -134,0 +124,0 @@

template/router.scrollBehavior.js

@@ -25,21 +25,21 @@ <% if (router.scrollBehavior) { %>
 
+function shouldScrollToTop(route) {
+   const Pages = getMatchedComponents(route)
+   if (Pages.length === 1) {
+     const { options = {} } = Pages[0]
+     return options.scrollToTop !== false
+   }
+   return Pages.some(({ options }) => options && options.scrollToTop)
+}
+
 export default function (to, from, savedPosition) {
   // If the returned position is falsy or an empty object, will retain current scroll position
   let position = false
+  const isRouteChanged = to !== from
 
-  const Pages = getMatchedComponents(to)
-
-  // Scroll to the top of the page if...
-  if (
-      // One of the children set `scrollToTop`
-      Pages.some(Page => Page.options.scrollToTop) ||
-      // scrollToTop set in only page without children
-      (Pages.length < 2 && Pages.every(Page => Page.options.scrollToTop !== false))
-  ) {
-    position = { x: 0, y: 0 }
-  }
-
   // savedPosition is only available for popstate navigations (back button)
   if (savedPosition) {
     position = savedPosition
+  } else if (isRouteChanged && shouldScrollToTop(to)) {
+    position = { x: 0, y: 0 }
   }
@@ -50,6 +50,6 @@
   if (
+    // Initial load (vuejs/vue-router#3199)
+    !isRouteChanged ||
     // Route hash changes
-    (to.path === from.path && to.hash !== from.hash) ||
-    // Initial load (vuejs/vue-router#3199)
-    to === from
+    (to.path === from.path && to.hash !== from.hash)
   ) {
@@ -56,0 +56,0 @@ nuxt.$nextTick(() => nuxt.$emit('triggerScroll'))

template/server.js

@@ -1,4 +0,3 @@
-import { stringify } from 'querystring'
 import Vue from 'vue'
-import { normalizeURL } from '@nuxt/ufo'
+import { joinURL, normalizeURL, withQuery } from 'ufo'
 <% if (fetch.server) { %>import fetch from 'node-fetch'<% } %>
@@ -28,2 +27,20 @@ <% if (features.middleware) { %>import middleware from './middleware.js'<% } %>
 
+<% if (isDev) { %>
+if (!Vue.__original_use__) {
+  Vue.__original_use__ = Vue.use
+  Vue.__install_times__ = 0
+  Vue.use = function (plugin, ...args) {
+    plugin.__nuxt_external_installed__ = Vue._installedPlugins.includes(plugin)
+    return Vue.__original_use__(plugin, ...args)
+  }
+}
+if (Vue.__install_times__ === 2) {
+  Vue.__install_times__ = 0
+  Vue._installedPlugins = Vue._installedPlugins.filter(plugin => {
+    return plugin.__nuxt_external_installed__ === true
+  })
+}
+Vue.__install_times__++
+<% } %>
+
 // Component: <NuxtLink>
@@ -35,8 +52,4 @@ Vue.component(NuxtLink.name, NuxtLink)
 
-const noopApp = () => new Vue({ render: h => h('div') })
+const noopApp = () => new Vue({ render: h => h('div', { domProps: { id: '<%= globals.id %>' } }) })
 
-function urlJoin () {
-  return Array.prototype.slice.call(arguments).join('/').replace(/\/+/g, '/')
-}
-
 const createNext = ssrContext => (opts) => {
@@ -49,10 +62,10 @@ // If static target, render on client-side
   }
-  opts.query = stringify(opts.query)
-  opts.path = opts.path + (opts.query ? '?' + opts.query : '')
-  const routerBase = '<%= router.base %>'
-  if (!opts.path.startsWith('http') && (routerBase !== '/' && !opts.path.startsWith(routerBase))) {
-    opts.path = urlJoin(routerBase, opts.path)
+  let fullPath = withQuery(opts.path, opts.query)
+  const $config = ssrContext.runtimeConfig || {}
+  const routerBase = ($config.app && $config.app.basePath) || '<%= router.base %>'
+  if (!fullPath.startsWith('http') && (routerBase !== '/' && !fullPath.startsWith(routerBase))) {
+    fullPath = joinURL(routerBase, fullPath)
   }
   // Avoid loop redirect
-  if (decodeURI(opts.path) === decodeURI(ssrContext.url)) {
+  if (decodeURI(fullPath) === decodeURI(ssrContext.url)) {
     ssrContext.redirected = false
@@ -62,3 +75,3 @@ return
   ssrContext.res.writeHead(opts.status, {
-    Location: normalizeURL(opts.path)
+    Location: normalizeURL(fullPath)
   })
@@ -80,9 +93,18 @@ ssrContext.res.end()
   // Nuxt object (window.{{globals.context}}, defaults to window.__NUXT__)
-  ssrContext.nuxt = { <% if (features.layouts) { %>layout: 'default', <% } %>data: [], <% if (features.fetch) { %>fetch: [], <% } %>error: null<%= (store ? ', state: null' : '') %>, serverRendered: true, routePath: '' }
+  ssrContext.nuxt = { <% if (features.layouts) { %>layout: 'default', <% } %>data: [], <% if (features.fetch) { %>fetch: {}, <% } %>error: null<%= (store ? ', state: null' : '') %>, serverRendered: true, routePath: '' }
+  <% if (features.fetch) { %>
+    ssrContext.fetchCounters = {}
+  <% } %>
+
   // Remove query from url is static target
-  if (process.static && ssrContext.url) {
+  <% if (isFullStatic) { %>
+  if (ssrContext.url) {
     ssrContext.url = ssrContext.url.split('?')[0]
   }
+  <% } %>
   // Public runtime config
   ssrContext.nuxt.config = ssrContext.runtimeConfig.public
+  if (ssrContext.nuxt.config.app) {
+    __webpack_public_path__ = joinURL(ssrContext.nuxt.config.app.cdnURL, ssrContext.nuxt.config.app.assetsPath)
+  }
   // Create the app definition and the instance (created for each request)
@@ -89,0 +111,0 @@ const { app, router<%= (store ? ', store' : '') %> } = await createApp(ssrContext, { ...ssrContext.runtimeConfig.public, ...ssrContext.runtimeConfig.private })

template/utils.js

 import Vue from 'vue'
-import { normalizeURL } from '@nuxt/ufo'
+import { isSamePath as _isSamePath, joinURL, normalizeURL, withQuery, withoutTrailingSlash } from 'ufo'
 
@@ -13,2 +13,11 @@ // window.{{globals.loadedCallback}} hook
 
+export function createGetCounter (counterObject, defaultKey = '') {
+  return function getCounter (id = defaultKey) {
+    if (counterObject[id] === undefined) {
+      counterObject[id] = 0
+    }
+    return counterObject[id]++
+  }
+}
+
 export function empty () {}
@@ -175,12 +184,14 @@
       error: context.error,
-      base: '<%= router.base %>',
+      base: app.router.options.base,
       env: <%= JSON.stringify(env) %><%= isTest ? '// eslint-disable-line' : '' %>
     }
     // Only set once
-    if (!process.static && context.req) {
+    <% if (!isFullStatic) { %>
+    if (context.req) {
       app.context.req = context.req
     }
-    if (!process.static && context.res) {
+    if (context.res) {
       app.context.res = context.res
     }
+    <% } %>
     if (context.ssrContext) {
@@ -213,3 +224,3 @@ app.context.ssrContext = context.ssrContext
       } else {
-        path = formatUrl(path, query)
+        path = withQuery(path, query)
         if (process.server) {
@@ -589,82 +600,2 @@ app.context.next({
 
-/**
- * Format given url, append query to url query string
- *
- * @param  {string} url
- * @param  {string} query
- * @return {string}
- */
-function formatUrl (url, query) {
-  <% if (features.clientUseUrl) { %>
-  url = new URL(url, top.location.href)
-  for (const key in query) {
-    const value = query[key]
-    if (value == null) {
-      continue
-    }
-    if (Array.isArray(value)) {
-      for (const arrayValue of value) {
-        url.searchParams.append(key, arrayValue)
-      }
-      continue
-    }
-    url.searchParams.append(key, value)
-  }
-  url.searchParams.sort()
-  return url.toString()
-  <% } else { %>
-  let protocol
-  const index = url.indexOf('://')
-  if (index !== -1) {
-    protocol = url.substring(0, index)
-    url = url.substring(index + 3)
-  } else if (url.startsWith('//')) {
-    url = url.substring(2)
-  }
-
-  let parts = url.split('/')
-  let result = (protocol ? protocol + '://' : '//') + parts.shift()
-
-  let path = parts.join('/')
-  if (path === '' && parts.length === 1) {
-    result += '/'
-  }
-
-  let hash
-  parts = path.split('#')
-  if (parts.length === 2) {
-    [path, hash] = parts
-  }
-
-  result += path ? '/' + path : ''
-
-  if (query && JSON.stringify(query) !== '{}') {
-    result += (url.split('?').length === 2 ? '&' : '?') + formatQuery(query)
-  }
-  result += hash ? '#' + hash : ''
-
-  return result
-  <% } %>
-}
-<% if (!features.clientUseUrl) { %>
-/**
- * Transform data object to query string
- *
- * @param  {object} query
- * @return {string}
- */
-function formatQuery (query) {
-  return Object.keys(query).sort().map((key) => {
-    const val = query[key]
-    if (val == null) {
-      return ''
-    }
-    if (Array.isArray(val)) {
-      return val.slice().map(val2 => [key, '=', val2].join('')).join('&')
-    }
-    return key + '=' + val
-  }).filter(Boolean).join('&')
-}
-<% } %>
-
 export function addLifecycleHook(vm, hook, fn) {
@@ -679,17 +610,7 @@ if (!vm.$options[hook]) {
 
-export function urlJoin () {
-  return [].slice
-    .call(arguments)
-    .join('/')
-    .replace(/\/+/g, '/')
-    .replace(':/', '://')
-}
+export const urlJoin = joinURL
 
-export function stripTrailingSlash (path) {
-  return path.replace(/\/+$/, '') || '/'
-}
+export const stripTrailingSlash = withoutTrailingSlash
 
-export function isSamePath (p1, p2) {
-  return stripTrailingSlash(p1) === stripTrailingSlash(p2)
-}
+export const isSamePath = _isSamePath
 
@@ -696,0 +617,0 @@ export function setScrollRestoration (newVal) {

New alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Fixed alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Improved metrics

Total package byte prevSize

170412

increased by0.92%

Number of package files

45

increased by2.27%

Worsened metrics

Lines of code

3619

decreased by-0.82%

Dependency changes

• + Addedufo@^0.6.6

• + Addedufo@0.6.12(transitive)

• - Removed@nuxt/ufo@^0.5.0

• - Removed@nuxt/ufo@0.5.4(transitive)

• Updatedvue-router@^3.5.1

• Updatedvuex@^3.6.2