Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

fix(nextjs): Fix HMR by inserting new entrypoints at the end #9267

Merged
merged 4 commits into from
Oct 17, 2023
Merged
Changes from 2 commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
21 changes: 13 additions & 8 deletions packages/nextjs/src/config/webpack.ts
Original file line number Diff line number Diff line change
Expand Up @@ -482,7 +482,7 @@ async function addSentryToEntryProperty(
// we know is that it won't have gotten *simpler* in form, so we only need to worry about the object and function
// options. See https://webpack.js.org/configuration/entry-context/#entry.

const { isServer, dir: projectDir, nextRuntime } = buildContext;
const { isServer, dir: projectDir, nextRuntime, dev: isDevMode } = buildContext;
const runtime = isServer ? (buildContext.nextRuntime === 'edge' ? 'edge' : 'node') : 'browser';

const newEntryProperty =
Expand All @@ -502,7 +502,7 @@ async function addSentryToEntryProperty(
// inject into all entry points which might contain user's code
for (const entryPointName in newEntryProperty) {
if (shouldAddSentryToEntryPoint(entryPointName, runtime)) {
addFilesToExistingEntryPoint(newEntryProperty, entryPointName, filesToInject);
addFilesToExistingEntryPoint(newEntryProperty, entryPointName, filesToInject, isDevMode);
} else {
if (
isServer &&
Expand Down Expand Up @@ -570,31 +570,36 @@ export function getUserConfigFilePath(projectDir: string, platform: 'server' | '
*
* @param entryProperty The existing `entry` config object
* @param entryPointName The key where the file should be injected
* @param filepaths An array of paths to the injected files
* @param filesToInsert An array of paths to the injected files
*/
function addFilesToExistingEntryPoint(
entryProperty: EntryPropertyObject,
entryPointName: string,
filepaths: string[],
filesToInsert: string[],
isDevMode: boolean,
): void {
// BIG FAT NOTE: Order of insertion seems to matter here. If we insert the new files before the `currentEntrypoint`s, the Next.js dev server breaks.
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

image


// can be a string, array of strings, or object whose `import` property is one of those two
const currentEntryPoint = entryProperty[entryPointName];
let newEntryPoint = currentEntryPoint;

if (typeof currentEntryPoint === 'string') {
newEntryPoint = [...filepaths, currentEntryPoint];
newEntryPoint = isDevMode ? [currentEntryPoint, ...filesToInsert] : [...filesToInsert, currentEntryPoint];
} else if (Array.isArray(currentEntryPoint)) {
newEntryPoint = [...filepaths, ...currentEntryPoint];
newEntryPoint = isDevMode ? [...currentEntryPoint, ...filesToInsert] : [...filesToInsert, ...currentEntryPoint];
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

l: took me a while to understand the cases and object spreads here. Not sure how much we can simplify this but do you think it'd help to use our arrayify utility to basically remove the typeof checks? Although then again I'm not sure what types currentEntryPoint could be of. Feel free to disregard!

}
// descriptor object (webpack 5+)
else if (typeof currentEntryPoint === 'object' && 'import' in currentEntryPoint) {
const currentImportValue = currentEntryPoint.import;
let newImportValue;

if (typeof currentImportValue === 'string') {
newImportValue = [...filepaths, currentImportValue];
newImportValue = isDevMode ? [currentImportValue, ...filesToInsert] : [...filesToInsert, currentImportValue];
} else {
newImportValue = [...filepaths, ...currentImportValue];
newImportValue = isDevMode
? [...currentImportValue, ...filesToInsert]
: [...filesToInsert, ...currentImportValue];
}

newEntryPoint = {
Expand Down