fix: ts types (#102)

* fix: request types

* refactor: add icestark types

* refactor: add types to example

examples/basic-mpa/src/pages/Dashboard/app.ts

@@ -1,7 +1,7 @@
-import { createApp } from 'ice'
+import { createApp, IAppConfig } from 'ice'
 import Dashboard from './index'
 
-const appConfig = {
+const appConfig: IAppConfig = {
   router: {
     routes: [{ path: '/', component: Dashboard }],
   },

examples/basic-mpa/src/pages/Home/app.ts

@@ -1,7 +1,7 @@
-import { createApp } from 'ice'
+import { createApp, IAppConfig } from 'ice'
 import Home from './index'
 
-const appConfig = {
+const appConfig: IAppConfig = {
   router: {
     routes: [{ path: '/', component: Home }],
   },

examples/basic-request/src/app.ts

@@ -1,6 +1,6 @@
-import { createApp } from 'ice';
+import { createApp, IAppConfig } from 'ice';
 
-const appConfig = {
+const appConfig: IAppConfig = {
   app: {
     rootId: 'ice-container',
   },

examples/basic-spa/build.json

@@ -1,7 +1,4 @@
 {
-  "router": {
-    "ignorePaths": ["stores", "components"]
-  },
   "ignoreHtmlTemplate": true,
   "plugins": [],
   "modeConfig": {

examples/basic-spa/src/app.ts

@@ -1,20 +1,22 @@
-import { createApp, APP_MODE } from 'ice'
+import { createApp, APP_MODE, IAppConfig } from 'ice'
 
-const appConfig = {
+const appConfig: IAppConfig = {
   app: {
     rootId: 'ice-container'
   },
   logger: {
     level: APP_MODE === 'build' ? 'error' : 'debug',
   },
+  router: {
+    type: 'hash'
+  },
   request: {
     timeout: 5000,
-    // baseURL: '/abc',
+    baseURL: '/',
     interceptors: {
-      response: {
-        onConfig: (conf) => {
-          console.log('interceptors response:', conf)
-          return conf
+      request: {
+        onConfig: (config) => {
+          return config
         }
       }
     }

examples/basic-store/src/app.ts

@@ -1,6 +1,6 @@
-import { createApp } from 'ice';
+import { createApp, IAppConfig } from 'ice';
 
-const appConfig = {
+const appConfig: IAppConfig = {
   app: {
     rootId: 'ice-container',
   },

examples/hello-world/src/app.ts

@@ -1,6 +1,6 @@
-import { createApp } from 'ice';
+import { createApp, IAppConfig } from 'ice';
 
-const appConfig = {
+const appConfig: IAppConfig = {
   app: {
     rootId: 'ice-container',
   },

examples/icestark-child/src/app.ts

@@ -1,6 +1,6 @@
-import { createApp } from 'ice'
+import { createApp, IAppConfig } from 'ice'
 
-const appConfig = {
+const appConfig: IAppConfig = {
   app: {
     rootId: 'ice-container'
   },
@@ -8,7 +8,7 @@ const appConfig = {
     level: 'warn'
   },
   icestark: {
-    type: 'child',
+    type: 'child'
   },
 };
 

examples/icestark-child/src/pages/404.tsx

@@ -1,17 +0,0 @@
-import React from 'react'
-import { Link } from 'ice'
-
-const Home = (props) => {
-  console.log('render home', props);
-
-  return (
-    <>
-      <h2>404040404 Page...</h2>
-      <Link to="/">home</Link><br />
-      <Link to="/about">About</Link><br />
-      <Link to="/dashboard">Dashboard</Link>
-    </>
-  );
-}
-
-export default Home

examples/icestark-child/src/pages/About/_layout.tsx

@@ -8,7 +8,7 @@ export default function BasicLayout({
   return (
     <div style={{minHeight: '100vh'}}>
       <section>
-        Headerxxx
+        Header
         {children}
       </section>
     </div>

examples/icestark-child/src/pages/index.tsx

@@ -1,17 +1,7 @@
 import React from 'react'
-import { Link, useIndexPage, helpers, logger } from 'ice'
-
-console.log('helpers from ice', helpers);
-console.log('logger from ice', logger);
-
-logger.info('=== info ===');
-logger.warn('=== warn ===');
+import { Link } from 'ice'
 
 const Home = (props) => {
-  const page = useIndexPage()
-
-  console.log('Home props', props);
-  console.log('render home', { page });
   return (
     <>
       <h2>Home Page...{props.a}</h2>
@@ -22,11 +12,11 @@ const Home = (props) => {
 }
 
 Home.getInitialProps = async () => {
-  return {a: 1}
+  return { a: 1 }
 };
 
 Home.pageConfig = {
-  title: 'hahah'
+  title: 'Home Page'
 };
 
 export default Home

examples/icestark-layout/src/app.tsx

@@ -1,8 +1,8 @@
-import { createApp } from 'ice'
+import { createApp, IAppConfig } from 'ice'
 import * as React from 'react';
 import { ConfigProvider } from '@alifd/next';
 
-const appConfig = {
+const appConfig: IAppConfig = {
   app: {
     rootId: 'ice-container',
     addProvider: ({ children }) => (
@@ -16,7 +16,7 @@ const appConfig = {
     type: 'browser',
   },
   icestark: {
-    type: 'framework',
+    type: 'framework11',
     getApps: async () => {
       const apps = await new Promise((resolve) => {
         setTimeout(() => {

examples/with-fusion-design/src/app.ts

@@ -1,6 +1,6 @@
-import { createApp } from 'ice'
+import { createApp, IAppConfig } from 'ice'
 
-const appConfig = {
+const appConfig: IAppConfig = {
   app: {
     rootId: 'ice-container'
   }

packages/plugin-icestark/package.json

@@ -11,7 +11,8 @@
     "test": "__tests__"
   },
   "files": [
-    "lib"
+    "lib",
+    "src/types"
   ],
   "dependencies": {
     "@ice/stark": "^1.3.1",

packages/plugin-icestark/src/index.ts

@@ -1,10 +1,12 @@
 import * as path from 'path';
 import * as glob from 'glob';
+import * as fse from 'fs-extra';
 import { IPlugin } from '@alib/build-scripts';
 
-const plugin: IPlugin = ({ onGetWebpackConfig, context }) => {
+const plugin: IPlugin = async ({ onGetWebpackConfig, getValue, applyMethod, context }) => {
   const { rootDir } = context;
-  
+  const iceTempPath = getValue('ICE_TEMP');
+
   const hasDefaultLayout = glob.sync(`${path.join(rootDir, 'src/layouts/index')}.@(ts?(x)|js?(x))`).length;
   onGetWebpackConfig((config) => {
     // set alias for default layout
@@ -14,6 +16,9 @@ const plugin: IPlugin = ({ onGetWebpackConfig, context }) => {
       config.resolve.alias.set(pkgName, require.resolve(pkgName));
     });
   });
+
+  await fse.copy(path.join(__dirname, '..', 'src/types/index.ts'), path.join(iceTempPath, 'types/icestark.ts'));
+  applyMethod('addIceTypesExport', { source: './types/icestark', specifier: '{ IIceStark }', exportName: 'icestark?: IIceStark' });
 };
 
-export default plugin;
+export default plugin;

packages/plugin-icestark/src/module.tsx

@@ -11,35 +11,13 @@ import {
 import { Router } from '$ice/Router';
 import DefaultLayout from '$ice/Layout';
 import removeRootLayout from './runtime/removeLayout';
-
-interface IAppRouter {
-  ErrorComponent?: React.ComponentType;
-  LoadingComponent?: React.ComponentType;
-  NotFoundComponent?: React.ComponentType;
-  shouldAssetsRemove?: (
-    assetUrl?: string,
-    element?: HTMLElement | HTMLLinkElement | HTMLStyleElement | HTMLScriptElement,
-  ) => boolean;
-}
-
-interface IGetApps {
-  (): AppConfig[]|Promise<AppConfig[]>;
-}
-
-interface IConfig {
-  type: 'framework' | 'child';
-  getApps?: IGetApps;
-  appRouter?: IAppRouter;
-  removeRoutesLayout: boolean;
-  AppRoute?: React.ComponentType;
-  Layout?: React.ComponentType;
-}
+import { IIceStark } from './types'
 
 const { useEffect, useState } = React;
 
 const module = ({ appConfig, addDOMRender, setRenderRouter, modifyRoutes }) => {
   const { icestark, router } = appConfig;
-  const { type: appType } = (icestark || {}) as IConfig;
+  const { type: appType } = (icestark || {}) as IIceStark;
   const { type, basename, modifyRoutes: runtimeModifyRoutes } = router;
   if (runtimeModifyRoutes) {
     modifyRoutes(runtimeModifyRoutes);
@@ -70,7 +48,7 @@ const module = ({ appConfig, addDOMRender, setRenderRouter, modifyRoutes }) => {
       return <Router {...routerProps} />;
     });
   } else if (appType === 'framework') {
-    const { getApps, appRouter, Layout, AppRoute: CustomAppRoute, removeRoutesLayout } = (icestark || {}) as IConfig;
+    const { getApps, appRouter, Layout, AppRoute: CustomAppRoute, removeRoutesLayout } = (icestark || {}) as IIceStark;
     if (removeRoutesLayout) {
       modifyRoutes(removeRootLayout);
     }
@@ -99,11 +77,11 @@ const module = ({ appConfig, addDOMRender, setRenderRouter, modifyRoutes }) => {
       function handleRouteChange(pathname) {
         setAppPathname(pathname);
       }
-    
+
       function handleAppLeave(config) {
         setAppLeave(config);
       }
-    
+
       function handleAppEnter(config) {
         setAppEnter(config);
       }
@@ -113,7 +91,7 @@ const module = ({ appConfig, addDOMRender, setRenderRouter, modifyRoutes }) => {
         appEnter,
         appLeave,
       };
-  
+
       return (
         <BasicLayout {...appInfo}>
           {apps && (

packages/plugin-icestark/src/types/index.ts

@@ -0,0 +1,24 @@
+import { AppConfig } from '@ice/stark';
+
+export interface IAppRouter {
+  ErrorComponent?: React.ComponentType;
+  LoadingComponent?: React.ComponentType;
+  NotFoundComponent?: React.ComponentType;
+  shouldAssetsRemove?: (
+    assetUrl?: string,
+    element?: HTMLElement | HTMLLinkElement | HTMLStyleElement | HTMLScriptElement,
+  ) => boolean;
+}
+
+export interface IGetApps {
+  (): AppConfig[]|Promise<AppConfig[]>;
+}
+
+export interface IIceStark {
+  type: 'framework' | 'child';
+  getApps?: IGetApps;
+  appRouter?: IAppRouter;
+  removeRoutesLayout?: boolean;
+  AppRoute?: React.ComponentType;
+  Layout?: React.ComponentType;
+}

packages/plugin-request/request/types.ts

@@ -1,14 +1,20 @@
-import { AxiosRequestConfig } from 'axios'
+import { AxiosRequestConfig, AxiosResponse, AxiosError } from 'axios'
+
+export interface IInterceptorRequest {
+  onConfig?: (config: AxiosRequestConfig) => AxiosRequestConfig;
+  onError?: (error: AxiosError) => {};
+}
+
+export interface IInterceptorResponse {
+  onConfig?: (response: AxiosResponse) => AxiosResponse;
+  onError?: (error: AxiosError) => Promise<void>;
+}
+
+export interface IInterceptors {
+  request?: IInterceptorRequest;
+  response?: IInterceptorResponse;
+}
 
 export interface IRequest extends AxiosRequestConfig {
-  interceptors: {
-    request: {
-      onConfig: (config) => {};
-      onError: (error) => {};
-    };
-    response: {
-      onConfig: (response) => {};
-      onError: (error) => {};
-    };
-  };
+  interceptors: IInterceptors;
 }

packages/plugin-router/src/index.ts

@@ -29,8 +29,8 @@ const plugin: IPlugin = ({ context, onGetWebpackConfig, getValue, applyMethod, r
   const hasRouteFile = fse.existsSync(routeConfigPath);
 
   // copy types
-  fse.copySync(path.join(__dirname, '../src/types/index.ts'), path.join(iceTempPath, 'router/types.ts'));
-  applyMethod('addIceTypesExport', { source: './router/types', specifier: '{ IAppRouterProps }', exportName: 'router?: IAppRouterProps' });
+  fse.copySync(path.join(__dirname, '../src/types/index.ts'), path.join(iceTempPath, 'types/router.ts'));
+  applyMethod('addIceTypesExport', { source: './types/router', specifier: '{ IAppRouterProps }', exportName: 'router?: IAppRouterProps' });
 
   // modify webpack config
   onGetWebpackConfig((config) => {

packages/plugin-router/src/types/index.ts

@@ -52,6 +52,7 @@ export interface IModifyRoutes {
 
 export interface IAppRouterProps {
   type?: 'hash' | 'browser' | 'memory';
+  routes?: RouteItemProps[];
   basename?: string;
   modifyRoutes?: IModifyRoutes;
   fallback?: React.ReactNode;

packages/plugin-store/src/index.ts

@@ -12,8 +12,8 @@ export default async (api) => {
   const pageModelsTemplatePath = path.join(templatePath, 'pageModels.ts.ejs')
   const projectType = getValue('PROJECT_TYPE')
 
-  await fse.copy(path.join(__dirname, '..', 'src/types/index.ts'), path.join(targetPath, 'store/types.ts'))
-  applyMethod('addIceTypesExport', { source: './store/types', specifier: '{ IStore }', exportName: 'store?: IStore' })
+  await fse.copy(path.join(__dirname, '..', 'src/types/index.ts'), path.join(targetPath, './types/store.ts'))
+  applyMethod('addIceTypesExport', { source: './types/store', specifier: '{ IStore }', exportName: 'store?: IStore' })
 
   onGetWebpackConfig(config => {
     config.resolve.alias.set('$ice/appModels', path.join(targetPath, 'appModels.ts'))