feat(blog): add file-based blog with dynamic slugs, MDX content and layout shell

- Introduced blog routing using Next.js App Router
- Implemented dynamic [slug] pages for blog posts
- Added MDX-based content loading via lib/posts
- Integrated shared TopBar layout with navigation
- Established clear content, lib and component separation
This commit is contained in:
PascalSchattenburg
2026-01-22 14:14:15 +01:00
parent b717952234
commit d147843c76
10412 changed files with 2475583 additions and 0 deletions

View File

@@ -0,0 +1,17 @@
import type { ReactNode } from 'react';
import type { HmrMessageSentToBrowser, TurbopackMessageSentToBrowser } from '../../../../server/dev/hot-reloader-types';
import { type GlobalErrorState } from '../../../components/app-router-instance';
export interface StaticIndicatorState {
pathname: string | null;
appIsrManifest: Record<string, boolean> | null;
}
export declare function waitForWebpackRuntimeHotUpdate(): Promise<void>;
export declare function performFullReload(err: any, sendMessage: (data: string) => void): void;
/** Handles messages from the server for the App Router. */
export declare function processMessage(message: HmrMessageSentToBrowser, sendMessage: (message: string) => void, processTurbopackMessage: (msg: TurbopackMessageSentToBrowser) => void, staticIndicatorState: StaticIndicatorState): void;
export default function HotReload({ children, globalError, webSocket, staticIndicatorState, }: {
children: ReactNode;
globalError: GlobalErrorState;
webSocket: WebSocket | undefined;
staticIndicatorState: StaticIndicatorState | undefined;
}): import("react/jsx-runtime").JSX.Element;

View File

@@ -0,0 +1,509 @@
/// <reference types="webpack/module.d.ts" />
"use strict";
Object.defineProperty(exports, "__esModule", {
value: true
});
0 && (module.exports = {
default: null,
performFullReload: null,
processMessage: null,
waitForWebpackRuntimeHotUpdate: null
});
function _export(target, all) {
for(var name in all)Object.defineProperty(target, name, {
enumerable: true,
get: all[name]
});
}
_export(exports, {
default: function() {
return HotReload;
},
performFullReload: function() {
return performFullReload;
},
processMessage: function() {
return processMessage;
},
waitForWebpackRuntimeHotUpdate: function() {
return waitForWebpackRuntimeHotUpdate;
}
});
const _interop_require_default = require("@swc/helpers/_/_interop_require_default");
const _jsxruntime = require("react/jsx-runtime");
const _react = require("react");
const _stripansi = /*#__PURE__*/ _interop_require_default._(require("next/dist/compiled/strip-ansi"));
const _formatwebpackmessages = /*#__PURE__*/ _interop_require_default._(require("../../../../shared/lib/format-webpack-messages"));
const _shared = require("../shared");
const _nextdevtools = require("next/dist/compiled/next-devtools");
const _replayssronlyerrors = require("../../../../next-devtools/userspace/app/errors/replay-ssr-only-errors");
const _appdevoverlayerrorboundary = require("../../../../next-devtools/userspace/app/app-dev-overlay-error-boundary");
const _useerrorhandler = require("../../../../next-devtools/userspace/app/errors/use-error-handler");
const _runtimeerrorhandler = require("../../runtime-error-handler");
const _websocket = require("./web-socket");
const _hotreloadertypes = require("../../../../server/dev/hot-reloader-types");
const _navigationuntracked = require("../../../components/navigation-untracked");
const _reporthmrlatency = /*#__PURE__*/ _interop_require_default._(require("../../report-hmr-latency"));
const _turbopackhotreloadercommon = require("../turbopack-hot-reloader-common");
const _approuterheaders = require("../../../components/app-router-headers");
const _approuterinstance = require("../../../components/app-router-instance");
const _invarianterror = require("../../../../shared/lib/invariant-error");
const _debugchannel = require("../../debug-channel");
const _client = require("react-server-dom-webpack/client");
const _appfindsourcemapurl = require("../../../app-find-source-map-url");
const createFromReadableStream = _client.createFromReadableStream;
let mostRecentCompilationHash = null;
let __nextDevClientId = Math.round(Math.random() * 100 + Date.now());
let reloading = false;
let webpackStartMsSinceEpoch = null;
const turbopackHmr = process.env.TURBOPACK ? new _turbopackhotreloadercommon.TurbopackHmr() : null;
let pendingHotUpdateWebpack = Promise.resolve();
let resolvePendingHotUpdateWebpack = ()=>{};
function setPendingHotUpdateWebpack() {
pendingHotUpdateWebpack = new Promise((resolve)=>{
resolvePendingHotUpdateWebpack = ()=>{
resolve();
};
});
}
function waitForWebpackRuntimeHotUpdate() {
return pendingHotUpdateWebpack;
}
// There is a newer version of the code available.
function handleAvailableHash(hash) {
// Update last known compilation hash.
mostRecentCompilationHash = hash;
}
/**
* Is there a newer version of this code available?
* For webpack: Check if the hash changed compared to __webpack_hash__
* For Turbopack: Always true because it doesn't have __webpack_hash__
*/ function isUpdateAvailable() {
if (process.env.TURBOPACK) {
return true;
}
/* globals __webpack_hash__ */ // __webpack_hash__ is the hash of the current compilation.
// It's a global variable injected by Webpack.
return mostRecentCompilationHash !== __webpack_hash__;
}
// Webpack disallows updates in other states.
function canApplyUpdates() {
return module.hot.status() === 'idle';
}
function afterApplyUpdates(fn) {
if (canApplyUpdates()) {
fn();
} else {
function handler(status) {
if (status === 'idle') {
module.hot.removeStatusHandler(handler);
fn();
}
}
module.hot.addStatusHandler(handler);
}
}
function performFullReload(err, sendMessage) {
const stackTrace = err && (err.stack && err.stack.split('\n').slice(0, 5).join('\n') || err.message || err + '');
sendMessage(JSON.stringify({
event: 'client-full-reload',
stackTrace,
hadRuntimeError: !!_runtimeerrorhandler.RuntimeErrorHandler.hadRuntimeError,
dependencyChain: err ? err.dependencyChain : undefined
}));
if (reloading) return;
reloading = true;
window.location.reload();
}
// Attempt to update code on the fly, fall back to a hard reload.
function tryApplyUpdatesWebpack(sendMessage) {
if (!isUpdateAvailable() || !canApplyUpdates()) {
resolvePendingHotUpdateWebpack();
_nextdevtools.dispatcher.onBuildOk();
(0, _reporthmrlatency.default)(sendMessage, [], webpackStartMsSinceEpoch, Date.now());
return;
}
function handleApplyUpdates(err, updatedModules) {
if (err || _runtimeerrorhandler.RuntimeErrorHandler.hadRuntimeError || updatedModules == null) {
if (err) {
console.warn(_shared.REACT_REFRESH_FULL_RELOAD);
} else if (_runtimeerrorhandler.RuntimeErrorHandler.hadRuntimeError) {
console.warn(_shared.REACT_REFRESH_FULL_RELOAD_FROM_ERROR);
}
performFullReload(err, sendMessage);
return;
}
_nextdevtools.dispatcher.onBuildOk();
if (isUpdateAvailable()) {
// While we were updating, there was a new update! Do it again.
tryApplyUpdatesWebpack(sendMessage);
return;
}
_nextdevtools.dispatcher.onRefresh();
resolvePendingHotUpdateWebpack();
(0, _reporthmrlatency.default)(sendMessage, updatedModules, webpackStartMsSinceEpoch, Date.now());
if (process.env.__NEXT_TEST_MODE) {
afterApplyUpdates(()=>{
if (self.__NEXT_HMR_CB) {
self.__NEXT_HMR_CB();
self.__NEXT_HMR_CB = null;
}
});
}
}
// https://webpack.js.org/api/hot-module-replacement/#check
module.hot.check(/* autoApply */ false).then((updatedModules)=>{
if (updatedModules == null) {
return null;
}
// We should always handle an update, even if updatedModules is empty (but
// non-null) for any reason. That's what webpack would normally do:
// https://github.com/webpack/webpack/blob/3aa6b6bc3a64/lib/hmr/HotModuleReplacement.runtime.js#L296-L298
_nextdevtools.dispatcher.onBeforeRefresh();
// https://webpack.js.org/api/hot-module-replacement/#apply
return module.hot.apply();
}).then((updatedModules)=>{
handleApplyUpdates(null, updatedModules);
}, (err)=>{
handleApplyUpdates(err, null);
});
}
function processMessage(message, sendMessage, processTurbopackMessage, staticIndicatorState) {
function handleErrors(errors) {
// "Massage" webpack messages.
const formatted = (0, _formatwebpackmessages.default)({
errors: errors,
warnings: []
});
// Only show the first error.
_nextdevtools.dispatcher.onBuildError(formatted.errors[0]);
// Also log them to the console.
for(let i = 0; i < formatted.errors.length; i++){
console.error((0, _stripansi.default)(formatted.errors[i]));
}
// Do not attempt to reload now.
// We will reload on next success instead.
if (process.env.__NEXT_TEST_MODE) {
if (self.__NEXT_HMR_CB) {
self.__NEXT_HMR_CB(formatted.errors[0]);
self.__NEXT_HMR_CB = null;
}
}
}
function handleHotUpdate() {
if (process.env.TURBOPACK) {
const hmrUpdate = turbopackHmr.onBuilt();
if (hmrUpdate != null) {
(0, _reporthmrlatency.default)(sendMessage, [
...hmrUpdate.updatedModules
], hmrUpdate.startMsSinceEpoch, hmrUpdate.endMsSinceEpoch, // suppress the `client-hmr-latency` event if the update was a no-op:
hmrUpdate.hasUpdates);
}
_nextdevtools.dispatcher.onBuildOk();
} else {
tryApplyUpdatesWebpack(sendMessage);
}
}
switch(message.type){
case _hotreloadertypes.HMR_MESSAGE_SENT_TO_BROWSER.ISR_MANIFEST:
{
if (process.env.__NEXT_DEV_INDICATOR) {
staticIndicatorState.appIsrManifest = message.data;
// Handle the initial static indicator status on receiving the ISR
// manifest. Navigation is handled in an effect inside HotReload for
// pathname changes as we'll receive the updated manifest before
// usePathname triggers for a new value.
const isStatic = staticIndicatorState.pathname ? message.data[staticIndicatorState.pathname] : undefined;
_nextdevtools.dispatcher.onStaticIndicator(isStatic === undefined ? 'pending' : isStatic ? 'static' : 'dynamic');
}
break;
}
case _hotreloadertypes.HMR_MESSAGE_SENT_TO_BROWSER.BUILDING:
{
_nextdevtools.dispatcher.buildingIndicatorShow();
if (process.env.TURBOPACK) {
turbopackHmr.onBuilding();
} else {
webpackStartMsSinceEpoch = Date.now();
setPendingHotUpdateWebpack();
console.log('[Fast Refresh] rebuilding');
}
break;
}
case _hotreloadertypes.HMR_MESSAGE_SENT_TO_BROWSER.BUILT:
case _hotreloadertypes.HMR_MESSAGE_SENT_TO_BROWSER.SYNC:
{
_nextdevtools.dispatcher.buildingIndicatorHide();
if (message.hash) {
handleAvailableHash(message.hash);
}
const { errors, warnings } = message;
// Is undefined when it's a 'built' event
if ('versionInfo' in message) _nextdevtools.dispatcher.onVersionInfo(message.versionInfo);
if ('debug' in message && message.debug) _nextdevtools.dispatcher.onDebugInfo(message.debug);
if ('devIndicator' in message) _nextdevtools.dispatcher.onDevIndicator(message.devIndicator);
if ('devToolsConfig' in message) _nextdevtools.dispatcher.onDevToolsConfig(message.devToolsConfig);
const hasErrors = Boolean(errors && errors.length);
// Compilation with errors (e.g. syntax error or missing modules).
if (hasErrors) {
sendMessage(JSON.stringify({
event: 'client-error',
errorCount: errors.length,
clientId: __nextDevClientId
}));
handleErrors(errors);
return;
}
const hasWarnings = Boolean(warnings && warnings.length);
if (hasWarnings) {
sendMessage(JSON.stringify({
event: 'client-warning',
warningCount: warnings.length,
clientId: __nextDevClientId
}));
// Print warnings to the console.
const formattedMessages = (0, _formatwebpackmessages.default)({
warnings: warnings,
errors: []
});
for(let i = 0; i < formattedMessages.warnings.length; i++){
if (i === 5) {
console.warn('There were more warnings in other files.\n' + 'You can find a complete log in the terminal.');
break;
}
console.warn((0, _stripansi.default)(formattedMessages.warnings[i]));
}
// No early return here as we need to apply modules in the same way between warnings only and compiles without warnings
}
sendMessage(JSON.stringify({
event: 'client-success',
clientId: __nextDevClientId
}));
if (message.type === _hotreloadertypes.HMR_MESSAGE_SENT_TO_BROWSER.BUILT) {
handleHotUpdate();
}
return;
}
case _hotreloadertypes.HMR_MESSAGE_SENT_TO_BROWSER.TURBOPACK_CONNECTED:
{
processTurbopackMessage({
type: _hotreloadertypes.HMR_MESSAGE_SENT_TO_BROWSER.TURBOPACK_CONNECTED,
data: {
sessionId: message.data.sessionId
}
});
break;
}
case _hotreloadertypes.HMR_MESSAGE_SENT_TO_BROWSER.TURBOPACK_MESSAGE:
{
turbopackHmr.onTurbopackMessage(message);
_nextdevtools.dispatcher.onBeforeRefresh();
processTurbopackMessage({
type: _hotreloadertypes.HMR_MESSAGE_SENT_TO_BROWSER.TURBOPACK_MESSAGE,
data: message.data
});
if (_runtimeerrorhandler.RuntimeErrorHandler.hadRuntimeError) {
console.warn(_shared.REACT_REFRESH_FULL_RELOAD_FROM_ERROR);
performFullReload(null, sendMessage);
}
_nextdevtools.dispatcher.onRefresh();
break;
}
// TODO-APP: make server component change more granular
case _hotreloadertypes.HMR_MESSAGE_SENT_TO_BROWSER.SERVER_COMPONENT_CHANGES:
{
turbopackHmr?.onServerComponentChanges();
sendMessage(JSON.stringify({
event: 'server-component-reload-page',
clientId: __nextDevClientId,
hash: message.hash
}));
// Store the latest hash in a session cookie so that it's sent back to the
// server with any subsequent requests.
document.cookie = `${_approuterheaders.NEXT_HMR_REFRESH_HASH_COOKIE}=${message.hash};path=/`;
if (_runtimeerrorhandler.RuntimeErrorHandler.hadRuntimeError || document.documentElement.id === '__next_error__') {
if (reloading) return;
reloading = true;
return window.location.reload();
}
(0, _react.startTransition)(()=>{
_approuterinstance.publicAppRouterInstance.hmrRefresh();
_nextdevtools.dispatcher.onRefresh();
});
if (process.env.__NEXT_TEST_MODE) {
if (self.__NEXT_HMR_CB) {
self.__NEXT_HMR_CB();
self.__NEXT_HMR_CB = null;
}
}
return;
}
case _hotreloadertypes.HMR_MESSAGE_SENT_TO_BROWSER.RELOAD_PAGE:
{
turbopackHmr?.onReloadPage();
sendMessage(JSON.stringify({
event: 'client-reload-page',
clientId: __nextDevClientId
}));
if (reloading) return;
reloading = true;
return window.location.reload();
}
case _hotreloadertypes.HMR_MESSAGE_SENT_TO_BROWSER.ADDED_PAGE:
case _hotreloadertypes.HMR_MESSAGE_SENT_TO_BROWSER.REMOVED_PAGE:
{
turbopackHmr?.onPageAddRemove();
// TODO-APP: potentially only refresh if the currently viewed page was added/removed.
return _approuterinstance.publicAppRouterInstance.hmrRefresh();
}
case _hotreloadertypes.HMR_MESSAGE_SENT_TO_BROWSER.SERVER_ERROR:
{
const { errorJSON } = message;
if (errorJSON) {
const errorObject = JSON.parse(errorJSON);
const error = Object.defineProperty(new Error(errorObject.message), "__NEXT_ERROR_CODE", {
value: "E394",
enumerable: false,
configurable: true
});
error.stack = errorObject.stack;
handleErrors([
error
]);
}
return;
}
case _hotreloadertypes.HMR_MESSAGE_SENT_TO_BROWSER.DEV_PAGES_MANIFEST_UPDATE:
{
return;
}
case _hotreloadertypes.HMR_MESSAGE_SENT_TO_BROWSER.DEVTOOLS_CONFIG:
{
_nextdevtools.dispatcher.onDevToolsConfig(message.data);
return;
}
case _hotreloadertypes.HMR_MESSAGE_SENT_TO_BROWSER.REACT_DEBUG_CHUNK:
{
const { requestId, chunk } = message;
const { writer } = (0, _debugchannel.getOrCreateDebugChannelReadableWriterPair)(requestId);
if (chunk) {
writer.ready.then(()=>writer.write(chunk)).catch(console.error);
} else {
// A null chunk signals that no more chunks will be sent, which allows
// us to close the writer.
// TODO: Revisit this cleanup logic when we integrate the return channel
// that keeps the connection open to be able to lazily retrieve debug
// objects.
writer.ready.then(()=>writer.close()).catch(console.error);
}
return;
}
case _hotreloadertypes.HMR_MESSAGE_SENT_TO_BROWSER.REQUEST_CURRENT_ERROR_STATE:
{
const errorState = (0, _nextdevtools.getSerializedOverlayState)();
const response = {
event: _hotreloadertypes.HMR_MESSAGE_SENT_TO_SERVER.MCP_ERROR_STATE_RESPONSE,
requestId: message.requestId,
errorState,
url: window.location.href
};
sendMessage(JSON.stringify(response));
return;
}
case _hotreloadertypes.HMR_MESSAGE_SENT_TO_BROWSER.REQUEST_PAGE_METADATA:
{
const segmentTrieData = (0, _nextdevtools.getSegmentTrieData)();
const response = {
event: _hotreloadertypes.HMR_MESSAGE_SENT_TO_SERVER.MCP_PAGE_METADATA_RESPONSE,
requestId: message.requestId,
segmentTrieData,
url: window.location.href
};
sendMessage(JSON.stringify(response));
return;
}
case _hotreloadertypes.HMR_MESSAGE_SENT_TO_BROWSER.CACHE_INDICATOR:
{
_nextdevtools.dispatcher.onCacheIndicator(message.state);
return;
}
case _hotreloadertypes.HMR_MESSAGE_SENT_TO_BROWSER.ERRORS_TO_SHOW_IN_BROWSER:
{
createFromReadableStream(new ReadableStream({
start (controller) {
controller.enqueue(message.serializedErrors);
controller.close();
}
}), {
findSourceMapURL: _appfindsourcemapurl.findSourceMapURL
}).then((errors)=>{
for (const error of errors){
console.error(error);
}
}, (err)=>{
console.error(Object.defineProperty(new Error('Failed to deserialize errors.', {
cause: err
}), "__NEXT_ERROR_CODE", {
value: "E946",
enumerable: false,
configurable: true
}));
});
return;
}
case _hotreloadertypes.HMR_MESSAGE_SENT_TO_BROWSER.MIDDLEWARE_CHANGES:
case _hotreloadertypes.HMR_MESSAGE_SENT_TO_BROWSER.CLIENT_CHANGES:
case _hotreloadertypes.HMR_MESSAGE_SENT_TO_BROWSER.SERVER_ONLY_CHANGES:
break;
default:
{
message;
}
}
}
function HotReload({ children, globalError, webSocket, staticIndicatorState }) {
(0, _useerrorhandler.useErrorHandler)(_nextdevtools.dispatcher.onUnhandledError, _nextdevtools.dispatcher.onUnhandledRejection);
(0, _websocket.useWebSocketPing)(webSocket);
// We don't want access of the pathname for the dev tools to trigger a dynamic
// access (as the dev overlay will never be present in production).
const pathname = (0, _navigationuntracked.useUntrackedPathname)();
if (process.env.__NEXT_DEV_INDICATOR) {
// this conditional is only for dead-code elimination which
// isn't a runtime conditional only build-time so ignore hooks rule
// eslint-disable-next-line react-hooks/rules-of-hooks
(0, _react.useEffect)(()=>{
if (!staticIndicatorState) {
throw Object.defineProperty(new _invarianterror.InvariantError('Expected staticIndicatorState to be defined in dev mode.'), "__NEXT_ERROR_CODE", {
value: "E786",
enumerable: false,
configurable: true
});
}
staticIndicatorState.pathname = pathname;
if (staticIndicatorState.appIsrManifest) {
const isStatic = pathname ? staticIndicatorState.appIsrManifest[pathname] : undefined;
_nextdevtools.dispatcher.onStaticIndicator(isStatic === undefined ? 'pending' : isStatic ? 'static' : 'dynamic');
}
}, [
pathname,
staticIndicatorState
]);
}
return /*#__PURE__*/ (0, _jsxruntime.jsxs)(_appdevoverlayerrorboundary.AppDevOverlayErrorBoundary, {
globalError: globalError,
children: [
/*#__PURE__*/ (0, _jsxruntime.jsx)(_replayssronlyerrors.ReplaySsrOnlyErrors, {
onBlockingError: _nextdevtools.dispatcher.openErrorOverlay
}),
children
]
});
}
if ((typeof exports.default === 'function' || (typeof exports.default === 'object' && exports.default !== null)) && typeof exports.default.__esModule === 'undefined') {
Object.defineProperty(exports.default, '__esModule', { value: true });
Object.assign(exports.default, exports);
module.exports = exports.default;
}
//# sourceMappingURL=hot-reloader-app.js.map

File diff suppressed because one or more lines are too long

View File

@@ -0,0 +1,5 @@
import { type TurbopackMessageSentToBrowser } from '../../../../server/dev/hot-reloader-types';
import { type StaticIndicatorState } from './hot-reloader-app';
export declare function createWebSocket(assetPrefix: string, staticIndicatorState: StaticIndicatorState): WebSocket;
export declare function createProcessTurbopackMessage(sendMessage: (data: string) => void): (msg: TurbopackMessageSentToBrowser) => void;
export declare function useWebSocketPing(webSocket: WebSocket | undefined): void;

View File

@@ -0,0 +1,238 @@
"use strict";
Object.defineProperty(exports, "__esModule", {
value: true
});
0 && (module.exports = {
createProcessTurbopackMessage: null,
createWebSocket: null,
useWebSocketPing: null
});
function _export(target, all) {
for(var name in all)Object.defineProperty(target, name, {
enumerable: true,
get: all[name]
});
}
_export(exports, {
createProcessTurbopackMessage: function() {
return createProcessTurbopackMessage;
},
createWebSocket: function() {
return createWebSocket;
},
useWebSocketPing: function() {
return useWebSocketPing;
}
});
const _react = require("react");
const _approutercontextsharedruntime = require("../../../../shared/lib/app-router-context.shared-runtime");
const _getsocketurl = require("../get-socket-url");
const _hotreloadertypes = require("../../../../server/dev/hot-reloader-types");
const _shared = require("../shared");
const _hotreloaderapp = require("./hot-reloader-app");
const _forwardlogs = require("../../../../next-devtools/userspace/app/forward-logs");
const _invarianterror = require("../../../../shared/lib/invariant-error");
const _constants = require("../../../../lib/constants");
let reconnections = 0;
let reloading = false;
let serverSessionId = null;
let mostRecentCompilationHash = null;
function createWebSocket(assetPrefix, staticIndicatorState) {
if (!self.__next_r) {
throw Object.defineProperty(new _invarianterror.InvariantError(`Expected a request ID to be defined for the document via self.__next_r.`), "__NEXT_ERROR_CODE", {
value: "E806",
enumerable: false,
configurable: true
});
}
let webSocket;
let timer;
const sendMessage = (data)=>{
if (webSocket && webSocket.readyState === webSocket.OPEN) {
webSocket.send(data);
}
};
const processTurbopackMessage = createProcessTurbopackMessage(sendMessage);
function init() {
if (webSocket) {
webSocket.close();
}
const newWebSocket = new window.WebSocket(`${(0, _getsocketurl.getSocketUrl)(assetPrefix)}/_next/webpack-hmr?id=${self.__next_r}`);
newWebSocket.binaryType = 'arraybuffer';
function handleOnline() {
_forwardlogs.logQueue.onSocketReady(newWebSocket);
reconnections = 0;
window.console.log('[HMR] connected');
}
function handleMessage(event) {
// While the page is reloading, don't respond to any more messages.
if (reloading) {
return;
}
try {
const message = event.data instanceof ArrayBuffer ? parseBinaryMessage(event.data) : JSON.parse(event.data);
// Check for server restart in Turbopack mode
if (message.type === _hotreloadertypes.HMR_MESSAGE_SENT_TO_BROWSER.TURBOPACK_CONNECTED) {
if (serverSessionId !== null && serverSessionId !== message.data.sessionId) {
// Either the server's session id has changed and it's a new server, or
// it's been too long since we disconnected and we should reload the page.
window.location.reload();
reloading = true;
return;
}
serverSessionId = message.data.sessionId;
}
// Track webpack compilation hash for server restart detection
if (message.type === _hotreloadertypes.HMR_MESSAGE_SENT_TO_BROWSER.SYNC && 'hash' in message) {
// If we had previously reconnected and the hash changed, the server may have restarted
if (mostRecentCompilationHash !== null && mostRecentCompilationHash !== message.hash) {
window.location.reload();
reloading = true;
return;
}
mostRecentCompilationHash = message.hash;
}
(0, _hotreloaderapp.processMessage)(message, sendMessage, processTurbopackMessage, staticIndicatorState);
} catch (err) {
(0, _shared.reportInvalidHmrMessage)(event, err);
}
}
function handleDisconnect() {
newWebSocket.onerror = null;
newWebSocket.onclose = null;
newWebSocket.close();
reconnections++;
// After 25 reconnects we'll want to reload the page as it indicates the dev server is no longer running.
if (reconnections > _constants.WEB_SOCKET_MAX_RECONNECTIONS) {
reloading = true;
window.location.reload();
return;
}
clearTimeout(timer);
// Try again after 5 seconds
timer = setTimeout(init, reconnections > 5 ? 5000 : 1000);
}
newWebSocket.onopen = handleOnline;
newWebSocket.onerror = handleDisconnect;
newWebSocket.onclose = handleDisconnect;
newWebSocket.onmessage = handleMessage;
webSocket = newWebSocket;
return newWebSocket;
}
return init();
}
function createProcessTurbopackMessage(sendMessage) {
if (!process.env.TURBOPACK) {
return ()=>{};
}
let queue = [];
let callback;
const processTurbopackMessage = (msg)=>{
if (callback) {
callback(msg);
} else {
queue.push(msg);
}
};
import(// @ts-expect-error requires "moduleResolution": "node16" in tsconfig.json and not .ts extension
'@vercel/turbopack-ecmascript-runtime/browser/dev/hmr-client/hmr-client.ts').then(({ connect })=>{
connect({
addMessageListener (cb) {
callback = cb;
// Replay all Turbopack messages before we were able to establish the HMR client.
for (const msg of queue){
cb(msg);
}
queue.length = 0;
},
sendMessage,
onUpdateError: (err)=>(0, _hotreloaderapp.performFullReload)(err, sendMessage)
});
});
return processTurbopackMessage;
}
function useWebSocketPing(webSocket) {
const { tree } = (0, _react.useContext)(_approutercontextsharedruntime.GlobalLayoutRouterContext);
(0, _react.useEffect)(()=>{
if (!webSocket) {
throw Object.defineProperty(new _invarianterror.InvariantError('Expected webSocket to be defined in dev mode.'), "__NEXT_ERROR_CODE", {
value: "E785",
enumerable: false,
configurable: true
});
}
// Never send pings when using Turbopack as it's not used.
// Pings were originally used to keep track of active routes in on-demand-entries with webpack.
if (process.env.TURBOPACK) {
return;
}
// Taken from on-demand-entries-client.js
const interval = setInterval(()=>{
if (webSocket.readyState === webSocket.OPEN) {
webSocket.send(JSON.stringify({
event: 'ping',
tree,
appDirRoute: true
}));
}
}, 2500);
return ()=>clearInterval(interval);
}, [
tree,
webSocket
]);
}
const textDecoder = new TextDecoder();
function parseBinaryMessage(data) {
assertByteLength(data, 1);
const view = new DataView(data);
const messageType = view.getUint8(0);
switch(messageType){
case _hotreloadertypes.HMR_MESSAGE_SENT_TO_BROWSER.ERRORS_TO_SHOW_IN_BROWSER:
{
const serializedErrors = new Uint8Array(data, 1);
return {
type: _hotreloadertypes.HMR_MESSAGE_SENT_TO_BROWSER.ERRORS_TO_SHOW_IN_BROWSER,
serializedErrors
};
}
case _hotreloadertypes.HMR_MESSAGE_SENT_TO_BROWSER.REACT_DEBUG_CHUNK:
{
assertByteLength(data, 2);
const requestIdLength = view.getUint8(1);
assertByteLength(data, 2 + requestIdLength);
const requestId = textDecoder.decode(new Uint8Array(data, 2, requestIdLength));
const chunk = data.byteLength > 2 + requestIdLength ? new Uint8Array(data, 2 + requestIdLength) : null;
return {
type: _hotreloadertypes.HMR_MESSAGE_SENT_TO_BROWSER.REACT_DEBUG_CHUNK,
requestId,
chunk
};
}
default:
{
throw Object.defineProperty(new _invarianterror.InvariantError(`Invalid binary HMR message of type ${messageType}`), "__NEXT_ERROR_CODE", {
value: "E809",
enumerable: false,
configurable: true
});
}
}
}
function assertByteLength(data, expectedLength) {
if (data.byteLength < expectedLength) {
throw Object.defineProperty(new _invarianterror.InvariantError(`Invalid binary HMR message: insufficient data (expected ${expectedLength} bytes, got ${data.byteLength})`), "__NEXT_ERROR_CODE", {
value: "E808",
enumerable: false,
configurable: true
});
}
}
if ((typeof exports.default === 'function' || (typeof exports.default === 'object' && exports.default !== null)) && typeof exports.default.__esModule === 'undefined') {
Object.defineProperty(exports.default, '__esModule', { value: true });
Object.assign(exports.default, exports);
module.exports = exports.default;
}
//# sourceMappingURL=web-socket.js.map

File diff suppressed because one or more lines are too long

View File

@@ -0,0 +1 @@
export declare function getSocketUrl(assetPrefix: string | undefined): string;

View File

@@ -0,0 +1,38 @@
"use strict";
Object.defineProperty(exports, "__esModule", {
value: true
});
Object.defineProperty(exports, "getSocketUrl", {
enumerable: true,
get: function() {
return getSocketUrl;
}
});
const _normalizedassetprefix = require("../../../shared/lib/normalized-asset-prefix");
function getSocketProtocol(assetPrefix) {
let protocol = window.location.protocol;
try {
// assetPrefix is a url
protocol = new URL(assetPrefix).protocol;
} catch {}
return protocol === 'http:' ? 'ws:' : 'wss:';
}
function getSocketUrl(assetPrefix) {
const prefix = (0, _normalizedassetprefix.normalizedAssetPrefix)(assetPrefix);
const protocol = getSocketProtocol(assetPrefix || '');
if (URL.canParse(prefix)) {
// since normalized asset prefix is ensured to be a URL format,
// we can safely replace the protocol
return prefix.replace(/^http/, 'ws');
}
const { hostname, port } = window.location;
return `${protocol}//${hostname}${port ? `:${port}` : ''}${prefix}`;
}
if ((typeof exports.default === 'function' || (typeof exports.default === 'object' && exports.default !== null)) && typeof exports.default.__esModule === 'undefined') {
Object.defineProperty(exports.default, '__esModule', { value: true });
Object.assign(exports.default, exports);
module.exports = exports.default;
}
//# sourceMappingURL=get-socket-url.js.map

View File

@@ -0,0 +1 @@
{"version":3,"sources":["../../../../src/client/dev/hot-reloader/get-socket-url.ts"],"sourcesContent":["import { normalizedAssetPrefix } from '../../../shared/lib/normalized-asset-prefix'\n\nfunction getSocketProtocol(assetPrefix: string): string {\n let protocol = window.location.protocol\n\n try {\n // assetPrefix is a url\n protocol = new URL(assetPrefix).protocol\n } catch {}\n\n return protocol === 'http:' ? 'ws:' : 'wss:'\n}\n\nexport function getSocketUrl(assetPrefix: string | undefined): string {\n const prefix = normalizedAssetPrefix(assetPrefix)\n const protocol = getSocketProtocol(assetPrefix || '')\n\n if (URL.canParse(prefix)) {\n // since normalized asset prefix is ensured to be a URL format,\n // we can safely replace the protocol\n return prefix.replace(/^http/, 'ws')\n }\n\n const { hostname, port } = window.location\n return `${protocol}//${hostname}${port ? `:${port}` : ''}${prefix}`\n}\n"],"names":["getSocketUrl","getSocketProtocol","assetPrefix","protocol","window","location","URL","prefix","normalizedAssetPrefix","canParse","replace","hostname","port"],"mappings":";;;;+BAagBA;;;eAAAA;;;uCAbsB;AAEtC,SAASC,kBAAkBC,WAAmB;IAC5C,IAAIC,WAAWC,OAAOC,QAAQ,CAACF,QAAQ;IAEvC,IAAI;QACF,uBAAuB;QACvBA,WAAW,IAAIG,IAAIJ,aAAaC,QAAQ;IAC1C,EAAE,OAAM,CAAC;IAET,OAAOA,aAAa,UAAU,QAAQ;AACxC;AAEO,SAASH,aAAaE,WAA+B;IAC1D,MAAMK,SAASC,IAAAA,4CAAqB,EAACN;IACrC,MAAMC,WAAWF,kBAAkBC,eAAe;IAElD,IAAII,IAAIG,QAAQ,CAACF,SAAS;QACxB,+DAA+D;QAC/D,qCAAqC;QACrC,OAAOA,OAAOG,OAAO,CAAC,SAAS;IACjC;IAEA,MAAM,EAAEC,QAAQ,EAAEC,IAAI,EAAE,GAAGR,OAAOC,QAAQ;IAC1C,OAAO,GAAGF,SAAS,EAAE,EAAEQ,WAAWC,OAAO,CAAC,CAAC,EAAEA,MAAM,GAAG,KAAKL,QAAQ;AACrE","ignoreList":[0]}

View File

@@ -0,0 +1,40 @@
/**
* MIT License
*
* Copyright (c) 2013-present, Facebook, Inc.
*
* Permission is hereby granted, free of charge, to any person obtaining a copy
* of this software and associated documentation files (the "Software"), to deal
* in the Software without restriction, including without limitation the rights
* to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
* copies of the Software, and to permit persons to whom the Software is
* furnished to do so, subject to the following conditions:
*
* The above copyright notice and this permission notice shall be included in all
* copies or substantial portions of the Software.
*
* THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
* IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
* FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
* AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
* LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
* OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
* SOFTWARE.
*/
import type { AddedPageMessage, DevPagesManifestUpdateMessage, ReloadPageMessage, RemovedPageMessage, TurbopackMessageSentToBrowser } from '../../../../server/dev/hot-reloader-types';
declare global {
interface Window {
__nextDevClientId: number;
}
}
type CustomHmrEventHandler = (message: AddedPageMessage | RemovedPageMessage | ReloadPageMessage | DevPagesManifestUpdateMessage) => void;
export default function connect(): {
subscribeToHmrEvent(handler: CustomHmrEventHandler): void;
onUnrecoverableError(): void;
addTurbopackMessageListener(cb: (msg: TurbopackMessageSentToBrowser) => void): void;
sendTurbopackMessage(msg: string): void;
handleUpdateError(err: unknown): void;
};
export declare function handleStaticIndicator(): void;
export declare function performFullReload(err: any): void;
export {};

View File

@@ -0,0 +1,452 @@
// TODO: Remove use of `any` type.
/**
* MIT License
*
* Copyright (c) 2013-present, Facebook, Inc.
*
* Permission is hereby granted, free of charge, to any person obtaining a copy
* of this software and associated documentation files (the "Software"), to deal
* in the Software without restriction, including without limitation the rights
* to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
* copies of the Software, and to permit persons to whom the Software is
* furnished to do so, subject to the following conditions:
*
* The above copyright notice and this permission notice shall be included in all
* copies or substantial portions of the Software.
*
* THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
* IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
* FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
* AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
* LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
* OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
* SOFTWARE.
*/ /// <reference types="webpack/module.d.ts" />
// This file is a modified version of the Create React App HMR dev client that
// can be found here:
// https://github.com/facebook/create-react-app/blob/v3.4.1/packages/react-dev-utils/webpackHotDevClient.js
/// <reference types="webpack/module.d.ts" />
"use strict";
Object.defineProperty(exports, "__esModule", {
value: true
});
0 && (module.exports = {
default: null,
handleStaticIndicator: null,
performFullReload: null
});
function _export(target, all) {
for(var name in all)Object.defineProperty(target, name, {
enumerable: true,
get: all[name]
});
}
_export(exports, {
default: function() {
return connect;
},
handleStaticIndicator: function() {
return handleStaticIndicator;
},
performFullReload: function() {
return performFullReload;
}
});
const _interop_require_default = require("@swc/helpers/_/_interop_require_default");
const _nextdevtools = require("next/dist/compiled/next-devtools");
const _pagesdevoverlaysetup = require("../../../../next-devtools/userspace/pages/pages-dev-overlay-setup");
const _stripansi = /*#__PURE__*/ _interop_require_default._(require("next/dist/compiled/strip-ansi"));
const _websocket = require("./websocket");
const _formatwebpackmessages = /*#__PURE__*/ _interop_require_default._(require("../../../../shared/lib/format-webpack-messages"));
const _hotreloadertypes = require("../../../../server/dev/hot-reloader-types");
const _shared = require("../shared");
const _runtimeerrorhandler = require("../../runtime-error-handler");
const _reporthmrlatency = /*#__PURE__*/ _interop_require_default._(require("../../report-hmr-latency"));
const _turbopackhotreloadercommon = require("../turbopack-hot-reloader-common");
window.__nextDevClientId = Math.round(Math.random() * 100 + Date.now());
let customHmrEventHandler;
let turbopackMessageListeners = [];
function connect() {
(0, _pagesdevoverlaysetup.register)();
(0, _websocket.addMessageListener)((message)=>{
try {
processMessage(message);
} catch (err) {
(0, _shared.reportInvalidHmrMessage)(message, err);
}
});
return {
subscribeToHmrEvent (handler) {
customHmrEventHandler = handler;
},
onUnrecoverableError () {
_runtimeerrorhandler.RuntimeErrorHandler.hadRuntimeError = true;
},
addTurbopackMessageListener (cb) {
turbopackMessageListeners.push(cb);
},
sendTurbopackMessage (msg) {
(0, _websocket.sendMessage)(msg);
},
handleUpdateError (err) {
performFullReload(err);
}
};
}
// Remember some state related to hot module replacement.
var isFirstCompilation = true;
var mostRecentCompilationHash = null;
var hasCompileErrors = false;
function clearOutdatedErrors() {
// Clean up outdated compile errors, if any.
if (typeof console !== 'undefined' && typeof console.clear === 'function') {
if (hasCompileErrors) {
console.clear();
}
}
}
// Successful compilation.
function handleSuccess() {
clearOutdatedErrors();
hasCompileErrors = false;
if (process.env.TURBOPACK) {
const hmrUpdate = turbopackHmr.onBuilt();
if (hmrUpdate != null) {
(0, _reporthmrlatency.default)(_websocket.sendMessage, [
...hmrUpdate.updatedModules
], hmrUpdate.startMsSinceEpoch, hmrUpdate.endMsSinceEpoch, hmrUpdate.hasUpdates);
}
_nextdevtools.dispatcher.onBuildOk();
} else {
const isHotUpdate = !isFirstCompilation || window.__NEXT_DATA__.page !== '/_error' && isUpdateAvailable();
// Attempt to apply hot updates or reload.
if (isHotUpdate) {
tryApplyUpdatesWebpack();
}
}
isFirstCompilation = false;
}
// Compilation with warnings (e.g. ESLint).
function handleWarnings(warnings) {
clearOutdatedErrors();
const isHotUpdate = !isFirstCompilation;
isFirstCompilation = false;
hasCompileErrors = false;
function printWarnings() {
// Print warnings to the console.
const formatted = (0, _formatwebpackmessages.default)({
warnings: warnings,
errors: []
});
if (typeof console !== 'undefined' && typeof console.warn === 'function') {
for(let i = 0; i < formatted.warnings?.length; i++){
if (i === 5) {
console.warn('There were more warnings in other files.\n' + 'You can find a complete log in the terminal.');
break;
}
console.warn((0, _stripansi.default)(formatted.warnings[i]));
}
}
}
printWarnings();
// Attempt to apply hot updates or reload.
if (isHotUpdate) {
tryApplyUpdatesWebpack();
}
}
// Compilation with errors (e.g. syntax error or missing modules).
function handleErrors(errors) {
clearOutdatedErrors();
isFirstCompilation = false;
hasCompileErrors = true;
// "Massage" webpack messages.
var formatted = (0, _formatwebpackmessages.default)({
errors: errors,
warnings: []
});
// Only show the first error.
_nextdevtools.dispatcher.onBuildError(formatted.errors[0]);
// Also log them to the console.
if (typeof console !== 'undefined' && typeof console.error === 'function') {
for(var i = 0; i < formatted.errors.length; i++){
console.error((0, _stripansi.default)(formatted.errors[i]));
}
}
// Do not attempt to reload now.
// We will reload on next success instead.
if (process.env.__NEXT_TEST_MODE) {
if (self.__NEXT_HMR_CB) {
self.__NEXT_HMR_CB(formatted.errors[0]);
self.__NEXT_HMR_CB = null;
}
}
}
let webpackStartMsSinceEpoch = null;
const turbopackHmr = process.env.TURBOPACK ? new _turbopackhotreloadercommon.TurbopackHmr() : null;
let isrManifest = {};
// There is a newer version of the code available.
function handleAvailableHash(hash) {
// Update last known compilation hash.
mostRecentCompilationHash = hash;
}
function handleStaticIndicator() {
if (process.env.__NEXT_DEV_INDICATOR) {
const routeInfo = window.next.router.components[window.next.router.pathname];
const pageComponent = routeInfo?.Component;
const appComponent = window.next.router.components['/_app']?.Component;
const isDynamicPage = Boolean(pageComponent?.getInitialProps) || Boolean(routeInfo?.__N_SSP);
const hasAppGetInitialProps = Boolean(appComponent?.getInitialProps) && appComponent?.getInitialProps !== appComponent?.origGetInitialProps;
const isPageStatic = isrManifest[window.location.pathname] || !isDynamicPage && !hasAppGetInitialProps;
_nextdevtools.dispatcher.onStaticIndicator(isPageStatic ? 'static' : 'dynamic');
}
}
/** Handles messages from the server for the Pages Router. */ function processMessage(message) {
switch(message.type){
case _hotreloadertypes.HMR_MESSAGE_SENT_TO_BROWSER.ISR_MANIFEST:
{
isrManifest = message.data;
handleStaticIndicator();
break;
}
case _hotreloadertypes.HMR_MESSAGE_SENT_TO_BROWSER.BUILDING:
{
_nextdevtools.dispatcher.buildingIndicatorShow();
if (process.env.TURBOPACK) {
turbopackHmr.onBuilding();
} else {
webpackStartMsSinceEpoch = Date.now();
console.log('[Fast Refresh] rebuilding');
}
break;
}
case _hotreloadertypes.HMR_MESSAGE_SENT_TO_BROWSER.BUILT:
case _hotreloadertypes.HMR_MESSAGE_SENT_TO_BROWSER.SYNC:
{
_nextdevtools.dispatcher.buildingIndicatorHide();
if (message.hash) handleAvailableHash(message.hash);
const { errors, warnings } = message;
// Is undefined when it's a 'built' event
if ('versionInfo' in message) _nextdevtools.dispatcher.onVersionInfo(message.versionInfo);
if ('devIndicator' in message) _nextdevtools.dispatcher.onDevIndicator(message.devIndicator);
if ('devToolsConfig' in message) _nextdevtools.dispatcher.onDevToolsConfig(message.devToolsConfig);
const hasErrors = Boolean(errors && errors.length);
if (hasErrors) {
(0, _websocket.sendMessage)(JSON.stringify({
event: 'client-error',
errorCount: errors.length,
clientId: window.__nextDevClientId
}));
return handleErrors(errors);
}
// NOTE: Turbopack does not currently send warnings
const hasWarnings = Boolean(warnings && warnings.length);
if (hasWarnings) {
(0, _websocket.sendMessage)(JSON.stringify({
event: 'client-warning',
warningCount: warnings.length,
clientId: window.__nextDevClientId
}));
return handleWarnings(warnings);
}
(0, _websocket.sendMessage)(JSON.stringify({
event: 'client-success',
clientId: window.__nextDevClientId
}));
return handleSuccess();
}
case _hotreloadertypes.HMR_MESSAGE_SENT_TO_BROWSER.SERVER_COMPONENT_CHANGES:
{
turbopackHmr?.onServerComponentChanges();
if (hasCompileErrors || _runtimeerrorhandler.RuntimeErrorHandler.hadRuntimeError) {
window.location.reload();
}
return;
}
case _hotreloadertypes.HMR_MESSAGE_SENT_TO_BROWSER.SERVER_ERROR:
{
const { errorJSON } = message;
if (errorJSON) {
const errorObject = JSON.parse(errorJSON);
const error = Object.defineProperty(new Error(errorObject.message), "__NEXT_ERROR_CODE", {
value: "E394",
enumerable: false,
configurable: true
});
error.stack = errorObject.stack;
handleErrors([
error
]);
}
return;
}
case _hotreloadertypes.HMR_MESSAGE_SENT_TO_BROWSER.TURBOPACK_CONNECTED:
{
for (const listener of turbopackMessageListeners){
listener({
type: _hotreloadertypes.HMR_MESSAGE_SENT_TO_BROWSER.TURBOPACK_CONNECTED,
data: message.data
});
}
break;
}
case _hotreloadertypes.HMR_MESSAGE_SENT_TO_BROWSER.TURBOPACK_MESSAGE:
{
turbopackHmr.onTurbopackMessage(message);
_nextdevtools.dispatcher.onBeforeRefresh();
for (const listener of turbopackMessageListeners){
listener({
type: _hotreloadertypes.HMR_MESSAGE_SENT_TO_BROWSER.TURBOPACK_MESSAGE,
data: message.data
});
}
if (_runtimeerrorhandler.RuntimeErrorHandler.hadRuntimeError) {
console.warn(_shared.REACT_REFRESH_FULL_RELOAD_FROM_ERROR);
performFullReload(null);
}
_nextdevtools.dispatcher.onRefresh();
break;
}
case _hotreloadertypes.HMR_MESSAGE_SENT_TO_BROWSER.ADDED_PAGE:
case _hotreloadertypes.HMR_MESSAGE_SENT_TO_BROWSER.REMOVED_PAGE:
case _hotreloadertypes.HMR_MESSAGE_SENT_TO_BROWSER.RELOAD_PAGE:
case _hotreloadertypes.HMR_MESSAGE_SENT_TO_BROWSER.DEV_PAGES_MANIFEST_UPDATE:
if (customHmrEventHandler) {
customHmrEventHandler(message);
}
break;
case _hotreloadertypes.HMR_MESSAGE_SENT_TO_BROWSER.DEVTOOLS_CONFIG:
_nextdevtools.dispatcher.onDevToolsConfig(message.data);
break;
case _hotreloadertypes.HMR_MESSAGE_SENT_TO_BROWSER.CACHE_INDICATOR:
case _hotreloadertypes.HMR_MESSAGE_SENT_TO_BROWSER.REACT_DEBUG_CHUNK:
case _hotreloadertypes.HMR_MESSAGE_SENT_TO_BROWSER.ERRORS_TO_SHOW_IN_BROWSER:
break;
case _hotreloadertypes.HMR_MESSAGE_SENT_TO_BROWSER.MIDDLEWARE_CHANGES:
case _hotreloadertypes.HMR_MESSAGE_SENT_TO_BROWSER.CLIENT_CHANGES:
case _hotreloadertypes.HMR_MESSAGE_SENT_TO_BROWSER.SERVER_ONLY_CHANGES:
break;
case _hotreloadertypes.HMR_MESSAGE_SENT_TO_BROWSER.REQUEST_CURRENT_ERROR_STATE:
{
const errorState = (0, _nextdevtools.getSerializedOverlayState)();
const response = {
event: _hotreloadertypes.HMR_MESSAGE_SENT_TO_SERVER.MCP_ERROR_STATE_RESPONSE,
requestId: message.requestId,
errorState,
url: window.location.href
};
(0, _websocket.sendMessage)(JSON.stringify(response));
break;
}
case _hotreloadertypes.HMR_MESSAGE_SENT_TO_BROWSER.REQUEST_PAGE_METADATA:
{
const segmentTrieData = (0, _nextdevtools.getSegmentTrieData)();
const response = {
event: _hotreloadertypes.HMR_MESSAGE_SENT_TO_SERVER.MCP_PAGE_METADATA_RESPONSE,
requestId: message.requestId,
segmentTrieData,
url: window.location.href
};
(0, _websocket.sendMessage)(JSON.stringify(response));
return;
}
default:
message;
}
}
// Is there a newer version of this code available?
function isUpdateAvailable() {
/* globals __webpack_hash__ */ // __webpack_hash__ is the hash of the current compilation.
// It's a global variable injected by Webpack.
return mostRecentCompilationHash !== __webpack_hash__;
}
// Webpack disallows updates in other states.
function canApplyUpdates() {
return module.hot.status() === 'idle';
}
function afterApplyUpdates(fn) {
if (canApplyUpdates()) {
fn();
} else {
function handler(status) {
if (status === 'idle') {
module.hot.removeStatusHandler(handler);
fn();
}
}
module.hot.addStatusHandler(handler);
}
}
// Attempt to update code on the fly, fall back to a hard reload.
function tryApplyUpdatesWebpack() {
if (!module.hot) {
// HotModuleReplacementPlugin is not in Webpack configuration.
console.error('HotModuleReplacementPlugin is not in Webpack configuration.');
// window.location.reload();
return;
}
if (!isUpdateAvailable() || !canApplyUpdates()) {
_nextdevtools.dispatcher.onBuildOk();
return;
}
function handleApplyUpdates(err, updatedModules) {
if (err || _runtimeerrorhandler.RuntimeErrorHandler.hadRuntimeError || updatedModules == null) {
if (err) {
console.warn(_shared.REACT_REFRESH_FULL_RELOAD);
} else if (_runtimeerrorhandler.RuntimeErrorHandler.hadRuntimeError) {
console.warn(_shared.REACT_REFRESH_FULL_RELOAD_FROM_ERROR);
}
performFullReload(err);
return;
}
_nextdevtools.dispatcher.onBuildOk();
if (isUpdateAvailable()) {
// While we were updating, there was a new update! Do it again.
tryApplyUpdatesWebpack();
return;
}
_nextdevtools.dispatcher.onRefresh();
(0, _reporthmrlatency.default)(_websocket.sendMessage, updatedModules, webpackStartMsSinceEpoch, Date.now());
if (process.env.__NEXT_TEST_MODE) {
afterApplyUpdates(()=>{
if (self.__NEXT_HMR_CB) {
self.__NEXT_HMR_CB();
self.__NEXT_HMR_CB = null;
}
});
}
}
// https://webpack.js.org/api/hot-module-replacement/#check
module.hot.check(/* autoApply */ false).then((updatedModules)=>{
if (updatedModules == null) {
return null;
}
// We should always handle an update, even if updatedModules is empty (but
// non-null) for any reason. That's what webpack would normally do:
// https://github.com/webpack/webpack/blob/3aa6b6bc3a64/lib/hmr/HotModuleReplacement.runtime.js#L296-L298
_nextdevtools.dispatcher.onBeforeRefresh();
// https://webpack.js.org/api/hot-module-replacement/#apply
return module.hot.apply();
}).then((updatedModules)=>{
handleApplyUpdates(null, updatedModules);
}, (err)=>{
handleApplyUpdates(err, null);
});
}
function performFullReload(err) {
const stackTrace = err && (err.stack && err.stack.split('\n').slice(0, 5).join('\n') || err.message || err + '');
(0, _websocket.sendMessage)(JSON.stringify({
event: 'client-full-reload',
stackTrace,
hadRuntimeError: !!_runtimeerrorhandler.RuntimeErrorHandler.hadRuntimeError,
dependencyChain: err ? err.dependencyChain : undefined
}));
window.location.reload();
}
if ((typeof exports.default === 'function' || (typeof exports.default === 'object' && exports.default !== null)) && typeof exports.default.__esModule === 'undefined') {
Object.defineProperty(exports.default, '__esModule', { value: true });
Object.assign(exports.default, exports);
module.exports = exports.default;
}
//# sourceMappingURL=hot-reloader-pages.js.map

File diff suppressed because one or more lines are too long

View File

@@ -0,0 +1,9 @@
import { type HmrMessageSentToBrowser } from '../../../../server/dev/hot-reloader-types';
type MessageCallback = (message: HmrMessageSentToBrowser) => void;
export declare function addMessageListener(callback: MessageCallback): void;
export declare function sendMessage(data: string): void;
export declare function connectHMR(options: {
path: string;
assetPrefix: string;
}): void;
export {};

View File

@@ -0,0 +1,106 @@
"use strict";
Object.defineProperty(exports, "__esModule", {
value: true
});
0 && (module.exports = {
addMessageListener: null,
connectHMR: null,
sendMessage: null
});
function _export(target, all) {
for(var name in all)Object.defineProperty(target, name, {
enumerable: true,
get: all[name]
});
}
_export(exports, {
addMessageListener: function() {
return addMessageListener;
},
connectHMR: function() {
return connectHMR;
},
sendMessage: function() {
return sendMessage;
}
});
const _forwardlogs = require("../../../../next-devtools/userspace/app/forward-logs");
const _hotreloadertypes = require("../../../../server/dev/hot-reloader-types");
const _getsocketurl = require("../get-socket-url");
const _constants = require("../../../../lib/constants");
let source;
const messageCallbacks = [];
function addMessageListener(callback) {
messageCallbacks.push(callback);
}
function sendMessage(data) {
if (!source || source.readyState !== source.OPEN) return;
return source.send(data);
}
let reconnections = 0;
let reloading = false;
let serverSessionId = null;
function connectHMR(options) {
let timer;
function init() {
if (source) source.close();
function handleOnline() {
_forwardlogs.logQueue.onSocketReady(source);
reconnections = 0;
window.console.log('[HMR] connected');
}
function handleMessage(event) {
// While the page is reloading, don't respond to any more messages.
// On reconnect, the server may send an empty list of changes if it was restarted.
if (reloading) {
return;
}
const message = JSON.parse(event.data);
if (message.type === _hotreloadertypes.HMR_MESSAGE_SENT_TO_BROWSER.TURBOPACK_CONNECTED) {
if (serverSessionId !== null && serverSessionId !== message.data.sessionId) {
// Either the server's session id has changed and it's a new server, or
// it's been too long since we disconnected and we should reload the page.
// There could be 1) unhandled server errors and/or 2) stale content.
// Perform a hard reload of the page.
window.location.reload();
reloading = true;
return;
}
serverSessionId = message.data.sessionId;
}
for (const messageCallback of messageCallbacks){
messageCallback(message);
}
}
function handleDisconnect() {
source.onerror = null;
source.onclose = null;
source.close();
reconnections++;
// After 25 reconnects we'll want to reload the page as it indicates the dev server is no longer running.
if (reconnections > _constants.WEB_SOCKET_MAX_RECONNECTIONS) {
reloading = true;
window.location.reload();
return;
}
clearTimeout(timer);
// Try again after 5 seconds
timer = setTimeout(init, reconnections > 5 ? 5000 : 1000);
}
const url = (0, _getsocketurl.getSocketUrl)(options.assetPrefix);
source = new window.WebSocket(`${url}${options.path}`);
source.onopen = handleOnline;
source.onerror = handleDisconnect;
source.onclose = handleDisconnect;
source.onmessage = handleMessage;
}
init();
}
if ((typeof exports.default === 'function' || (typeof exports.default === 'object' && exports.default !== null)) && typeof exports.default.__esModule === 'undefined') {
Object.defineProperty(exports.default, '__esModule', { value: true });
Object.assign(exports.default, exports);
module.exports = exports.default;
}
//# sourceMappingURL=websocket.js.map

File diff suppressed because one or more lines are too long

View File

@@ -0,0 +1,4 @@
import type { HmrMessageSentToBrowser } from '../../../server/dev/hot-reloader-types';
export declare const REACT_REFRESH_FULL_RELOAD: string;
export declare const REACT_REFRESH_FULL_RELOAD_FROM_ERROR = "[Fast Refresh] performing full reload because your application had an unrecoverable error";
export declare function reportInvalidHmrMessage(message: HmrMessageSentToBrowser | MessageEvent<unknown>, err: unknown): void;

View File

@@ -0,0 +1,39 @@
"use strict";
Object.defineProperty(exports, "__esModule", {
value: true
});
0 && (module.exports = {
REACT_REFRESH_FULL_RELOAD: null,
REACT_REFRESH_FULL_RELOAD_FROM_ERROR: null,
reportInvalidHmrMessage: null
});
function _export(target, all) {
for(var name in all)Object.defineProperty(target, name, {
enumerable: true,
get: all[name]
});
}
_export(exports, {
REACT_REFRESH_FULL_RELOAD: function() {
return REACT_REFRESH_FULL_RELOAD;
},
REACT_REFRESH_FULL_RELOAD_FROM_ERROR: function() {
return REACT_REFRESH_FULL_RELOAD_FROM_ERROR;
},
reportInvalidHmrMessage: function() {
return reportInvalidHmrMessage;
}
});
const REACT_REFRESH_FULL_RELOAD = '[Fast Refresh] performing full reload\n\n' + "Fast Refresh will perform a full reload when you edit a file that's imported by modules outside of the React rendering tree.\n" + 'You might have a file which exports a React component but also exports a value that is imported by a non-React component file.\n' + 'Consider migrating the non-React component export to a separate file and importing it into both files.\n\n' + 'It is also possible the parent component of the component you edited is a class component, which disables Fast Refresh.\n' + 'Fast Refresh requires at least one parent function component in your React tree.';
const REACT_REFRESH_FULL_RELOAD_FROM_ERROR = '[Fast Refresh] performing full reload because your application had an unrecoverable error';
function reportInvalidHmrMessage(message, err) {
console.warn('[HMR] Invalid message: ' + JSON.stringify(message) + '\n' + (err instanceof Error && err?.stack || ''));
}
if ((typeof exports.default === 'function' || (typeof exports.default === 'object' && exports.default !== null)) && typeof exports.default.__esModule === 'undefined') {
Object.defineProperty(exports.default, '__esModule', { value: true });
Object.assign(exports.default, exports);
module.exports = exports.default;
}
//# sourceMappingURL=shared.js.map

View File

@@ -0,0 +1 @@
{"version":3,"sources":["../../../../src/client/dev/hot-reloader/shared.ts"],"sourcesContent":["import type { HmrMessageSentToBrowser } from '../../../server/dev/hot-reloader-types'\n\nexport const REACT_REFRESH_FULL_RELOAD =\n '[Fast Refresh] performing full reload\\n\\n' +\n \"Fast Refresh will perform a full reload when you edit a file that's imported by modules outside of the React rendering tree.\\n\" +\n 'You might have a file which exports a React component but also exports a value that is imported by a non-React component file.\\n' +\n 'Consider migrating the non-React component export to a separate file and importing it into both files.\\n\\n' +\n 'It is also possible the parent component of the component you edited is a class component, which disables Fast Refresh.\\n' +\n 'Fast Refresh requires at least one parent function component in your React tree.'\n\nexport const REACT_REFRESH_FULL_RELOAD_FROM_ERROR =\n '[Fast Refresh] performing full reload because your application had an unrecoverable error'\n\nexport function reportInvalidHmrMessage(\n message: HmrMessageSentToBrowser | MessageEvent<unknown>,\n err: unknown\n) {\n console.warn(\n '[HMR] Invalid message: ' +\n JSON.stringify(message) +\n '\\n' +\n ((err instanceof Error && err?.stack) || '')\n )\n}\n"],"names":["REACT_REFRESH_FULL_RELOAD","REACT_REFRESH_FULL_RELOAD_FROM_ERROR","reportInvalidHmrMessage","message","err","console","warn","JSON","stringify","Error","stack"],"mappings":";;;;;;;;;;;;;;;;IAEaA,yBAAyB;eAAzBA;;IAQAC,oCAAoC;eAApCA;;IAGGC,uBAAuB;eAAvBA;;;AAXT,MAAMF,4BACX,8CACA,mIACA,qIACA,+GACA,8HACA;AAEK,MAAMC,uCACX;AAEK,SAASC,wBACdC,OAAwD,EACxDC,GAAY;IAEZC,QAAQC,IAAI,CACV,4BACEC,KAAKC,SAAS,CAACL,WACf,OACC,CAAA,AAACC,eAAeK,SAASL,KAAKM,SAAU,EAAC;AAEhD","ignoreList":[0]}

View File

@@ -0,0 +1,28 @@
import type { TurbopackMessage } from '../../../server/dev/hot-reloader-types';
declare global {
interface Window {
__NEXT_HMR_TURBOPACK_REPORT_NOISY_NOOP_EVENTS: boolean | undefined;
}
}
interface HmrUpdate {
hasUpdates: boolean;
updatedModules: Set<string>;
startMsSinceEpoch: number;
endMsSinceEpoch: number;
}
export declare class TurbopackHmr {
#private;
constructor();
onBuilding(): void;
onTurbopackMessage(msg: TurbopackMessage): void;
onServerComponentChanges(): void;
onReloadPage(): void;
onPageAddRemove(): void;
/**
* @returns `null` if the caller should ignore the update entirely. Returns an
* object with `hasUpdates: false` if the caller should report the end of
* the HMR in the browser console, but the HMR was a no-op.
*/
onBuilt(): HmrUpdate | null;
}
export {};

View File

@@ -0,0 +1,128 @@
"use strict";
Object.defineProperty(exports, "__esModule", {
value: true
});
Object.defineProperty(exports, "TurbopackHmr", {
enumerable: true,
get: function() {
return TurbopackHmr;
}
});
// How long to wait before reporting the HMR start, used to suppress irrelevant
// `BUILDING` events. Does not impact reported latency.
const TURBOPACK_HMR_START_DELAY_MS = 100;
class TurbopackHmr {
#updatedModules;
#startMsSinceEpoch;
#lastUpdateMsSinceEpoch;
#deferredReportHmrStartId;
#reportedHmrStart;
constructor(){
this.#updatedModules = new Set();
this.#reportedHmrStart = false;
}
// HACK: Turbopack tends to generate a lot of irrelevant "BUILDING" actions,
// as it reports *any* compilation, including fully no-op/cached compilations
// and those unrelated to HMR. Fixing this would require significant
// architectural changes.
//
// Work around this by deferring any "rebuilding" message by 100ms. If we get
// a BUILT event within that threshold and nothing has changed, just suppress
// the message entirely.
#runDeferredReportHmrStart() {
if (this.#deferredReportHmrStartId != null) {
console.log('[Fast Refresh] rebuilding');
this.#reportedHmrStart = true;
this.#cancelDeferredReportHmrStart();
}
}
#cancelDeferredReportHmrStart() {
clearTimeout(this.#deferredReportHmrStartId);
this.#deferredReportHmrStartId = undefined;
}
onBuilding() {
this.#lastUpdateMsSinceEpoch = undefined;
this.#cancelDeferredReportHmrStart();
this.#startMsSinceEpoch = Date.now();
// report the HMR start after a short delay
this.#deferredReportHmrStartId = setTimeout(()=>this.#runDeferredReportHmrStart(), // debugging feature: don't defer/suppress noisy no-op HMR update messages
self.__NEXT_HMR_TURBOPACK_REPORT_NOISY_NOOP_EVENTS ? 0 : TURBOPACK_HMR_START_DELAY_MS);
}
/** Helper for other `onEvent` methods. */ #onUpdate() {
this.#runDeferredReportHmrStart();
this.#lastUpdateMsSinceEpoch = Date.now();
}
onTurbopackMessage(msg) {
this.#onUpdate();
const updatedModules = extractModulesFromTurbopackMessage(msg.data);
for (const module of updatedModules){
this.#updatedModules.add(module);
}
}
onServerComponentChanges() {
this.#onUpdate();
}
onReloadPage() {
this.#onUpdate();
}
onPageAddRemove() {
this.#onUpdate();
}
/**
* @returns `null` if the caller should ignore the update entirely. Returns an
* object with `hasUpdates: false` if the caller should report the end of
* the HMR in the browser console, but the HMR was a no-op.
*/ onBuilt() {
// Check that we got *any* `TurbopackMessage`, even if
// `updatedModules` is empty (not everything gets recorded there).
//
// There's also a case where `onBuilt` gets called before `onBuilding`,
// which can happen during initial page load. Ignore that too!
const hasUpdates = this.#lastUpdateMsSinceEpoch != null && this.#startMsSinceEpoch != null;
if (!hasUpdates && !this.#reportedHmrStart) {
// suppress the update entirely
this.#cancelDeferredReportHmrStart();
return null;
}
this.#runDeferredReportHmrStart();
const result = {
hasUpdates,
updatedModules: this.#updatedModules,
startMsSinceEpoch: this.#startMsSinceEpoch,
endMsSinceEpoch: this.#lastUpdateMsSinceEpoch ?? Date.now()
};
this.#updatedModules = new Set();
this.#reportedHmrStart = false;
return result;
}
}
function extractModulesFromTurbopackMessage(data) {
const updatedModules = new Set();
const updates = Array.isArray(data) ? data : [
data
];
for (const update of updates){
// TODO this won't capture changes to CSS since they don't result in a "merged" update
if (update.type !== 'partial' || update.instruction.type !== 'ChunkListUpdate' || update.instruction.merged === undefined) {
continue;
}
for (const mergedUpdate of update.instruction.merged){
for (const name of Object.keys(mergedUpdate.entries)){
const res = /(.*)\s+[([].*/.exec(name);
if (res === null) {
continue;
}
updatedModules.add(res[1]);
}
}
}
return updatedModules;
}
if ((typeof exports.default === 'function' || (typeof exports.default === 'object' && exports.default !== null)) && typeof exports.default.__esModule === 'undefined') {
Object.defineProperty(exports.default, '__esModule', { value: true });
Object.assign(exports.default, exports);
module.exports = exports.default;
}
//# sourceMappingURL=turbopack-hot-reloader-common.js.map

File diff suppressed because one or more lines are too long