antd 是如何制作按需加载组件的?

antd 的源码都被封装了,不易阅读,哪位大佬能说明下antd 是如何制作按需加载组件的?我自己制作了一个组件包上传到 npm 安装之后报错,希望通过了解 antd 的制作按需加载组件得到一点思路,谢谢

阅读 517
评论 更新于 2019-08-08
    1 个回答

    babel-plugin-import
    https://www.npmjs.com/package...


    上面那个网址里有说原理是把

    import { Button } from 'antd';

    这种引用语句编译成下面这种(使用{ "libraryName": "antd", style: "css" } options)

    var _button = require('antd/lib/button');
    require('antd/lib/button/style/css');

    至于你自己写的库报错,是因为其他原因


    https://unpkg.com/browse/antd...
    你看一下antd的lib下面的文件,已经是经过jsx编译的了(所以不会因为不认jsx模板报错)
    而antd的github项目是没有lib文件夹的
    https://github.com/ant-design...
    说明lib是编译生成的
    根据package.json中的命令,antd是自己专门写了个https://github.com/ant-design...
    你要是也想搞个自动打包恐怕得自己写一个
    像babel-plugin-import支持的lodash也是自己写了个编译脚本,你可以参考一下
    https://github.com/lodash/lodash

    评论 赞赏 2019-08-08
      撰写回答

      登录后参与交流、获取后续更新提醒