mjzhang1993 2021-04-02 17:56 采纳率: 0%
浏览 53

如何在同一个文件中 export {Button} 一个 import {Button} 的模块

前因:

1. 我在项目中使用了 babel-plugin-import 插件

['import', { libraryName: 'antd', libraryDirectory: 'es', style: true }, 'antd']

2. 原本想通过如下方式导出组件,但是build后样式文件没有被打包 https://github.com/ant-design/babel-plugin-import/issues/569 

export { Button, Row } from 'antd';

3. 因此我尝试先 import 进来组件,再 export 出去(注意:为了方便其他人使用 不能 export default { Button})

import { Button, Row } from 'antd';

export { Button, Row };
// export default { Button, Row }; 不希望 export default

4. 结果 webpack 报错 https://github.com/ant-design/babel-plugin-import/issues/331

ERROR in ./modules/library/antd/index.tsx 1:9
Module parse failed: Export 'Button' is not defined (1:9)
File was processed with these loaders:
 * ./node_modules/babel-loader/lib/index.js
You may need an additional loader to handle the result of these loaders.
> export { Button, Row }; 
 @ container entry ./antd[0]

webpack 5.28.0 compiled with 1 error in 4966 ms

问题:

1. 主要是希望使用这个模块使用者可以通过 import {Button} from 'my-module' 来加载组件

2.  因为各种原因,不希望直接引用 antd 的组件,一定要中转一次,还得是按需的

3.  如果能帮助我解决 export { Button, Row } from 'antd'; build 后没有样式的问题那就更好了

4. 请求帮助提供一个可以 import 进来组件,再 export {} 出去的方案,十分感谢

 

补充:已经找到个方法,但是写起来很繁琐,希望有其他方案

补充: 不是要解决 antd  按需加载(按需加载早就实现了)

补充: 不直接使用 antd 的原因,是因为我在做一个 module Federation 模块联邦的项目,我想减少 antd 打包的体积(按需),但是 模块联邦 shared 的模块是全量的不可按需的,因此我打算实现一个 ”库应用“,这个 ”库应用“ 专门做 antd 的打包,其他应用使用到的 antd 组件都从这个库应用远程引用,在打包这个库应用是发现 我只是 export {组件} from 'antd', 这种方式会导致 样式文件没有被打包进来(https://github.com/ant-design/babel-plugin-import/issues/569 ),因此有了上述的问题

import { Button as _Button, Row as _Row } from 'antd';

export const Button = _Button;
export const Row = _Row;
  • 写回答

1条回答 默认 最新

  • hfhan_872914334 2021-04-04 01:41
    关注

    网上直接搜 antd按需引入样式,一大把,https://zhuanlan.zhihu.com/p/42313148

    评论

报告相同问题?

悬赏问题

  • ¥15 c语言怎么用printf(“\b \b”)与getch()实现黑框里写入与删除?
  • ¥20 怎么用dlib库的算法识别小麦病虫害
  • ¥15 华为ensp模拟器中S5700交换机在配置过程中老是反复重启
  • ¥15 java写代码遇到问题,求帮助
  • ¥15 uniapp uview http 如何实现统一的请求异常信息提示?
  • ¥15 有了解d3和topogram.js库的吗?有偿请教
  • ¥100 任意维数的K均值聚类
  • ¥15 stamps做sbas-insar,时序沉降图怎么画
  • ¥15 买了个传感器,根据商家发的代码和步骤使用但是代码报错了不会改,有没有人可以看看
  • ¥15 关于#Java#的问题,如何解决?