Commit 18790a5d by 周志凯

refactor: init

1 parent 8f5fa92b
'use strict'
// https://github.com/leonardoanalista/cz-customizable/blob/master/cz-config-EXAMPLE.js
module.exports = {
types: [
{ value: 'feat', name: 'feat: 新功能' },
{ value: 'fix', name: 'fix: 修复' },
{ value: 'docs', name: 'docs: 文档注释' },
{ value: 'style', name: 'style: 代码格式(不影响代码运行的变动)' },
{ value: 'refactor', name: 'refactor: 重构(既不增加新功能, 也不是修复 bug)' },
{ value: 'perf', name: 'perf: 性能优化' },
{ value: 'test', name: 'test: 增加测试' },
{ value: 'chore', name: 'chore: 构建过程或辅助工具变动' },
{ value: 'revert', name: 'revert: 回退' },
{ value: 'build', name: 'build: 打包' },
],
// override the messages, defaults are as follows
messages: {
type: '请选择提交类型:',
// scope: '请选择文件修改范围(可选):',
// used if allowCustomScopes is true
customScope: '请输入修改范围(可选):',
subject: '请简要描述提交(必填):',
body: '请输入详细描述(可选, 待优化去除, 跳过即可):',
// breaking: 'List any BREAKING CHANGES(optional):\n',
footer: '请输入要关闭的issue(待优化去除, 跳过即可):',
confirmCommit: '确认使用以上信息提交?(y/n/e/h)'
},
allowCustomScopes: true,
// allowBreakingChanges: ['feat', 'fix'],
skipQuestions: ['body', 'footer'],
// limit subject length, commitlint 默认是72
subjectLimit: 72
}
module.exports = {
extends: ['cz']
}
const { override, addLessLoader, fixBabelImports } = require('customize-cra');
module.exports = override(
fixBabelImports('import', {
libraryName: 'antd',
libraryDirectory: 'es',
style: true,
}),
addLessLoader({
lessOptions: {
javascriptEnabled: true,
}
}),
)
......@@ -10,20 +10,34 @@
"@types/node": "^12.0.0",
"@types/react": "^16.9.0",
"@types/react-dom": "^16.9.0",
"@types/react-router-dom": "^5.1.5",
"babel-plugin-import": "^1.13.0",
"react": "^16.13.1",
"react-dom": "^16.13.1",
"react-router-dom": "^5.2.0",
"react-scripts": "3.4.1",
"typescript": "~3.7.2"
},
"scripts": {
"start": "react-scripts start",
"build": "react-scripts build",
"test": "react-scripts test",
"start": "react-app-rewired start",
"build": "react-app-rewired build",
"test": "react-app-rewired test",
"genlog": "conventional-changelog -p angular -i CHANGELOG.md -s -r 0 && git add CHANGELOG.md",
"eject": "react-scripts eject"
},
"eslintConfig": {
"extends": "react-app"
},
"config": {
"commitizen": {
"path": "node_modules/cz-customizable"
}
},
"husky": {
"hooks": {
"commit-config": "commitlint -E HUSKY_GIT_PARAMS"
}
},
"browserslist": {
"production": [
">0.2%",
......@@ -35,5 +49,17 @@
"last 1 firefox version",
"last 1 safari version"
]
},
"devDependencies": {
"@commitlint/cli": "^8.3.5",
"antd": "^4.3.1",
"commitlint-config-cz": "^0.13.1",
"conventional-changelog": "^3.1.21",
"customize-cra": "^1.0.0",
"cz-customizable": "^6.2.0",
"husky": "^4.2.5",
"less": "^3.11.2",
"less-loader": "^6.1.0",
"react-app-rewired": "^2.1.6"
}
}
import React from 'react';
import logo from './logo.svg';
import './App.css';
import React, { FC } from 'react';
import { HashRouter as Router, Route } from 'react-router-dom';
import PageLayout from './layouts/PageLayout';
import Login from './pages/Login';
function App() {
return (
<div className="App">
<header className="App-header">
<img src={logo} className="App-logo" alt="logo" />
<p>
Edit <code>src/App.tsx</code> and save to reload.
</p>
<a
className="App-link"
href="https://reactjs.org"
target="_blank"
rel="noopener noreferrer"
>
Learn React
</a>
</header>
</div>
);
}
const App:FC = () => (
<Router>
<Route>
<Route path="/login" extra component={Login} />
<PageLayout />
</Route>
</Router>
);
export default App;
......@@ -5,9 +5,7 @@ import App from './App';
import * as serviceWorker from './serviceWorker';
ReactDOM.render(
<React.StrictMode>
<App />
</React.StrictMode>,
<App />,
document.getElementById('root')
);
......
.logo {
width: 120px;
height: 31px;
background: rgba(255, 255, 255, 0.3);
margin: 16px 28px 16px 0;
float: left;
}
\ No newline at end of file
import React, { FC } from 'react';
import { Layout, Menu, Breadcrumb } from 'antd';
import {
Link,
Switch,
withRouter,
RouteComponentProps,
Route,
} from 'react-router-dom';
import routes from '../router';
import './PageLayout.less';
const { Item } = Menu;
const { Header, Content, Sider } = Layout;
interface PageLayoutProp {}
const PageLayout:FC<PageLayoutProp & RouteComponentProps> = () => (
<Layout>
<Header className="header">
<div className="logo" />
</Header>
<Layout>
<Sider width={200} className="site-layout-background">
<Menu
mode="inline"
defaultSelectedKeys={['SystemSetting']}
style={{ height: '100%', borderRight: 0 }}
>
{routes.map(route => (
<Item key={route.key}>
<Link to={route.path}>
<span>{route.name}</span>
</Link>
</Item>
))}
</Menu>
</Sider>
<Layout style={{ padding: '0 24px 24px' }}>
<Breadcrumb style={{ margin: '16px 0' }}>
<Breadcrumb.Item>Home</Breadcrumb.Item>
<Breadcrumb.Item>List</Breadcrumb.Item>
<Breadcrumb.Item>App</Breadcrumb.Item>
</Breadcrumb>
<Content
className="site-layout-background"
style={{
padding: 24,
margin: 0,
minHeight: 280,
}}
>
<Switch>
{routes.map(route => (
<Route
key={route.key}
path={route.path}
component={route.component}
/>
))}
</Switch>
</Content>
</Layout>
</Layout>
</Layout>
)
export default withRouter(PageLayout);
import React, { FC } from 'react';
interface AppSettingProp {}
const AppSetting: FC<AppSettingProp> = () => (<div>AppSetting</div>)
export default AppSetting;
import React, { FC } from 'react';
interface LoginProp {}
const Login: FC<LoginProp> = () => (<div>Login</div>)
export default Login;
import React, { FC } from 'react';
interface MenuManageProp {}
const MenuManage: FC<MenuManageProp> = () => (<div>MenuManage</div>)
export default MenuManage;
import React, { FC } from 'react';
interface SystemSettingProp {}
const SystemSetting: FC<SystemSettingProp> = () => (<div>SystemSetting</div>)
export default SystemSetting;
import { RouteComponentProps } from 'react-router-dom';
import SystemSetting from '../pages/SystemSetting';
import MenuManage from '../pages/MenuManage';
import AppSetting from '../pages/AppSetting';
export interface RouteListProp {
name: string
key: string
path: string
icon?: string
redirect?: string
children?: RouteListProp
component?:
| React.ComponentType<RouteComponentProps<any>>
| React.ComponentType<any>
meta?: {
role: string[]
}
}
const routes: RouteListProp[] = [
{
name: '系统设置',
key: 'SystemSetting',
path: 'system-setting',
component: SystemSetting
},
{
name: '菜单管理',
key: 'MenuManage',
path: 'menu-manage',
component: MenuManage
},
{
name: '应用设置',
key: 'AppSetting',
path: 'app-setting',
component: AppSetting
}
]
export default routes;
This diff could not be displayed because it is too large.
Markdown is supported
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!