mirror of
https://github.com/nuxt/nuxt.git
synced 2025-02-17 06:01:34 +00:00
feat(vue-renderer): allow adding async attribute to <script>
tags (#8347)
This commit is contained in:
parent
68d8fb8487
commit
8d9d6a94d2
1
packages/types/config/render.d.ts
vendored
1
packages/types/config/render.d.ts
vendored
@ -68,6 +68,7 @@ export interface NuxtOptionsRender {
|
||||
) => string[]
|
||||
}
|
||||
injectScripts?: boolean
|
||||
asyncScripts?: boolean
|
||||
resourceHints?: boolean
|
||||
ssr?: boolean
|
||||
ssrLog?: boolean | 'collapsed'
|
||||
|
@ -51,7 +51,7 @@ export default class ModernRenderer extends SSRRenderer {
|
||||
return scripts
|
||||
}
|
||||
|
||||
const scriptPattern = /<script[^>]*?src="([^"]*?)" defer><\/script>/g
|
||||
const scriptPattern = /<script[^>]*?src="([^"]*?)" defer( async)?><\/script>/g
|
||||
|
||||
const modernScripts = scripts.replace(scriptPattern, (scriptTag, jsFile) => {
|
||||
const legacyJsFile = jsFile.replace(this.publicPath, '')
|
||||
|
@ -42,7 +42,11 @@ export default class SSRRenderer extends BaseRenderer {
|
||||
}
|
||||
|
||||
renderScripts (renderContext) {
|
||||
return this.addAttrs(renderContext.renderScripts(), 'script')
|
||||
let renderedScripts = this.addAttrs(renderContext.renderScripts(), 'script')
|
||||
if (this.options.render.asyncScripts) {
|
||||
renderedScripts = renderedScripts.replace(/defer>/g, 'defer async>')
|
||||
}
|
||||
return renderedScripts
|
||||
}
|
||||
|
||||
renderStyles (renderContext) {
|
||||
@ -190,7 +194,11 @@ export default class SSRRenderer extends BaseRenderer {
|
||||
const statePath = urlJoin(url, 'state.js')
|
||||
const stateUrl = urlJoin(staticAssetsBase, statePath)
|
||||
staticAssets.push({ path: statePath, src: stateScript })
|
||||
APP += `<script defer src="${stateUrl}"></script>`
|
||||
if (this.options.render.asyncScripts) {
|
||||
APP += `<script defer async src="${stateUrl}"></script>`
|
||||
} else {
|
||||
APP += `<script defer src="${stateUrl}"></script>`
|
||||
}
|
||||
preloadScripts.push(stateUrl)
|
||||
} else {
|
||||
APP += `<script>${stateScript}</script>`
|
||||
|
@ -414,6 +414,11 @@ describe('basic ssr', () => {
|
||||
expect(html).toContain('Auto discovered component!')
|
||||
})
|
||||
|
||||
test('/ (normal <script>)', async () => {
|
||||
const { html } = await nuxt.server.renderRoute('/')
|
||||
expect(html).toContain('" defer>')
|
||||
})
|
||||
|
||||
// Close server and ask nuxt to stop listening to file changes
|
||||
afterAll(async () => {
|
||||
await nuxt.close()
|
||||
|
@ -62,6 +62,11 @@ describe('with-config', () => {
|
||||
expect(html).toContain('<script src="/test/orion/')
|
||||
})
|
||||
|
||||
test('/ (async <script>)', async () => {
|
||||
const { html } = await nuxt.server.renderRoute('/')
|
||||
expect(html).toContain('" defer async>')
|
||||
})
|
||||
|
||||
test('/ (custom postcss.config.js)', async () => {
|
||||
const { html } = await nuxt.server.renderRoute('/')
|
||||
expect(html).toContain('::-moz-placeholder')
|
||||
|
1
test/fixtures/with-config/nuxt.config.js
vendored
1
test/fixtures/with-config/nuxt.config.js
vendored
@ -100,6 +100,7 @@ export default {
|
||||
push: true,
|
||||
shouldPush: (file, type) => type === 'script'
|
||||
},
|
||||
asyncScripts: true,
|
||||
bundleRenderer: {
|
||||
shouldPreload: (file, type) => {
|
||||
return ['script', 'style', 'font'].includes(type)
|
||||
|
Loading…
Reference in New Issue
Block a user