美文网首页
记录--antd pro补充

记录--antd pro补充

作者: 前端喵 | 来源:发表于2019-03-29 17:05 被阅读0次

    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

    相关文章

      网友评论

          本文标题:记录--antd pro补充

          本文链接:https://www.haomeiwen.com/subject/hahrbqtx.html