Midway-React-SSR配置
配置是开发一个项目的重要环节，它是一个项目的基础。想要了解一个项目，先要了解它的配置。
web前端站点配置
midway-react-ssr 内置了一个web前端站点配置文件 /web/config/settings.ts。
ts
/**
* 站点配置
* @author LiQingSong
*/
export interface SettingsType {
/**
* 站点名称
*/
siteTitle: string;
/**
* 站点本地存储Token 的 Key值
*/
siteTokenKey: string;
/**
* Ajax请求头发送Token 的 Key值
*/
ajaxHeadersTokenKey: string;
/**
* Ajax返回值不参加统一验证的api地址
*/
ajaxResponseNoVerifyUrl: string[];
}
const settings: SettingsType = {
siteTitle: 'MIDWAY-REACT-SSR',
siteTokenKey: 'midway_react_ssr_token',
ajaxHeadersTokenKey: 'x-token',
ajaxResponseNoVerifyUrl: [
'/user/login', // 用户登录
],
};
export default settings;
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
web前端路由入口配置
midway-react-ssr 独立出了一个前端路由入口配置文件 /web/config/routes.tsx，其目的主要是：统一引入/web/layouts下不同layout的路由，集中处理重新格式化路由。
目前 /web/config/routes.tsx 的内容为：
ts
/**
* 路由配置 入口
* @author LiQingSong
*/
import { lazy, memo, Suspense } from 'react';
import { useLocation, useRoutes } from 'react-router-dom';
import { createUseRoutes, pathKeyCreateUseRoutes } from '@/utils/router';
import PageLoading from '@/components/PageLoading';
// BlankLayout
import BlankLayout from '@/layouts/BlankLayout';
// DefaultLayout
import DefaultLayoutRoutes from '@/layouts/DefaultLayout/routes';
import DefaultLayout from '@/layouts/DefaultLayout';
import { IRouter } from '@/@types/router';
/**
* 配置所有路由
*/
export const originalRoutes: IRouter[] = [
{
path: '/',
children: DefaultLayoutRoutes,
},
];
/**
* 配置的路由转RouteObject[]
*/
export const routes = createUseRoutes([
...originalRoutes,
{
path: '*',
component: lazy(() => import('@/pages/404')),
},
]);
/**
* 配置框架对应的路由
*/
const layoutToRoutes = {
DefaultLayout: pathKeyCreateUseRoutes([routes[0]]),
};
export const SuspenseLazy = memo(
({ children }: { children: React.ReactNode }) => (
<Suspense fallback={<PageLoading />}>{children}</Suspense>
)
);
export default memo(() => {
const routesElement = useRoutes(routes);
const location = useLocation();
// 属于 DefaultLayout
if (layoutToRoutes.DefaultLayout[location.pathname]) {
return (
<DefaultLayout>
<SuspenseLazy>{routesElement}</SuspenseLazy>
</DefaultLayout>
);
}
// 默认 BlankLayout
return (
<BlankLayout>
<SuspenseLazy>{routesElement}</SuspenseLazy>
</BlankLayout>
);
});
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
说明：
详细文档请查看：路由
vite 配置
midway-react-ssr web前端是基于 vite 来进行构建，所以有个 vite 配置文件 /web/vite.config.ts。
web前端环境变量
midway-react-ssr web前端是基于 vite 来进行构建，所以有环境变量配置文件 /web/.env.development、/web/.env.production。
midway 多环境配置
midway-react-ssr Node.js服务端是基于 Midway 来进行构建，所以有多环境配置配置文件 /src/config/**。