文件名称 | 文件说明 |
---|---|
config | 配置文件 |
dist | 打包文件 |
environments | 用来配置数据库信息 |
mock | 存放假数据的文件 |
node_modules | npm 安装的第三方依赖 |
public | 公用文件部分也是静态文件CSS、JS、IMG、字体、入口文件等文件存放位置 |
scripts | 弹出react-scripts的配置文件 |
src | 存放业务源码 |
.eslintconfig | 默认配置 |
package.json | 项目包文件(node_modulesd 的依赖是根据 package.json 来下载的) |
tsconfig.json | TypeScript 配置文件 |
文件名程 | 文件说明 |
---|---|
assets | 静态资源文件,放一些css文件和image图片 |
common | 定义共通的状态和方法 |
components | 组件文件 |
components—>common | components文件夹下的自定义共通组件,比如头部画面,底部画面等 |
components—>error | components文件夹下的error画面 |
components—>menu | components文件夹下的menu首页 |
components—>page | components文件夹下的page 画面文件 |
hooks | 自定义hook,复用的方法 |
redux | redux全局状态管理器 |
route | 工程的路由文件 |
utils | 工程的共通文件 |
App.tsx | 根文件 |
index.tsx | 工程的入口文件 |
src
import { PAGEID } from "~/route/pageConfig";
export enum ENV {
DEVELOPMENT = 'development',
PRODUCTION = 'production',
TEST = 'test',
}
export const Config = {
urlApi: '/HAG4030A',
illegal: `^(?![\\s\\S]*(\\\\n)|[\\s\\S]*(\\\\t)|[\\s\\S]*(\\t))[\\s\\S]*$`,
illegalCharacter: `^(?![\\s\\S]*(\\\\n)|[\\s\\S]*(\\\\t)|[\\s\\S]*(\\t)[\\s\\S]*(\\n))[\\s\\S]*$`,
hankaku: `ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz0123456789アイウエオカキクケコサシスセソタチツテトナニヌネノハヒフヘホマミムメモヤユヨラリルレロワヲンァィゥェォッャュョー゙゚ 。、!#%&()*+,-./:;<=>?@[]^_\`{|}~・「」$"'\\r\n`,
youon: 'ァィゥェォャュョッ',
pattarn: /^1[3456789]\d{9}$/,
YYYYMMDD: /^([0-9]{4})\/([0-1][0-9])\/([0-3][0-9])$/,
YYYYMM: /^([0-9]{4})\/([0-1][0-9])$/,
YYMMDD: /^([0-9]{2})\/([0-1][0-9])\/([0-3][0-9])$/,
YYMM: /^([0-9]{2})\/([0-1][0-9])$/,
MMDD: /^([0-1][0-9])\/([0-3][0-9])$/,
ROLLIST: /^\[(\{"rolCd":"[^({|}|,|")]+","rolKj":"[^({|}|,|")]+","shmFl":"[^({|}|,|")]+","hnbTenKb":"[^({|}|,|")]+"\},)*(\{"rolCd":"[^({|}|,|")]+","rolKj":"[^({|}|,|")]+","shmFl":"[^({|}|,|")]+","hnbTenKb":"[^({|}|,|")]+"\}\])$/g,
yyyymmdd: /^([0-9]{4})([0-1][0-9])([0-3][0-9])$/,
yyyymm: /^([0-9]{4})([0-1][0-9])$/,
yymmdd: /^([0-9]{2})([0-1][0-9])([0-3][0-9])$/,
yymm: /^([0-9]{2})([0-1][0-9])$/,
mmdd: /^([0-1][0-9])([0-3][0-9])$/,
tel: /^(\+?81|0)\d{1,4}[ -]?\d{1,4}[ -]?\d{4}$/,
};
export const Constants = {
STORAGE_PREFIX: 'persist:',
STORAGE_ROOT: 'root',
STORAGE_BUSSINESS_COMMON: 'busesCommon',
STORAGE_KEY_CLEAR_FLG: 'clearFlg',
STORAGE_CLEAR_FLG_VAL_TRUE: '1',
STORAGE_KEY_DIRECT_URL_ACCESS: 'direct_url_access',
STORAGE_KEY_GMN_SNI_FLG: 'gmn_sni_flg',
STR_TRUE:'true'
}
export const singlePage: string[] = [
PAGEID.XARPAGE0010
]
export const ButtonState = {
// 照会
BUTTEN_DO_REF_BTN: 'doRefBtn',
// 検索
BUTTEN_DO_SRH_BTN: 'doSrhBtn',
// 履歴
BUTTEN_GO_RIREKI_BTN: 'goRirekiBtn',
// 修正
BUTTEN_DO_UPD_BTN: 'doUpdBtn',
// 戻る
BUTTEN_BACK_BTN: 'backBtn',
// 一覧
BUTTEN_GO_ICHIRAN_BTN: 'goIchiranBtn',
}
components 组件文件
import * as React from 'react';
export default React.memo(function NotFoundPage() {
return (
<>
<h3 style={{textAlign:'center'}}>
<span style={{color:'#33717f'}}>システムエラー画面 -404-</span>
</h3>
<h4>エラー通知</h4>
<table>
<tr>
<td>システムエラーが発生しました。システム管理者に連絡してください。</td>
</tr>
</table>
</>;
)
});
hooks 自定义hook
redux 全局状态管理器
route 路由文件
utils 共用的方法