Bypass webpack compilation for precompiled @next/polyfills-nomodule (#27596)
Removes the extra webpack handling that was previously done, this ensures the file which is already minified and compiled does not get passed through minification again. Largely based on #21418 Closes #21418 The polyfill loading already has tests so no other changes are necessary. ## Bug - [ ] Related issues linked using `fixes #number` - [ ] Integration tests added - [ ] Errors have helpful link attached, see `contributing.md` ## Feature - [ ] Implements an existing feature request or RFC. Make sure the feature request has been accepted for implementation before opening a PR. - [ ] Related issues linked using `fixes #number` - [ ] Integration tests added - [ ] Documentation added - [ ] Telemetry added. In case of a feature if it's used or not. - [ ] Errors have helpful link attached, see `contributing.md` ## Documentation / Examples - [ ] Make sure the linting passes
This commit is contained in:
parent
daadfd347f
commit
eddf2054c2
5 changed files with 123 additions and 12 deletions
|
@ -19,7 +19,7 @@ import { getTypeScriptConfiguration } from '../lib/typescript/getTypeScriptConfi
|
|||
import {
|
||||
CLIENT_STATIC_FILES_RUNTIME_AMP,
|
||||
CLIENT_STATIC_FILES_RUNTIME_MAIN,
|
||||
CLIENT_STATIC_FILES_RUNTIME_POLYFILLS,
|
||||
CLIENT_STATIC_FILES_RUNTIME_POLYFILLS_SYMBOL,
|
||||
CLIENT_STATIC_FILES_RUNTIME_REACT_REFRESH,
|
||||
CLIENT_STATIC_FILES_RUNTIME_WEBPACK,
|
||||
REACT_LOADABLE_MANIFEST,
|
||||
|
@ -52,6 +52,7 @@ import WebpackConformancePlugin, {
|
|||
} from './webpack/plugins/webpack-conformance-plugin'
|
||||
import { WellKnownErrorsPlugin } from './webpack/plugins/wellknown-errors-plugin'
|
||||
import { regexLikeCss } from './webpack/config/blocks/css'
|
||||
import { CopyFilePlugin } from './webpack/plugins/copy-file-plugin'
|
||||
|
||||
type ExcludesFalse = <T>(x: T | false) => x is T
|
||||
|
||||
|
@ -378,10 +379,6 @@ export default async function getBaseWebpackConfig(
|
|||
)
|
||||
)
|
||||
.replace(/\\/g, '/'),
|
||||
[CLIENT_STATIC_FILES_RUNTIME_POLYFILLS]: path.join(
|
||||
NEXT_PROJECT_ROOT_DIST_CLIENT,
|
||||
'polyfills.js'
|
||||
),
|
||||
} as ClientEntries)
|
||||
: undefined
|
||||
|
||||
|
@ -1343,6 +1340,18 @@ export default async function getBaseWebpackConfig(
|
|||
].filter(Boolean),
|
||||
}),
|
||||
new WellKnownErrorsPlugin(),
|
||||
!isServer &&
|
||||
new CopyFilePlugin({
|
||||
filePath: require.resolve('./polyfills/polyfill-nomodule'),
|
||||
cacheKey: process.env.__NEXT_VERSION as string,
|
||||
name: `static/chunks/polyfills${dev ? '' : '-[hash]'}.js`,
|
||||
minimize: false,
|
||||
info: {
|
||||
[CLIENT_STATIC_FILES_RUNTIME_POLYFILLS_SYMBOL]: 1,
|
||||
// This file is already minified
|
||||
minimized: true,
|
||||
},
|
||||
}),
|
||||
].filter((Boolean as any) as ExcludesFalse),
|
||||
}
|
||||
|
||||
|
|
|
@ -8,7 +8,7 @@ import {
|
|||
BUILD_MANIFEST,
|
||||
CLIENT_STATIC_FILES_PATH,
|
||||
CLIENT_STATIC_FILES_RUNTIME_MAIN,
|
||||
CLIENT_STATIC_FILES_RUNTIME_POLYFILLS,
|
||||
CLIENT_STATIC_FILES_RUNTIME_POLYFILLS_SYMBOL,
|
||||
CLIENT_STATIC_FILES_RUNTIME_REACT_REFRESH,
|
||||
CLIENT_STATIC_FILES_RUNTIME_AMP,
|
||||
} from '../../../shared/lib/constants'
|
||||
|
@ -146,9 +146,24 @@ export default class BuildManifestPlugin {
|
|||
getEntrypointFiles(entrypoints.get(CLIENT_STATIC_FILES_RUNTIME_MAIN))
|
||||
)
|
||||
|
||||
assetMap.polyfillFiles = getEntrypointFiles(
|
||||
entrypoints.get(CLIENT_STATIC_FILES_RUNTIME_POLYFILLS)
|
||||
).filter((file) => !mainFiles.has(file))
|
||||
const compilationAssets: {
|
||||
name: string
|
||||
source: typeof sources.RawSource
|
||||
info: object
|
||||
}[] = compilation.getAssets()
|
||||
|
||||
assetMap.polyfillFiles = compilationAssets
|
||||
.filter((p) => {
|
||||
// Ensure only .js files are passed through
|
||||
if (!p.name.endsWith('.js')) {
|
||||
return false
|
||||
}
|
||||
|
||||
return (
|
||||
p.info && CLIENT_STATIC_FILES_RUNTIME_POLYFILLS_SYMBOL in p.info
|
||||
)
|
||||
})
|
||||
.map((v) => v.name)
|
||||
|
||||
assetMap.devFiles = getEntrypointFiles(
|
||||
entrypoints.get(CLIENT_STATIC_FILES_RUNTIME_REACT_REFRESH)
|
||||
|
@ -160,7 +175,6 @@ export default class BuildManifestPlugin {
|
|||
|
||||
const systemEntrypoints = new Set([
|
||||
CLIENT_STATIC_FILES_RUNTIME_MAIN,
|
||||
CLIENT_STATIC_FILES_RUNTIME_POLYFILLS,
|
||||
CLIENT_STATIC_FILES_RUNTIME_REACT_REFRESH,
|
||||
CLIENT_STATIC_FILES_RUNTIME_AMP,
|
||||
])
|
||||
|
|
89
packages/next/build/webpack/plugins/copy-file-plugin.ts
Normal file
89
packages/next/build/webpack/plugins/copy-file-plugin.ts
Normal file
|
@ -0,0 +1,89 @@
|
|||
import { promises as fs } from 'fs'
|
||||
import loaderUtils from 'next/dist/compiled/loader-utils'
|
||||
import {
|
||||
isWebpack5,
|
||||
sources,
|
||||
webpack,
|
||||
} from 'next/dist/compiled/webpack/webpack'
|
||||
|
||||
const PLUGIN_NAME = 'CopyFilePlugin'
|
||||
|
||||
export class CopyFilePlugin {
|
||||
private filePath: string
|
||||
private name: string
|
||||
private cacheKey: string
|
||||
private info?: object
|
||||
|
||||
constructor({
|
||||
filePath,
|
||||
cacheKey,
|
||||
name,
|
||||
info,
|
||||
}: {
|
||||
filePath: string
|
||||
cacheKey: string
|
||||
name: string
|
||||
minimize: boolean
|
||||
info?: object
|
||||
}) {
|
||||
this.filePath = filePath
|
||||
this.cacheKey = cacheKey
|
||||
this.name = name
|
||||
this.info = info
|
||||
}
|
||||
|
||||
apply(compiler: webpack.Compiler) {
|
||||
compiler.hooks.thisCompilation.tap(PLUGIN_NAME, (compilation: any) => {
|
||||
const cache = isWebpack5 ? compilation.getCache('CopyFilePlugin') : null
|
||||
const hook = isWebpack5
|
||||
? // @ts-ignore
|
||||
compilation.hooks.processAssets
|
||||
: compilation.hooks.additionalAssets
|
||||
hook.tapPromise(
|
||||
isWebpack5
|
||||
? {
|
||||
name: PLUGIN_NAME,
|
||||
// @ts-ignore TODO: Remove ignore when webpack 5 is stable
|
||||
stage: webpack.Compilation.PROCESS_ASSETS_STAGE_ADDITIONS,
|
||||
}
|
||||
: PLUGIN_NAME,
|
||||
async () => {
|
||||
if (cache) {
|
||||
const cachedResult = await cache.getPromise(
|
||||
this.filePath,
|
||||
this.cacheKey
|
||||
)
|
||||
if (cachedResult) {
|
||||
const { file, source } = cachedResult
|
||||
compilation.emitAsset(file, source, {
|
||||
...this.info,
|
||||
})
|
||||
return
|
||||
}
|
||||
}
|
||||
const content = await fs.readFile(this.filePath, 'utf8')
|
||||
|
||||
const file = loaderUtils.interpolateName(
|
||||
{ resourcePath: this.filePath },
|
||||
this.name,
|
||||
{ content, context: compiler.context }
|
||||
)
|
||||
|
||||
const source = new sources.RawSource(content)
|
||||
|
||||
if (cache) {
|
||||
await cache.storePromise(this.filePath, this.cacheKey, {
|
||||
file,
|
||||
source,
|
||||
})
|
||||
}
|
||||
|
||||
// @ts-ignore
|
||||
compilation.emitAsset(file, source, {
|
||||
...this.info,
|
||||
})
|
||||
}
|
||||
)
|
||||
})
|
||||
}
|
||||
}
|
|
@ -1 +0,0 @@
|
|||
import 'next/dist/build/polyfills/polyfill-nomodule'
|
|
@ -32,7 +32,7 @@ export const CLIENT_STATIC_FILES_RUNTIME_AMP = `amp`
|
|||
// static/runtime/webpack.js
|
||||
export const CLIENT_STATIC_FILES_RUNTIME_WEBPACK = `webpack`
|
||||
// static/runtime/polyfills.js
|
||||
export const CLIENT_STATIC_FILES_RUNTIME_POLYFILLS = `polyfills`
|
||||
export const CLIENT_STATIC_FILES_RUNTIME_POLYFILLS_SYMBOL = Symbol(`polyfills`)
|
||||
export const TEMPORARY_REDIRECT_STATUS = 307
|
||||
export const PERMANENT_REDIRECT_STATUS = 308
|
||||
export const STATIC_PROPS_ID = '__N_SSG'
|
||||
|
|
Loading…
Reference in a new issue