# React

{% hint style="info" %}
脚手架 Cra 
{% endhint %}

**1、Package 增加 homepage 选项，配置 homepage 相对路径访问 ./** 

```
{
    "name": "my-app",
    "version": "0.1.0",
    "private": true,
    "homepage": "./",
    "dependencies": {
        "@testing-library/jest-dom": "^5.11.4",
        "@testing-library/react": "^11.1.0",
        "@testing-library/user-event": "^12.1.10",
        "react": "^17.0.2",
        "react-dom": "^17.0.2",
        "react-router-dom": "^5.2.0",
        "react-scripts": "4.0.3",
        "web-vitals": "^1.0.1"
    }
    ...
}
```

\
**2、配置路由支持 HashRouter、因为默认路由是 history 模式, 需要更改为 hash 模式**

```
ReactDOM.render(
    <React.StrictMode>
        <HashRouter>
            <Switch>
                <Route exact path="/">
                    <App/>
                </Route>
                <Route path="/content">
                    <Content/>
                </Route>
            </Switch>
        </HashRouter>
    </React.StrictMode>,
    document.getElementById('root')
);

```

**3、最后将生成的静态文件夹，压缩成zip包上传到WuliHub空间即可**