ant pro 2补充说明
此文档内容为常见,但ant pro 2官网未写明的问题
ant pro 2的基础项目
ant pro 2在umijs的基础上创建,大部分问题可在umijs官网查询
umijs: https://umijs.org/zh/
路由改为hash方式
因为使用browser路由,需要在服务器额外进行处理,建议改为hash配置。
方法如下,在 config/config.js 中添加代码
history: 'hash'
配置代理服务器
参考资料: https://umijs.org/zh/guide/config.html#%E9%85%8D%E7%BD%AE%E6%96%87%E4%BB%B6
代理服务器的配置位置从 .webpackrc.js 改为 .umirc.js (手动在项目根目录创建)或者 config/config.js(默认已创建),示例如下
proxy: {
'/api/*': {
target: 'https://www.baidu.com',
changeOrigin: true,
secure: false,
pathRewrite: { "^/api/.*": "" },
}
}
配置参数参考 https://www.webpackjs.com/configuration/dev-server/#devserver-proxy
路由配置
配置文件位置 /config/router.config.js,配置一个路由的格式如下
{
path: '/test', //url路径
name: 'test', //菜单名称
icon: 'plus', //菜单图标
component: './Test', //模块路径
hideInMenu: false, //是否在菜单中隐藏,true表示隐藏
},
路由配置完成会,菜单一般会显示为英文,例如上述菜单会显示为:menu.test,
需要在src/locales的语言包中添加menu.test对应的文字,例如在zh-CN.js中添加下方代码后,菜单就会显示为:测试页
'menu.test': '测试页',
合并js文件
antd pro 2默认把模块文件拆分,如果需要合并为一个,在/config/config.js中修改配置项
dynamicImport: false,
dynamicImport配置参考 https://umijs.org/zh/plugin/umi-plugin-react.html#dynamicimport
网友评论