fix(hotfix): preload modern resource in spa modern mode (#5043)

nuxt · Feb 15, 2019 · 3516580 · 3516580
1 parent 4086800
commit 3516580
Show file tree

Hide file tree

Showing 2 changed files with 13 additions and 9 deletions.
diff --git a/packages/vue-renderer/src/spa-meta.js b/packages/vue-renderer/src/spa-meta.js
@@ -73,32 +73,36 @@ export default class SPAMetaRenderer {
 
     meta.resourceHints = ''
 
-    const { clientManifest } = this.renderer.context.resources
+    const { modernManifest, clientManifest } = this.renderer.context.resources
+    const manifest = this.options.modern ? modernManifest : clientManifest
 
     const { shouldPreload, shouldPrefetch } = this.options.render.bundleRenderer
 
-    if (this.options.render.resourceHints && clientManifest) {
-      const publicPath = clientManifest.publicPath || '/_nuxt/'
+    if (this.options.render.resourceHints && manifest) {
+      const publicPath = manifest.publicPath || '/_nuxt/'
 
       // Preload initial resources
-      if (Array.isArray(clientManifest.initial)) {
-        meta.resourceHints += clientManifest.initial
+      if (Array.isArray(manifest.initial)) {
+        const { crossorigin } = this.options.build
+        const cors = `${crossorigin ? ` crossorigin="${crossorigin}"` : ''}`
+
+        meta.resourceHints += manifest.initial
           .map(SPAMetaRenderer.normalizeFile)
           .filter(({ fileWithoutQuery, asType }) => shouldPreload(fileWithoutQuery, asType))
           .map(({ file, extension, fileWithoutQuery, asType }) => {
             let extra = ''
             if (asType === 'font') {
               extra = ` type="font/${extension}" crossorigin`
             }
-            return `<link rel="preload" href="${publicPath}${file}"${
+            return `<link rel="${this.options.modern ? 'module' : ''}preload"${cors} href="${publicPath}${file}"${
               asType !== '' ? ` as="${asType}"` : ''}${extra}>`
           })
           .join('')
       }
 
       // Prefetch async resources
-      if (Array.isArray(clientManifest.async)) {
-        meta.resourceHints += clientManifest.async
+      if (Array.isArray(manifest.async)) {
+        meta.resourceHints += manifest.async
           .map(SPAMetaRenderer.normalizeFile)
           .filter(({ fileWithoutQuery, asType }) => shouldPrefetch(fileWithoutQuery, asType))
           .map(({ file }) => `<link rel="prefetch" href="${publicPath}${file}">`)

diff --git a/test/unit/modern.spa.test.js b/test/unit/modern.spa.test.js
@@ -31,7 +31,7 @@ describe('modern client mode (SPA)', () => {
     expect(response).toContain('<script type="module" src="/_nuxt/modern-commons.app.js" crossorigin="use-credentials"')
   })
 
-  test.skip('should contain module preload resources', async () => {
+  test('should contain module preload resources', async () => {
     const response = await rp(url('/'))
     expect(response).toContain('<link rel="modulepreload" crossorigin="use-credentials" href="/_nuxt/modern-app.js" as="script">')
     expect(response).toContain('<link rel="modulepreload" crossorigin="use-credentials" href="/_nuxt/modern-commons.app.js" as="script">')