一般来讲,网站都部署在根目录,但某些厂商可能架构很多年不变,或者说不想新开域名,这时候就会放到二级或者三级目录,这时候就需要对路径问题进行适配。
一,提供全局路径变量
如果是非根路径,必须设置。
window.publicPath = '/';
二,资源路径适配
重写 webpack 暴露的变量。
__webpack_public_path__ = window.publicPath;
三,路由配置适配
配置 basename
后可支持 Link
和 history
。
<Router basename={window.publicPath}>
<Provider store={store}>
<App />
</Provider>
</Router>
四,JS 适配
React-Router
从 V5
版本以后不再支持 API
方式跳转,代码里可能存在 window.location
方式跳转,而这个跳转是脱离 Router 控制之内的。
window.location.href = window.publicPath + "/login";