feat: support github actions

.github/workflows/deploy.yaml

@@ -0,0 +1,39 @@
+name: Build and Deploy to GitHub Pages
+
+on:
+  push:
+    branches:
+      - main
+
+jobs:
+  build-and-deploy:
+    runs-on: ubuntu-latest
+
+    steps:
+    - name: Checkout Repository
+      uses: actions/checkout@v2
+
+    - name: Setup Node.js
+      uses: actions/setup-node@v2
+      with:
+        node-version: '16'
+
+    - name: Cache pnpm modules
+      uses: actions/cache@v2
+      with:
+        path: ~/.pnpm-store
+        key: ${{ runner.os }}-pnpm-${{ hashFiles('**/pnpm-lock.yaml') }}
+        restore-keys: |
+          ${{ runner.os }}-pnpm-
+
+    - name: Install Dependencies
+      run: pnpm install
+
+    - name: Build Project
+      run: pnpm build
+
+    - name: Deploy to GitHub Pages
+      uses: peaceiris/actions-gh-pages@v3
+      with:
+        github_token: ${{ secrets.GITHUB_TOKEN }}
+        publish_dir: ./build

README.md

@@ -1,6 +1,41 @@
-# Landing create-react-app Example
+# Official-Site
+
+我们使用 create-react-app 与 landing-antdesign 来编译官网
 
 详细使用请查看 landing 里的 [use in create-react-app](https://landing.ant.design/docs/use/create-react-app)
 
 This project was bootstrapped with [Create React App](https://github.com/facebook/create-react-app).
 
+## 依赖安装
+
+```bash
+pnpn i # 提前安装 npm、pnpm 等基础前端 cli
+```
+
+运行的时候可能会遇到 node.js 版本过高导致的安全校验不过，需要使用 nvm 降低版本
+```bash
+nvm use v16.19.1 # 需要提前安装 nvm
+```
+
+在这里，如果你是 windows 系统，可能需要将 `package.json` 中的 `scripts`中的`start`改成如下内容
+```json
+"start": "SET NODE_OPTIONS=--openssl-legacy-provider && react-app-rewired start",
+```
+
+## 运行测试
+
+直接运行
+
+```bash
+pnpm run start
+```
+
+## 编译
+
+```bash
+pnpm build
+```
+
+之后会在根目录中编译 pnpm
+
+本项目目前使用 Github Action 执行自动编译发布ci，目前不需要手动编译

package.json

@@ -16,7 +16,7 @@
     "react-sublime-video": "^0.2.5"
   },
   "scripts": {
-    "start": "SET NODE_OPTIONS=--openssl-legacy-provider && react-app-rewired start",
+    "start": "react-app-rewired start",
     "build": "react-app-rewired build",
     "test": "react-app-rewired test",
     "eject": "react-app-rewired eject"

src/Home/Banner0.jsx

@@ -0,0 +1,53 @@
+import React from 'react';
+import { Button } from 'antd';
+// import { DownOutlined } from '@ant-design/icons';
+import QueueAnim from 'rc-queue-anim';
+import TweenOne from 'rc-tween-one';
+import { isImg } from './utils';
+
+class Banner extends React.PureComponent {
+  render() {
+    const { ...currentProps } = this.props;
+    const { dataSource } = currentProps;
+    delete currentProps.dataSource;
+    delete currentProps.isMobile;
+    return (
+      <div {...currentProps} {...dataSource.wrapper}>
+        <QueueAnim
+          key="QueueAnim"
+          type={['bottom', 'top']}
+          delay={200}
+          {...dataSource.textWrapper}
+        >
+          <div key="title" {...dataSource.title}>
+            {typeof dataSource.title.children === 'string' &&
+            dataSource.title.children.match(isImg) ? (
+              <img src={dataSource.title.children} width="100%" alt="img" />
+            ) : (
+              dataSource.title.children
+            )}
+          </div>
+          <div key="content" {...dataSource.content}>
+            {dataSource.content.children}
+          </div>
+          <Button ghost key="button" {...dataSource.button}>
+            {dataSource.button.children}
+          </Button>
+        </QueueAnim>
+        <TweenOne
+          animation={{
+            y: '-=20',
+            yoyo: true,
+            repeat: -1,
+            duration: 1000,
+          }}
+          className="banner0-icon"
+          key="icon"
+        >
+          {/* <DownOutlined /> */}
+        </TweenOne>
+      </div>
+    );
+  }
+}
+export default Banner;