@shuvi/platform-web 1.0.0-rc.2 → 1.0.0-rc.5

package/esm/shared/appTypes.d.ts

@@ -1,4 +1,4 @@
-import { IRequest, IRawPageRouteRecord, IAppData, IAppState } from '@shuvi/platform-shared/shared';
+import { IRequest, IPageRouteRecord, IAppData, IAppState } from '@shuvi/platform-shared/shared';
 import { Application } from '@shuvi/platform-shared/shuvi-app/application';
 export interface CreateAppServer {
     (options: {
@@ -8,7 +8,7 @@ export interface CreateAppServer {
 }
 export interface CreateAppClient {
     (options: {
-        routes: IRawPageRouteRecord[];
+        routes: IPageRouteRecord[];
         appComponent: any;
         appData: IAppData<any, IAppState>;
     }): Application;

package/esm/shared/renderTypes.d.ts

@@ -1,10 +1,10 @@
 import { IManifest } from '@shuvi/toolpack/lib/webpack/types';
 import { Response, IApplication, IRequest, IAppData } from '@shuvi/platform-shared/shared';
-export declare type IRenderDocumentOptions = {
+export declare type IRenderViewOptions = {
     app: IApplication;
     req?: IRequest;
 };
-export interface IRenderOptions extends IRenderDocumentOptions {
+export interface IRenderOptions extends IRenderViewOptions {
 }
 export interface IView<RenderOption extends IRenderOptions = any, RenderResult = void> {
     renderApp(options: RenderOption): RenderResult;

package/esm/shuvi-app/app/client.d.ts

@@ -1,2 +1,4 @@
+import { Application } from '@shuvi/platform-shared/shuvi-app/application';
 import { CreateAppClient } from '../../shared';
+export { Application };
 export declare const createApp: CreateAppClient;

package/esm/shuvi-app/app/client.js

@@ -8,19 +8,20 @@ var __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, ge
     });
 };
 import { getRoutes } from '@shuvi/app/core/platform';
-import { runPreload, runLoaders, getRouteMatchesWithInvalidLoader, getLoaderManager, isRedirect, isResponse } from '@shuvi/platform-shared/shared';
-import application from '@shuvi/platform-shared/shuvi-app/application';
+import { runPreload, runLoaders, getRouteMatchesWithInvalidLoader, isRedirect, isResponse } from '@shuvi/platform-shared/shared';
+import application, { Application } from '@shuvi/platform-shared/shuvi-app/application';
 import { createRouter, createBrowserHistory, createHashHistory } from '@shuvi/router';
 import pageLoaders from '@shuvi/app/files/page-loaders';
 import { historyMode } from '@shuvi/app/files/routerConfig';
 import { SHUVI_ERROR } from '@shuvi/shared/lib/constants';
 let app;
+export { Application };
 export const createApp = ({ routes, appData, appComponent }) => {
     // app is a singleton in client side
     if (app) {
         return app;
     }
-    const { loadersData = {}, appState, ssr } = appData;
+    const { appState, ssr } = appData;
     let history;
     if (historyMode === 'hash') {
         history = createHashHistory();
@@ -37,14 +38,14 @@ export const createApp = ({ routes, appData, appComponent }) => {
         AppComponent: appComponent,
         router
     });
+    const loadersData = app.getLoadersData();
     const hasHydrateData = Object.keys(loadersData).length > 0;
-    const loaderManager = getLoaderManager();
     let shouldHydrate = ssr && hasHydrateData;
-    let hasServerError = app.error.hasError;
+    let hasServerError = !!app.error;
     router.beforeResolve((to, from, next) => __awaiter(void 0, void 0, void 0, function* () {
         if (shouldHydrate) {
             shouldHydrate = false;
-            loaderManager.setDatas(loadersData);
+            app.setLoadersData(loadersData);
             return next();
         }
         if (hasServerError) {
@@ -52,7 +53,7 @@ export const createApp = ({ routes, appData, appComponent }) => {
             return next();
         }
         if (!to.matches.length) {
-            app.error.error(SHUVI_ERROR.PAGE_NOT_FOUND);
+            app.setError(SHUVI_ERROR.PAGE_NOT_FOUND);
             next();
             return;
         }
@@ -95,7 +96,7 @@ export const createApp = ({ routes, appData, appComponent }) => {
                     tryResolve();
                 });
             });
-            loaderManager.setDatas(loaderDatas);
+            app.setLoadersData(loaderDatas);
         }
         catch (error) {
             if (isRedirect(error)) {
@@ -103,14 +104,14 @@ export const createApp = ({ routes, appData, appComponent }) => {
                 return;
             }
             if (isResponse(error) && error.status >= 400 && error.status < 600) {
-                app.error.error({
+                app.setError({
                     code: error.status,
                     message: error.data
                 });
                 next();
                 return;
             }
-            app.error.error({
+            app.setError({
                 code: SHUVI_ERROR.APP_ERROR.code,
                 message: error.message || isPreloadError ? 'Preload Error' : 'Loader Error'
             });
@@ -118,7 +119,7 @@ export const createApp = ({ routes, appData, appComponent }) => {
             return;
         }
         next(() => {
-            app.error.clear();
+            app.clearError();
         });
     }));
     return app;

package/esm/shuvi-app/app/server.js

@@ -9,7 +9,7 @@ var __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, ge
 };
 import routes from '@shuvi/app/files/routes';
 import { getRoutes, app as AppComponent } from '@shuvi/app/core/platform';
-import { runLoaders, getRouteMatchesWithInvalidLoader, isResponse, isRedirect, getLoaderManager } from '@shuvi/platform-shared/shared';
+import { runLoaders, getRouteMatchesWithInvalidLoader, isResponse, isRedirect } from '@shuvi/platform-shared/shared';
 import pageLoaders from '@shuvi/app/files/page-loaders';
 import application from '@shuvi/platform-shared/shuvi-app/application';
 import { createRouter, createMemoryHistory } from '@shuvi/router';
@@ -24,7 +24,6 @@ export const createApp = options => {
         routes: getRoutes(routes)
     });
     let app;
-    const loaderManager = getLoaderManager();
     if (ssr) {
         router.beforeResolve((to, from, next) => __awaiter(void 0, void 0, void 0, function* () {
             const matches = getRouteMatchesWithInvalidLoader(to, from, pageLoaders);
@@ -35,7 +34,7 @@ export const createApp = options => {
                     query: to.query,
                     getAppContext: () => app.context
                 });
-                loaderManager.setDatas(loaderResult);
+                app.setLoadersData(loaderResult);
             }
             catch (error) {
                 if (isRedirect(error)) {
@@ -43,14 +42,14 @@ export const createApp = options => {
                     return;
                 }
                 if (isResponse(error) && error.status >= 400 && error.status < 600) {
-                    app.error.error({
+                    app.setError({
                         code: error.status,
                         message: error.data
                     });
                     next();
                     return;
                 }
-                app.error.error({
+                app.setError({
                     message: error.message || 'Loader Error'
                 });
                 next();

package/esm/shuvi-app/dev/eventsource.d.ts

@@ -0,0 +1 @@
+export function getEventSourceWrapper(options: any): any;

package/esm/shuvi-app/dev/eventsource.js

@@ -0,0 +1,60 @@
+const eventCallbacks = [];
+function EventSourceWrapper(options) {
+    var source;
+    var lastActivity = new Date();
+    var listeners = [];
+    if (!options.timeout) {
+        options.timeout = 20 * 1000;
+    }
+    init();
+    var timer = setInterval(function () {
+        if (new Date() - lastActivity > options.timeout) {
+            handleDisconnect();
+        }
+    }, options.timeout / 2);
+    function init() {
+        source = new window.EventSource(options.path);
+        source.onopen = handleOnline;
+        source.onerror = handleDisconnect;
+        source.onmessage = handleMessage;
+    }
+    function handleOnline() {
+        if (options.log)
+            console.log('[HMR] connected');
+        lastActivity = new Date();
+    }
+    function handleMessage(event) {
+        lastActivity = new Date();
+        for (var i = 0; i < listeners.length; i++) {
+            listeners[i](event);
+        }
+        if (event.data.indexOf('action') !== -1) {
+            eventCallbacks.forEach(cb => cb(event));
+        }
+    }
+    function handleDisconnect() {
+        clearInterval(timer);
+        source.close();
+        setTimeout(init, options.timeout);
+    }
+    return {
+        onclose: () => {
+            clearTimeout(timer);
+            source.close();
+        },
+        addMessageListener: function (fn) {
+            listeners.push(fn);
+        }
+    };
+}
+export function getEventSourceWrapper(options) {
+    if (!window.__whmEventSourceWrapper) {
+        window.__whmEventSourceWrapper = {};
+    }
+    if (!window.__whmEventSourceWrapper[options.path]) {
+        // cache the wrapper for other entries loaded on
+        // the same page with the same options.path
+        window.__whmEventSourceWrapper[options.path] = EventSourceWrapper(options);
+    }
+    return window.__whmEventSourceWrapper[options.path];
+}

package/esm/shuvi-app/dev/hotDevClient.d.ts

@@ -0,0 +1,33 @@
+/**
+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.
+*/
+export declare type HotDevClient = {
+    sendMessage: (data: any) => void;
+    subscribeToHmrEvent: (handler: any) => void;
+    reportRuntimeError: (err: any) => void;
+};
+export default function connect(options: {
+    launchEditorEndpoint: string;
+    path: string;
+    location: Location;
+}): HotDevClient;

package/esm/shuvi-app/dev/hotDevClient.js

@@ -0,0 +1,348 @@
+/* eslint-disable camelcase */
+/**
+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.
+*/
+// This file is based on https://github.com/facebook/create-react-app/blob/v1.1.4/packages/react-dev-utils/webpackHotDevClient.js
+// It's been edited to rely on webpack-hot-middleware.
+var __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, generator) {
+    function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }
+    return new (P || (P = Promise))(function (resolve, reject) {
+        function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }
+        function rejected(value) { try { step(generator["throw"](value)); } catch (e) { reject(e); } }
+        function step(result) { result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected); }
+        step((generator = generator.apply(thisArg, _arguments || [])).next());
+    });
+};
+// @ts-nocheck
+import * as ErrorOverlay from 'react-error-overlay';
+import stripAnsi from 'strip-ansi';
+import formatWebpackMessages from '@shuvi/toolpack/lib/utils/formatWebpackMessages';
+import { DEV_SOCKET_TIMEOUT_MS } from '@shuvi/shared/esm/constants';
+import { connectHMR, addMessageListener, sendMessage } from './websocket';
+// This alternative WebpackDevServer combines the functionality of:
+// https://github.com/webpack/webpack-dev-server/blob/webpack-1/client/index.js
+// https://github.com/webpack/webpack/blob/webpack-1/hot/dev-server.js
+// It only supports their simplest configuration (hot updates on same server).
+// It makes some opinionated choices on top, like adding a syntax error overlay
+// that looks similar to our console output. The error overlay is inspired by:
+// https://github.com/glenjamin/webpack-hot-middleware
+// This is a modified version of create-react-app's webpackHotDevClient.js
+// It implements webpack-hot-middleware's EventSource events instead of webpack-dev-server's websocket.
+// https://github.com/facebook/create-react-app/blob/25184c4e91ebabd16fe1cde3d8630830e4a36a01/packages/react-dev-utils/webpackHotDevClient.js
+let hadRuntimeError = false;
+let customHmrEventHandler;
+export default function connect(options) {
+    // Open stack traces in an editor.
+    ErrorOverlay.setEditorHandler(function editorHandler({ fileName, lineNumber, colNumber }) {
+        // Resolve invalid paths coming from react-error-overlay
+        const resolvedFilename = fileName.replace(/^webpack:\/\/[^/]+/ /* webpack://namaspcae/resourcepath */, '');
+        fetch(options.launchEditorEndpoint +
+            '?fileName=' +
+            window.encodeURIComponent(resolvedFilename) +
+            '&lineNumber=' +
+            window.encodeURIComponent(lineNumber || 1) +
+            '&colNumber=' +
+            window.encodeURIComponent(colNumber || 1));
+    });
+    // We need to keep track of if there has been a runtime error.
+    // Essentially, we cannot guarantee application state was not corrupted by the
+    // runtime error. To prevent confusing behavior, we forcibly reload the entire
+    // application. This is handled below when we are notified of a compile (code
+    // change).
+    // See https://github.com/facebook/create-react-app/issues/3096
+    ErrorOverlay.startReportingRuntimeErrors({
+        onError: function () {
+            hadRuntimeError = true;
+        }
+    });
+    if (module.hot && typeof module.hot.dispose === 'function') {
+        module.hot.dispose(function () {
+            // TODO: why do we need this?
+            ErrorOverlay.stopReportingRuntimeErrors();
+        });
+    }
+    connectHMR(Object.assign(Object.assign({}, options), { log: true }));
+    addMessageListener(event => {
+        // This is the heartbeat event
+        const obj = JSON.parse(event.data);
+        if (obj.action === 'pong') {
+            return;
+        }
+        try {
+            processMessage(event);
+        }
+        catch (ex) {
+            console.warn('Invalid HMR message: ' + event.data + '\n' + ex);
+        }
+    });
+    setInterval(() => {
+        sendMessage(JSON.stringify({ event: 'ping' }));
+    }, DEV_SOCKET_TIMEOUT_MS / 2);
+    return {
+        sendMessage(data) {
+            sendMessage(data);
+        },
+        subscribeToHmrEvent(handler) {
+            customHmrEventHandler = handler;
+        },
+        reportRuntimeError(err) {
+            ErrorOverlay.reportRuntimeError(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();
+        }
+    }
+}
+let startLatency = undefined;
+function onFastRefresh() {
+    tryDismissErrorOverlay();
+    if (startLatency) {
+        const endLatency = Date.now();
+        const latency = endLatency - startLatency;
+        console.log(`[Fast Refresh] done in ${latency}ms`);
+    }
+}
+// Successful compilation.
+function handleSuccess() {
+    clearOutdatedErrors();
+    const isHotUpdate = !isFirstCompilation;
+    isFirstCompilation = false;
+    hasCompileErrors = false;
+    // Attempt to apply hot updates or reload.
+    if (isHotUpdate) {
+        tryApplyUpdates(function onHotUpdateSuccess() {
+            // Only dismiss it when we're sure it's a hot update.
+            // Otherwise it would flicker right before the reload.
+            onFastRefresh();
+        });
+    }
+}
+// Compilation with warnings (e.g. ESLint).
+function handleWarnings(warnings) {
+    clearOutdatedErrors();
+    var isHotUpdate = !isFirstCompilation;
+    isFirstCompilation = false;
+    hasCompileErrors = false;
+    // Print warnings to the console.
+    const formatted = formatWebpackMessages({
+        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(stripAnsi(formatted.warnings[i]));
+        }
+    }
+    // Attempt to apply hot updates or reload.
+    if (isHotUpdate) {
+        tryApplyUpdates(function onSuccessfulHotUpdate() {
+            // Only dismiss it when we're sure it's a hot update.
+            // Otherwise it would flicker right before the reload.
+            tryDismissErrorOverlay();
+            onFastRefresh();
+        });
+    }
+}
+// Compilation with errors (e.g. syntax error or missing modules).
+function handleErrors(errors) {
+    clearOutdatedErrors();
+    isFirstCompilation = false;
+    hasCompileErrors = true;
+    // "Massage" webpack messages.
+    var formatted = formatWebpackMessages({
+        errors: errors,
+        warnings: []
+    });
+    // Only show the first error.
+    ErrorOverlay.reportBuildError(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(stripAnsi(formatted.errors[i]));
+        }
+    }
+}
+function tryDismissErrorOverlay() {
+    if (!hasCompileErrors) {
+        ErrorOverlay.dismissBuildError();
+    }
+}
+// There is a newer version of the code available.
+function handleAvailableHash(hash) {
+    // Update last known compilation hash.
+    mostRecentCompilationHash = hash;
+}
+// Handle messages from the server.
+function processMessage(e) {
+    const obj = JSON.parse(e.data);
+    switch (obj.action) {
+        case 'building': {
+            startLatency = Date.now();
+            console.log('[Fast Refresh] bundle ' +
+                (obj.name ? "'" + obj.name + "' " : '') +
+                'rebuilding');
+            break;
+        }
+        case 'built':
+        case 'sync': {
+            if (obj.hash) {
+                handleAvailableHash(obj.hash);
+            }
+            const { errors, warnings } = obj;
+            const hasErrors = Boolean(errors && errors.length);
+            if (hasErrors) {
+                return handleErrors(errors);
+            }
+            const hasWarnings = Boolean(warnings && warnings.length);
+            if (hasWarnings) {
+                return handleWarnings(warnings);
+            }
+            return handleSuccess();
+        }
+        case 'warnings':
+            handleWarnings(obj.data);
+            break;
+        case 'errors':
+            handleErrors(obj.data);
+            break;
+        default: {
+            if (customHmrEventHandler) {
+                customHmrEventHandler(obj);
+                break;
+            }
+            break;
+        }
+    }
+}
+// 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 waitForReady() {
+    return new Promise((resolve, reject) => {
+        if (module.hot.status() !== 'prepare') {
+            reject();
+        }
+        const handler = status => {
+            module.hot.removeStatusHandler(handler);
+            if (status === 'ready') {
+                resolve();
+            }
+            if (status === 'abort' || status === 'fail') {
+                reject();
+            }
+        };
+        module.hot.addStatusHandler(handler);
+    });
+}
+// Attempt to update code on the fly, fall back to a hard reload.
+function tryApplyUpdates(onHotUpdateSuccess) {
+    return __awaiter(this, void 0, void 0, function* () {
+        if (!module.hot) {
+            // HotModuleReplacementPlugin is not in Webpack configuration.
+            console.error('HotModuleReplacementPlugin is not in Webpack configuration.');
+            window.location.reload();
+            return;
+        }
+        if (!isUpdateAvailable() || !canApplyUpdates()) {
+            ErrorOverlay.dismissBuildError();
+            // HMR failed, need to refresh
+            const hmrStatus = module.hot.status();
+            if (hmrStatus === 'abort' || hmrStatus === 'fail') {
+                window.location.reload();
+            }
+            return;
+        }
+        function handleApplyUpdates(err, updatedModules) {
+            const needForcedReload = err || hadRuntimeError;
+            if (needForcedReload) {
+                if (hadRuntimeError) {
+                    hadRuntimeError = false;
+                    window.location.reload();
+                }
+                else {
+                    ErrorOverlay.reportRuntimeError(err);
+                    hadRuntimeError = true;
+                }
+            }
+            if (typeof onHotUpdateSuccess === 'function') {
+                // Maybe we want to do something.
+                onHotUpdateSuccess();
+            }
+            if (isUpdateAvailable()) {
+                // While we were updating, there was a new update! Do it again.
+                tryApplyUpdates(onHotUpdateSuccess);
+            }
+        }
+        try {
+            // https://webpack.js.org/api/hot-module-replacement/#check
+            let updatedModules = yield module.hot.check(/* autoApply */ false);
+            if (!updatedModules) {
+                return;
+            }
+            // if there is another updating, delay the update
+            // multiple hotupdate occurs during import() will cause hmr error
+            // so we delay the adjacent hotupdates
+            // import() == loade module script ----> require(module)
+            //                                  |
+            //                                  |
+            //     if applyUpdate happens here, require will cause a error
+            if (isUpdateAvailable()) {
+                yield new Promise(resolve => {
+                    setTimeout(resolve, 50);
+                });
+            }
+            if (updatedModules) {
+                if (module.hot.status() !== 'ready') {
+                    yield waitForReady();
+                }
+                updatedModules = yield module.hot.apply();
+            }
+            handleApplyUpdates(null, updatedModules);
+        }
+        catch (err) {
+            handleApplyUpdates(err, null);
+        }
+    });
+}

package/esm/shuvi-app/dev/index.d.ts

@@ -0,0 +1,3 @@
+import { Application } from '@shuvi/platform-shared/shuvi-app/application';
+import { HotDevClient } from './hotDevClient';
+export declare const initHMRAndDevClient: (app: Application) => HotDevClient;

package/esm/shuvi-app/dev/index.js

@@ -0,0 +1,27 @@
+import { DEV_SOCKET_TIMEOUT_MS, DEV_HOT_MIDDLEWARE_PATH, DEV_HOT_LAUNCH_EDITOR_ENDPOINT } from '@shuvi/shared/esm/constants';
+import connect from './hotDevClient';
+let devClient;
+export const initHMRAndDevClient = (app) => {
+    if (devClient) {
+        return devClient;
+    }
+    devClient = connect({
+        launchEditorEndpoint: DEV_HOT_LAUNCH_EDITOR_ENDPOINT,
+        path: DEV_HOT_MIDDLEWARE_PATH,
+        location
+    });
+    setInterval(() => {
+        devClient.sendMessage(JSON.stringify({
+            event: 'updatePageStatus',
+            currentRoutes: app.router.current.matches.map(({ route: { __componentRawRequest__ } }) => __componentRawRequest__),
+            page: location.pathname
+        }));
+    }, DEV_SOCKET_TIMEOUT_MS / 2);
+    devClient.subscribeToHmrEvent((event) => {
+        // if (obj.action === "reloadPage") {
+        //   return window.location.reload();
+        // }
+        // throw new Error("Unexpected action " + obj.action);
+    });
+    return devClient;
+};

package/esm/shuvi-app/dev/websocket.d.ts

@@ -0,0 +1,17 @@
+export declare function addMessageListener(cb: (event: any) => void): void;
+export declare function sendMessage(data: any): any;
+export declare type HotDevClient = {
+    sendMessage: (data: any) => void;
+    subscribeToHmrEvent?: (handler: any) => void;
+    reportRuntimeError?: (err: any) => void;
+};
+export declare function connectHMR(options: {
+    path: string;
+    timeout: number;
+    log?: boolean;
+    location: {
+        protocol: string;
+        hostname: string;
+        port?: string;
+    };
+}): void;