feat(platform-web): move codes from runtime-core to the new `platfo…

…rm-web`

packages/platform-mp/package.json

@@ -9,7 +9,7 @@
   "author": "liximomo",
   "license": "MIT",
   "sideEffects": [
-    "**/lib/runtime/**"
+    "**/shuvi-app/entry/**"
   ],
   "main": "./lib/index.js",
   "module": "./es/index.js",
@@ -33,6 +33,7 @@
     "@babel/plugin-syntax-dynamic-import": "^7.8.3",
     "@binance/mp-components": "^1.0.1",
     "@shuvi/app": "^0.0.1-rc.32",
+    "@shuvi/runtime-core": "^0.0.1-rc.32",
     "@shuvi/shared": "^0.0.1-rc.32",
     "@shuvi/toolpack": "^0.0.1-rc.32",
     "@shuvi/utils": "^0.0.1-rc.32",

packages/platform-mp/src/lib/platform-mp-base/index.ts

@@ -122,6 +122,11 @@ export default abstract class PlatformMpBase {
       this.themeFilePath = path.resolve(api.paths.srcDir, themeLocation);
     }
 
+    api.setClientModule({
+      application: resolveAppFile('application'),
+      entry: resolveAppFile('entry')
+    });
+
     api.setPlatformModule(resolveAppFile('index'));
     // IE11 polyfill: https://github.com/facebook/create-react-app/blob/c38aecf73f8581db4a61288268be3a56b12e8af6/packages/react-app-polyfill/README.md#polyfilling-other-language-features
     api.addAppPolyfill(resolveDep('react-app-polyfill/ie11'));
@@ -134,7 +139,8 @@ export default abstract class PlatformMpBase {
       resolveLib('@shuvi/router-react'),
       '{ useParams, useRouter, useCurrentRoute, RouterView, withRouter }'
     );
-    api.addEntryCode(`require('${this.runtimePath}')`);
+    // runtime code must run at first
+    api.addEntryCodeToTop(`require('${this.runtimePath}')`);
 
     api.addAppService(resolveRouterFile('lib', 'index'), '*', 'router-mp.js');
   }
@@ -287,7 +293,7 @@ export default abstract class PlatformMpBase {
       fn: async (config, { name }) => {
         await this.promiseRoutes;
         if (name === BUNDLER_TARGET_SERVER) {
-          config.set('entry', {});
+          config.entryPoints.clear();
           return config;
         }
         const pageFiles = getAllFiles(api.resolveAppFile('files', 'pages'));

packages/platform-mp/src/shuvi-app/application.ts

@@ -0,0 +1,21 @@
+import AppComponent from '@shuvi/app/core/app';
+import initPlugins from '@shuvi/app/user/plugin';
+import { pluginRecord } from '@shuvi/app/core/plugins';
+import { Application, runPlugins } from '@shuvi/runtime-core';
+import { Runtime } from '@shuvi/types';
+
+export const create: Runtime.ApplicationCreater = function (context, options) {
+  const app = new Application({
+    AppComponent,
+    context,
+    render: options.render
+  });
+
+  runPlugins({
+    tap: app.tap.bind(app),
+    initPlugins,
+    pluginRecord
+  });
+
+  return app;
+};

packages/platform-mp/src/shuvi-app/entry/index.ts

@@ -0,0 +1,6 @@
+// This is the shuvi client-side entry
+// IMPORTANT: `setup-env` must be runned before any other codes
+import './setup-env';
+import { app } from './setup-app';
+
+app.run();

packages/runtime-core/src/entry/client/setup-app.ts → packages/platform-mp/src/shuvi-app/entry/setup-app.ts

@@ -3,9 +3,9 @@ import { CLIENT_CONTAINER_ID } from '@shuvi/shared/lib/constants';
 // we need to init init renderer before import AppComponent
 import { view } from '@shuvi/app/core/platform';
 import { create } from '@shuvi/app/core/client/application';
-import { getAppData } from '../../helper/getAppData';
+import { helpers } from '@shuvi/runtime-core';
 import { IRouter } from '@shuvi/router/lib/types';
-const appData = getAppData();
+const appData = helpers.getAppData();
 const {
   router: { history: historyMode },
   routeProps = {}

packages/runtime-core/src/entry/client/setup-env.ts → packages/platform-mp/src/shuvi-app/entry/setup-env.ts

@@ -9,7 +9,7 @@ import {
 } from '@shuvi/shared/lib/constants';
 import setRuntimeConfig from '@shuvi/app/core/setRuntimeConfig';
 import runtimeConfig from '@shuvi/app/core/runtimeConfig';
-import { getAppData } from '../../helper/getAppData';
+import { helpers } from '@shuvi/runtime-core';
 
 // === set public path ===
 declare let __webpack_public_path__: string;
@@ -27,7 +27,7 @@ if (win[IDENTITY_RUNTIME_PUBLICPATH]) {
 }
 
 // === set runtime config ===
-const appData = getAppData();
+const appData = helpers.getAppData();
 
 // build-time config for none-ssr
 if (runtimeConfig) {

packages/platform-mp/src/shuvi-app/view.ts

@@ -7,6 +7,7 @@ import ReactDOM from 'react-dom';
 export default {
   // @ts-ignore
   renderApp({ AppComponent }) {
+    // @ts-ignore
     window.__taroAppConfig = appConfig;
     // @ts-ignore
     App(createReactApp(AppComponent, React, ReactDOM, appConfig));

packages/platform-react/package.json → packages/platform-web-react/package.json

@@ -1,10 +1,10 @@
 {
-  "name": "@shuvi/platform-react",
+  "name": "@shuvi/platform-web-react",
   "version": "0.0.1-rc.32",
   "repository": {
     "type": "git",
     "url": "git+https://github.com/shuvijs/shuvi.git",
-    "directory": "packages/platform-react"
+    "directory": "packages/platform-web-react"
   },
   "author": "liximomo",
   "license": "MIT",

packages/platform-react/src/lib/bundler/config.ts → packages/platform-web-react/src/lib/bundler/config.ts

@@ -37,7 +37,7 @@ export function config(api: IApi) {
 
       // config.externals(external);
       // make sure we don't have multiple entity of following packages , becasue module variable will fail
-      config.resolve.alias.set('@shuvi/platform-react', PACKAGE_DIR);
+      config.resolve.alias.set('@shuvi/platform-web-react', PACKAGE_DIR);
       config.resolve.alias.set(
         '@shuvi/router-react$',
         resolveLocal('@shuvi/router-react')

packages/platform-react/src/lib/index.ts → packages/platform-web-react/src/lib/index.ts

@@ -7,7 +7,6 @@ class ReactRuntime implements Runtime.IRuntime<React.ComponentType<any>> {
   _api!: IApi;
   async install(api: IApi): Promise<void> {
     this._api = api;
-    api.addEntryCode('window.isBrowser = true');
     api.setPlatformModule(resolveAppFile('index'));
     // IE11 polyfill: https://github.com/facebook/create-react-app/blob/c38aecf73f8581db4a61288268be3a56b12e8af6/packages/react-app-polyfill/README.md#polyfilling-other-language-features
     api.addAppPolyfill(resolveDep('react-app-polyfill/ie11'));

packages/platform-web-react/src/lib/paths.ts

@@ -0,0 +1,13 @@
+import { resolve, dirname, join } from 'path';
+
+export const PACKAGE_DIR = dirname(
+  require.resolve('@shuvi/platform-web-react/package.json')
+);
+
+export const resolveAppFile = (...paths: string[]) =>
+  `${resolve(PACKAGE_DIR, 'shuvi-app', ...paths)}`;
+
+export const resolveDep = (module: string) => require.resolve(module);
+
+export const resolveLib = (module: string) =>
+  dirname(resolveDep(join(module, 'package.json')));

packages/platform-react/src/shuvi-app/view/ReactView.client.tsx → packages/platform-web-react/src/shuvi-app/view/ReactView.client.tsx

@@ -68,7 +68,7 @@ export class ReactClientView implements IReactClientView {
         </HeadManagerContext.Provider>
       </Router>
     );
-
+    console.warn('render', appContainer);
     if (ssr && isInitialRender) {
       ReactDOM.hydrate(root, appContainer);
       this._isInitialRender = false;

packages/platform-web/.gitignore

@@ -0,0 +1 @@
+es/

packages/platform-web/package.json

@@ -0,0 +1,46 @@
+{
+  "name": "@shuvi/platform-web",
+  "version": "0.0.1-rc.32",
+  "repository": {
+    "type": "git",
+    "url": "git+https://github.com/shuvijs/shuvi.git",
+    "directory": "packages/platform-web"
+  },
+  "author": "liximomo",
+  "license": "MIT",
+  "sideEffects": ["**/shuvi-app/entry/**"],
+  "main": "./lib/index.js",
+  "module": "./es/index.js",
+  "files": [
+    "lib",
+    "shuvi-app"
+  ],
+  "scripts": {
+    "dev": "run-p watch:*",
+    "watch:app": "tsc -p tsconfig.build.app.json -w",
+    "watch:node": "tsc -p tsconfig.build.node.json -w",
+    "prebuild": "rimraf lib shuvi-app",
+    "build": "run-p build:*",
+    "build:app": "tsc -p tsconfig.build.app.json",
+    "build:node": "tsc -p tsconfig.build.node.json"
+  },
+  "engines": {
+    "node": ">= 12.0.0"
+  },
+  "dependencies": {
+    "@next/react-refresh-utils": "10.0.5",
+    "@shuvi/app": "^0.0.1-rc.32",
+    "@shuvi/router-react": "^0.0.1-rc.32",
+    "@shuvi/runtime-core": "^0.0.1-rc.32",
+    "@shuvi/shared": "^0.0.1-rc.32",
+    "@shuvi/utils": "^0.0.1-rc.32",
+    "react": "16.13.0",
+    "react-app-polyfill": "2.0.0",
+    "react-dom": "16.13.0",
+    "react-refresh": "0.9.0",
+    "use-subscription": "1.4.1"
+  },
+  "devDependencies": {
+    "@shuvi/types": "^0.0.1-rc.32"
+  }
+}

packages/platform-web/src/lib/index.ts

@@ -0,0 +1,43 @@
+import { IApi, Runtime } from '@shuvi/types';
+import { resolveAppFile } from './paths';
+
+const platform: Runtime.IRuntime<any> = {
+  async install(api: IApi): Promise<void> {
+    // set application and entry
+    const {
+      ssr,
+      router: { history }
+    } = api.config;
+    let ApplicationModule;
+    if (history === 'browser') {
+      ApplicationModule = 'create-application-history-browser';
+    } else if (history === 'hash') {
+      ApplicationModule = 'create-application-history-hash';
+    } else {
+      ApplicationModule = 'create-application-history-memory';
+    }
+
+    api.setServerModule({
+      application: resolveAppFile(
+        'application',
+        'server',
+        ssr ? 'create-application' : 'create-application-spa'
+      ),
+      entry: resolveAppFile('entry', 'server')
+    });
+
+    api.setClientModule({
+      application: resolveAppFile('application', 'client', ApplicationModule),
+      entry: resolveAppFile('entry', 'client')
+    });
+    api.addEntryCode(`import '${resolveAppFile('entry', 'client')}'`);
+
+    // install framework
+    const { framework = 'react' } = api.config.platform || {};
+    const frameworkInstance: Runtime.IRuntime = require(`@shuvi/platform-web-${framework}`)
+      .default;
+    frameworkInstance.install(api);
+  }
+};
+
+export default platform;

packages/platform-react/src/lib/paths.ts → packages/platform-web/src/lib/paths.ts

@@ -1,7 +1,7 @@
 import { resolve, dirname, join } from 'path';
 
 export const PACKAGE_DIR = dirname(
-  require.resolve('@shuvi/platform-react/package.json')
+  require.resolve('@shuvi/platform-web/package.json')
 );
 
 export const resolveAppFile = (...paths: string[]) =>

packages/runtime-core/src/application/create-application-client.ts → packages/platform-web/src/shuvi-app/application/client/create-application-factory.ts

@@ -3,41 +3,43 @@ import routes from '@shuvi/app/core/routes';
 import { getRoutes } from '@shuvi/app/core/platform';
 import initPlugins from '@shuvi/app/user/plugin';
 import { pluginRecord } from '@shuvi/app/core/plugins';
-import { Application } from './application';
-import runPlugins from './runPlugins';
+import { Application, runPlugins } from '@shuvi/runtime-core';
 import { createRouter } from '@shuvi/router';
-import createHistory from '@shuvi/app/core/client/history';
 import { History } from '@shuvi/router/lib/types';
 import { Runtime, IApplication } from '@shuvi/types';
 declare let __SHUVI: any;
 let app: IApplication;
 let history: History;
 let appContext: Runtime.IApplicationCreaterContext;
-export const create: Runtime.ApplicationCreater = function (context, options) {
-  appContext = context;
-  // app is a singleton in client side
-  if (app) {
-    return app;
-  }
-  history = createHistory();
-  const router = createRouter({
-    history,
-    routes: getRoutes(routes, context)
-  });
-  app = new Application({
-    AppComponent,
-    router,
-    context,
-    render: options.render
-  });
 
-  runPlugins({
-    tap: app.tap.bind(app),
-    initPlugins,
-    pluginRecord
-  });
+export const createFactory = (historyCreater: () => History) => {
+  const create: Runtime.ApplicationCreater = function (context, options) {
+    appContext = context;
+    // app is a singleton in client side
+    if (app) {
+      return app;
+    }
+    history = historyCreater();
+    const router = createRouter({
+      history,
+      routes: getRoutes(routes, context)
+    });
+    app = new Application({
+      AppComponent,
+      router,
+      context,
+      render: options.render
+    });
+
+    runPlugins({
+      tap: app.tap.bind(app),
+      initPlugins,
+      pluginRecord
+    });
 
-  return app;
+    return app;
+  };
+  return create;
 };
 
 if (module.hot) {

packages/platform-web/src/shuvi-app/application/client/create-application-history-browser.ts

@@ -0,0 +1,4 @@
+import { createFactory } from './create-application-factory';
+import { createBrowserHistory } from '@shuvi/router';
+
+export const create = createFactory(createBrowserHistory);

packages/platform-web/src/shuvi-app/application/client/create-application-history-hash.ts

@@ -0,0 +1,4 @@
+import { createFactory } from './create-application-factory';
+import { createHashHistory } from '@shuvi/router';
+
+export const create = createFactory(createHashHistory);

packages/platform-web/src/shuvi-app/application/client/create-application-history-memory.ts

@@ -0,0 +1,4 @@
+import { createFactory } from './create-application-factory';
+import { createMemoryHistory } from '@shuvi/router';
+
+export const create = createFactory(createMemoryHistory);

packages/runtime-core/src/application/create-application-server-spa.ts → packages/platform-web/src/shuvi-app/application/server/create-application-spa.ts

@@ -1,4 +1,4 @@
-import { Application } from './application';
+import { Application } from '@shuvi/runtime-core';
 import { Runtime } from '@shuvi/types';
 export const create: Runtime.ApplicationCreater = function (context, options) {
   return new Application({

packages/runtime-core/src/application/create-application-server.ts → packages/platform-web/src/shuvi-app/application/server/create-application.ts

@@ -3,8 +3,7 @@ import routes from '@shuvi/app/core/routes';
 import { getRoutes } from '@shuvi/app/core/platform';
 import initPlugins from '@shuvi/app/user/plugin';
 import { pluginRecord } from '@shuvi/app/core/plugins';
-import { Application } from './application';
-import runPlugins from './runPlugins';
+import { Application, runPlugins } from '@shuvi/runtime-core';
 import { createRouter, createMemoryHistory } from '@shuvi/router';
 import { Runtime } from '@shuvi/types';
 

packages/runtime-core/src/entry/client/index.ts → packages/platform-web/src/shuvi-app/entry/client/index.ts

@@ -2,7 +2,6 @@
 // IMPORTANT: `setup-env` must be runned before any other codes
 import './setup-env';
 import { rerender } from './setup-app';
-
 (window as any).__SHUVI = {
   ...((window as any).__SHUVI || {}),
   rerender