Ant-design-pro: 配置antd的externals之后,antd还是会被打包进去 🐛[BUG]

Created on 9 Dec 2019  ·  7Comments  ·  Source: ant-design/ant-design-pro

🐛 bug 描述

webpack的配置项中配置antdexternals选项之后之后,antd还是会被打包进去。

📷 复现步骤

  1. document.ejs中引入antd的相关cdn如下:
    image
  2. config/plugin.config.ts配置externals选项如下:
  // externals 配置
  config.externals({
    react: 'React',
    'react-dom': 'ReactDOM',
    moment: 'moment',
    antd: 'antd',
  });
  1. 运行打包分析命令yarn analyze之后发现antd还是被打包进去了,其他的externals配置项并没有打包进去例如react、react-dom等
    image

🏞 期望结果

进行externals配置之后antd可以不被打包进去。

© 版本信息

  • Ant Design Pro 版本 4.0.0
  • umi 版本 2.9.6
  • 浏览器环境 Chrome 78.0.3904.108
  • 开发环境 mac OS 10.15.1
🛑 bug

Most helpful comment

你应该是配置了按需加载导致引用的方式变了,可以把按需加载代码去掉就可以了
plugins: [ [ "import", { "libraryName": "antd", "style": true } ] ]

All 7 comments

你好像写错了

https://umijs.org/config/#externals 在 config.js 中

@chenshuai2144 配置到config里效果也是一样的,antd还是会被打包进去。
另外在plugin.config.ts里配置应该也是没问题的,因为react、react-dom都已经生效了。

这个问题解决了吗?我这里也遇到了

你应该是配置了按需加载导致引用的方式变了,可以把按需加载代码去掉就可以了
plugins: [ [ "import", { "libraryName": "antd", "style": true } ] ]

@gyf30827 对,谢谢!移除antd的按需加载就可以了,pro里通过umi-plugin-react来配置antd的按需加载,文档地址

Pro V5版本打包也是这样,externals包含了antd: 'window.antd',scripts包含了对应antd的CDN地址,但是analyze后发现antd还在里面。
另外,全局的按需加载已经被我关了dynamicImport: false
511605690392_ pic_hd

配置react、react-dom externals后直接报错了
image
image
image
这个需要怎么处理

Was this page helpful?
0 / 5 - 0 ratings

Related issues

cheung1111 picture cheung1111  ·  3Comments

RichardStark picture RichardStark  ·  3Comments

ghost picture ghost  ·  3Comments

Yoping picture Yoping  ·  3Comments

yaoleiroyal picture yaoleiroyal  ·  3Comments