mirror of https://github.com/alibaba/ice.git
fix: ts types (#102)
* fix: request types * refactor: add icestark types * refactor: add types to example
This commit is contained in:
parent
dfe837822a
commit
7bb8c703ef
|
|
@ -1,7 +1,7 @@
|
||||||
import { createApp } from 'ice'
|
import { createApp, IAppConfig } from 'ice'
|
||||||
import Dashboard from './index'
|
import Dashboard from './index'
|
||||||
|
|
||||||
const appConfig = {
|
const appConfig: IAppConfig = {
|
||||||
router: {
|
router: {
|
||||||
routes: [{ path: '/', component: Dashboard }],
|
routes: [{ path: '/', component: Dashboard }],
|
||||||
},
|
},
|
||||||
|
|
|
||||||
|
|
@ -1,7 +1,7 @@
|
||||||
import { createApp } from 'ice'
|
import { createApp, IAppConfig } from 'ice'
|
||||||
import Home from './index'
|
import Home from './index'
|
||||||
|
|
||||||
const appConfig = {
|
const appConfig: IAppConfig = {
|
||||||
router: {
|
router: {
|
||||||
routes: [{ path: '/', component: Home }],
|
routes: [{ path: '/', component: Home }],
|
||||||
},
|
},
|
||||||
|
|
|
||||||
|
|
@ -1,6 +1,6 @@
|
||||||
import { createApp } from 'ice';
|
import { createApp, IAppConfig } from 'ice';
|
||||||
|
|
||||||
const appConfig = {
|
const appConfig: IAppConfig = {
|
||||||
app: {
|
app: {
|
||||||
rootId: 'ice-container',
|
rootId: 'ice-container',
|
||||||
},
|
},
|
||||||
|
|
|
||||||
|
|
@ -1,7 +1,4 @@
|
||||||
{
|
{
|
||||||
"router": {
|
|
||||||
"ignorePaths": ["stores", "components"]
|
|
||||||
},
|
|
||||||
"ignoreHtmlTemplate": true,
|
"ignoreHtmlTemplate": true,
|
||||||
"plugins": [],
|
"plugins": [],
|
||||||
"modeConfig": {
|
"modeConfig": {
|
||||||
|
|
|
||||||
|
|
@ -1,20 +1,22 @@
|
||||||
import { createApp, APP_MODE } from 'ice'
|
import { createApp, APP_MODE, IAppConfig } from 'ice'
|
||||||
|
|
||||||
const appConfig = {
|
const appConfig: IAppConfig = {
|
||||||
app: {
|
app: {
|
||||||
rootId: 'ice-container'
|
rootId: 'ice-container'
|
||||||
},
|
},
|
||||||
logger: {
|
logger: {
|
||||||
level: APP_MODE === 'build' ? 'error' : 'debug',
|
level: APP_MODE === 'build' ? 'error' : 'debug',
|
||||||
},
|
},
|
||||||
|
router: {
|
||||||
|
type: 'hash'
|
||||||
|
},
|
||||||
request: {
|
request: {
|
||||||
timeout: 5000,
|
timeout: 5000,
|
||||||
// baseURL: '/abc',
|
baseURL: '/',
|
||||||
interceptors: {
|
interceptors: {
|
||||||
response: {
|
request: {
|
||||||
onConfig: (conf) => {
|
onConfig: (config) => {
|
||||||
console.log('interceptors response:', conf)
|
return config
|
||||||
return conf
|
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
|
||||||
|
|
@ -1,6 +1,6 @@
|
||||||
import { createApp } from 'ice';
|
import { createApp, IAppConfig } from 'ice';
|
||||||
|
|
||||||
const appConfig = {
|
const appConfig: IAppConfig = {
|
||||||
app: {
|
app: {
|
||||||
rootId: 'ice-container',
|
rootId: 'ice-container',
|
||||||
},
|
},
|
||||||
|
|
|
||||||
|
|
@ -1,6 +1,6 @@
|
||||||
import { createApp } from 'ice';
|
import { createApp, IAppConfig } from 'ice';
|
||||||
|
|
||||||
const appConfig = {
|
const appConfig: IAppConfig = {
|
||||||
app: {
|
app: {
|
||||||
rootId: 'ice-container',
|
rootId: 'ice-container',
|
||||||
},
|
},
|
||||||
|
|
|
||||||
|
|
@ -1,6 +1,6 @@
|
||||||
import { createApp } from 'ice'
|
import { createApp, IAppConfig } from 'ice'
|
||||||
|
|
||||||
const appConfig = {
|
const appConfig: IAppConfig = {
|
||||||
app: {
|
app: {
|
||||||
rootId: 'ice-container'
|
rootId: 'ice-container'
|
||||||
},
|
},
|
||||||
|
|
@ -8,7 +8,7 @@ const appConfig = {
|
||||||
level: 'warn'
|
level: 'warn'
|
||||||
},
|
},
|
||||||
icestark: {
|
icestark: {
|
||||||
type: 'child',
|
type: 'child'
|
||||||
},
|
},
|
||||||
};
|
};
|
||||||
|
|
||||||
|
|
|
||||||
|
|
@ -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
|
|
||||||
|
|
@ -8,7 +8,7 @@ export default function BasicLayout({
|
||||||
return (
|
return (
|
||||||
<div style={{minHeight: '100vh'}}>
|
<div style={{minHeight: '100vh'}}>
|
||||||
<section>
|
<section>
|
||||||
Headerxxx
|
Header
|
||||||
{children}
|
{children}
|
||||||
</section>
|
</section>
|
||||||
</div>
|
</div>
|
||||||
|
|
|
||||||
|
|
@ -1,17 +1,7 @@
|
||||||
import React from 'react'
|
import React from 'react'
|
||||||
import { Link, useIndexPage, helpers, logger } from 'ice'
|
import { Link } from 'ice'
|
||||||
|
|
||||||
console.log('helpers from ice', helpers);
|
|
||||||
console.log('logger from ice', logger);
|
|
||||||
|
|
||||||
logger.info('=== info ===');
|
|
||||||
logger.warn('=== warn ===');
|
|
||||||
|
|
||||||
const Home = (props) => {
|
const Home = (props) => {
|
||||||
const page = useIndexPage()
|
|
||||||
|
|
||||||
console.log('Home props', props);
|
|
||||||
console.log('render home', { page });
|
|
||||||
return (
|
return (
|
||||||
<>
|
<>
|
||||||
<h2>Home Page...{props.a}</h2>
|
<h2>Home Page...{props.a}</h2>
|
||||||
|
|
@ -22,11 +12,11 @@ const Home = (props) => {
|
||||||
}
|
}
|
||||||
|
|
||||||
Home.getInitialProps = async () => {
|
Home.getInitialProps = async () => {
|
||||||
return {a: 1}
|
return { a: 1 }
|
||||||
};
|
};
|
||||||
|
|
||||||
Home.pageConfig = {
|
Home.pageConfig = {
|
||||||
title: 'hahah'
|
title: 'Home Page'
|
||||||
};
|
};
|
||||||
|
|
||||||
export default Home
|
export default Home
|
||||||
|
|
|
||||||
|
|
@ -1,8 +1,8 @@
|
||||||
import { createApp } from 'ice'
|
import { createApp, IAppConfig } from 'ice'
|
||||||
import * as React from 'react';
|
import * as React from 'react';
|
||||||
import { ConfigProvider } from '@alifd/next';
|
import { ConfigProvider } from '@alifd/next';
|
||||||
|
|
||||||
const appConfig = {
|
const appConfig: IAppConfig = {
|
||||||
app: {
|
app: {
|
||||||
rootId: 'ice-container',
|
rootId: 'ice-container',
|
||||||
addProvider: ({ children }) => (
|
addProvider: ({ children }) => (
|
||||||
|
|
@ -16,7 +16,7 @@ const appConfig = {
|
||||||
type: 'browser',
|
type: 'browser',
|
||||||
},
|
},
|
||||||
icestark: {
|
icestark: {
|
||||||
type: 'framework',
|
type: 'framework11',
|
||||||
getApps: async () => {
|
getApps: async () => {
|
||||||
const apps = await new Promise((resolve) => {
|
const apps = await new Promise((resolve) => {
|
||||||
setTimeout(() => {
|
setTimeout(() => {
|
||||||
|
|
|
||||||
|
|
@ -1,6 +1,6 @@
|
||||||
import { createApp } from 'ice'
|
import { createApp, IAppConfig } from 'ice'
|
||||||
|
|
||||||
const appConfig = {
|
const appConfig: IAppConfig = {
|
||||||
app: {
|
app: {
|
||||||
rootId: 'ice-container'
|
rootId: 'ice-container'
|
||||||
}
|
}
|
||||||
|
|
|
||||||
|
|
@ -11,7 +11,8 @@
|
||||||
"test": "__tests__"
|
"test": "__tests__"
|
||||||
},
|
},
|
||||||
"files": [
|
"files": [
|
||||||
"lib"
|
"lib",
|
||||||
|
"src/types"
|
||||||
],
|
],
|
||||||
"dependencies": {
|
"dependencies": {
|
||||||
"@ice/stark": "^1.3.1",
|
"@ice/stark": "^1.3.1",
|
||||||
|
|
|
||||||
|
|
@ -1,9 +1,11 @@
|
||||||
import * as path from 'path';
|
import * as path from 'path';
|
||||||
import * as glob from 'glob';
|
import * as glob from 'glob';
|
||||||
|
import * as fse from 'fs-extra';
|
||||||
import { IPlugin } from '@alib/build-scripts';
|
import { IPlugin } from '@alib/build-scripts';
|
||||||
|
|
||||||
const plugin: IPlugin = ({ onGetWebpackConfig, context }) => {
|
const plugin: IPlugin = async ({ onGetWebpackConfig, getValue, applyMethod, context }) => {
|
||||||
const { rootDir } = context;
|
const { rootDir } = context;
|
||||||
|
const iceTempPath = getValue('ICE_TEMP');
|
||||||
|
|
||||||
const hasDefaultLayout = glob.sync(`${path.join(rootDir, 'src/layouts/index')}.@(ts?(x)|js?(x))`).length;
|
const hasDefaultLayout = glob.sync(`${path.join(rootDir, 'src/layouts/index')}.@(ts?(x)|js?(x))`).length;
|
||||||
onGetWebpackConfig((config) => {
|
onGetWebpackConfig((config) => {
|
||||||
|
|
@ -14,6 +16,9 @@ const plugin: IPlugin = ({ onGetWebpackConfig, context }) => {
|
||||||
config.resolve.alias.set(pkgName, require.resolve(pkgName));
|
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;
|
||||||
|
|
@ -11,35 +11,13 @@ import {
|
||||||
import { Router } from '$ice/Router';
|
import { Router } from '$ice/Router';
|
||||||
import DefaultLayout from '$ice/Layout';
|
import DefaultLayout from '$ice/Layout';
|
||||||
import removeRootLayout from './runtime/removeLayout';
|
import removeRootLayout from './runtime/removeLayout';
|
||||||
|
import { IIceStark } from './types'
|
||||||
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;
|
|
||||||
}
|
|
||||||
|
|
||||||
const { useEffect, useState } = React;
|
const { useEffect, useState } = React;
|
||||||
|
|
||||||
const module = ({ appConfig, addDOMRender, setRenderRouter, modifyRoutes }) => {
|
const module = ({ appConfig, addDOMRender, setRenderRouter, modifyRoutes }) => {
|
||||||
const { icestark, router } = appConfig;
|
const { icestark, router } = appConfig;
|
||||||
const { type: appType } = (icestark || {}) as IConfig;
|
const { type: appType } = (icestark || {}) as IIceStark;
|
||||||
const { type, basename, modifyRoutes: runtimeModifyRoutes } = router;
|
const { type, basename, modifyRoutes: runtimeModifyRoutes } = router;
|
||||||
if (runtimeModifyRoutes) {
|
if (runtimeModifyRoutes) {
|
||||||
modifyRoutes(runtimeModifyRoutes);
|
modifyRoutes(runtimeModifyRoutes);
|
||||||
|
|
@ -70,7 +48,7 @@ const module = ({ appConfig, addDOMRender, setRenderRouter, modifyRoutes }) => {
|
||||||
return <Router {...routerProps} />;
|
return <Router {...routerProps} />;
|
||||||
});
|
});
|
||||||
} else if (appType === 'framework') {
|
} 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) {
|
if (removeRoutesLayout) {
|
||||||
modifyRoutes(removeRootLayout);
|
modifyRoutes(removeRootLayout);
|
||||||
}
|
}
|
||||||
|
|
|
||||||
|
|
@ -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;
|
||||||
|
}
|
||||||
|
|
@ -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 {
|
export interface IRequest extends AxiosRequestConfig {
|
||||||
interceptors: {
|
interceptors: IInterceptors;
|
||||||
request: {
|
|
||||||
onConfig: (config) => {};
|
|
||||||
onError: (error) => {};
|
|
||||||
};
|
|
||||||
response: {
|
|
||||||
onConfig: (response) => {};
|
|
||||||
onError: (error) => {};
|
|
||||||
};
|
|
||||||
};
|
|
||||||
}
|
}
|
||||||
|
|
|
||||||
|
|
@ -29,8 +29,8 @@ const plugin: IPlugin = ({ context, onGetWebpackConfig, getValue, applyMethod, r
|
||||||
const hasRouteFile = fse.existsSync(routeConfigPath);
|
const hasRouteFile = fse.existsSync(routeConfigPath);
|
||||||
|
|
||||||
// copy types
|
// copy types
|
||||||
fse.copySync(path.join(__dirname, '../src/types/index.ts'), path.join(iceTempPath, 'router/types.ts'));
|
fse.copySync(path.join(__dirname, '../src/types/index.ts'), path.join(iceTempPath, 'types/router.ts'));
|
||||||
applyMethod('addIceTypesExport', { source: './router/types', specifier: '{ IAppRouterProps }', exportName: 'router?: IAppRouterProps' });
|
applyMethod('addIceTypesExport', { source: './types/router', specifier: '{ IAppRouterProps }', exportName: 'router?: IAppRouterProps' });
|
||||||
|
|
||||||
// modify webpack config
|
// modify webpack config
|
||||||
onGetWebpackConfig((config) => {
|
onGetWebpackConfig((config) => {
|
||||||
|
|
|
||||||
|
|
@ -52,6 +52,7 @@ export interface IModifyRoutes {
|
||||||
|
|
||||||
export interface IAppRouterProps {
|
export interface IAppRouterProps {
|
||||||
type?: 'hash' | 'browser' | 'memory';
|
type?: 'hash' | 'browser' | 'memory';
|
||||||
|
routes?: RouteItemProps[];
|
||||||
basename?: string;
|
basename?: string;
|
||||||
modifyRoutes?: IModifyRoutes;
|
modifyRoutes?: IModifyRoutes;
|
||||||
fallback?: React.ReactNode;
|
fallback?: React.ReactNode;
|
||||||
|
|
|
||||||
|
|
@ -12,8 +12,8 @@ export default async (api) => {
|
||||||
const pageModelsTemplatePath = path.join(templatePath, 'pageModels.ts.ejs')
|
const pageModelsTemplatePath = path.join(templatePath, 'pageModels.ts.ejs')
|
||||||
const projectType = getValue('PROJECT_TYPE')
|
const projectType = getValue('PROJECT_TYPE')
|
||||||
|
|
||||||
await fse.copy(path.join(__dirname, '..', 'src/types/index.ts'), path.join(targetPath, 'store/types.ts'))
|
await fse.copy(path.join(__dirname, '..', 'src/types/index.ts'), path.join(targetPath, './types/store.ts'))
|
||||||
applyMethod('addIceTypesExport', { source: './store/types', specifier: '{ IStore }', exportName: 'store?: IStore' })
|
applyMethod('addIceTypesExport', { source: './types/store', specifier: '{ IStore }', exportName: 'store?: IStore' })
|
||||||
|
|
||||||
onGetWebpackConfig(config => {
|
onGetWebpackConfig(config => {
|
||||||
config.resolve.alias.set('$ice/appModels', path.join(targetPath, 'appModels.ts'))
|
config.resolve.alias.set('$ice/appModels', path.join(targetPath, 'appModels.ts'))
|
||||||
|
|
|
||||||
Loading…
Reference in New Issue