快速创建 React Ts APP

初始化结构, 安装依赖

使用脚本创建框架

1	npx create-react-app quant-tools --template typescript

在已有程序中添加 ts 支持

1	yarn add -D typescript @types/node @types/react @types/react-dom @types/jest

安装 Mui 依赖

1	yarn add @mui/icons-material @mui/material @mui/styles

安装其他依赖

# emotion
yarn add @emotion/react @emotion/styled
# 多 class name 支持
yarn add classnames
# 轮播图, Router
yarn add react-material-ui-carousel react-router-dom

修改 public 文件夹内容

替换 logo 图片

favicon.ico
logo192.png
logo512.png

修改 manifest.json 中 short_name, name 字段

修改 index.html 中 title, meta description 字段内容, 在 head 中添加

1 2	<link rel="stylesheet" href="https://fonts.googleapis.com/css?family=Roboto:300,400,500,700&display=swap" /> <link rel="stylesheet" href="https://fonts.googleapis.com/icon?family=Material+Icons" />

修改 index.html 中 meta viewport 字段内容为

1	<meta name="viewport" content="minimum-scale=1, initial-scale=1, width=device-width" />

修改 src 文件夹内容

删除文件

App.js
App.css
App.test.js
logo.svg

删除 index.js 文件中 import App from './App'; 和 <App /> 部分

增加 index.js 文件中 import { CssBaseline } from "@mui/material"; 引入包

修改 render 结构

<React.StrictMode>
  <React.Fragment>
    <CssBaseline />
    {/* ... */}
  </React.Fragment>
</React.StrictMode>,