banliyaya
V2EX  ›  Vue.js

公司项目使用到 ant-design-vue,在打包时发现 icons 占了 530k,请问该如何优化?

  •  
  •   banliyaya · Nov 19, 2019 · 7815 views
    This topic created in 2397 days ago, the information mentioned may be changed or developed.

    所有组件均采用按需引入,但是 icons 还是被打入了主包。 在 github 上查到官方有建议使用这个方法 alias: {'@ant-design/icons/lib/dist$': path.resolve(__dirname, './src/icons.js')} 也在对应的目录下创建了 icon.js 文件,也引入了自己所使用的 icon。 但是不管是运行时,或者打包时均提示: @ant-design/icons/lib/dist in ./node_modules/ant-design-vue/lib/icon/index.js 在 ant-design-vue/lib/icon/index.js 下没有找到这个依赖,但是自己查看这个源码却看到了有使用这个依赖,请问各位是哪里出现里问题呢?

    11 replies    2020-02-03 01:40:43 +08:00
    lework1234
        1
    lework1234  
       Nov 19, 2019
    按需引入
    Sendya
        3
    Sendya  
       Nov 19, 2019
    你可以在调整之后,用依赖分析是否有效果

    生效:
    https://i.loli.net/2019/11/19/1soAmtDbChyEXLS.png

    未生效:
    https://i.loli.net/2019/11/19/ZosBR3FVGnjJdSi.png
    Elfred2096
        4
    Elfred2096  
       Nov 20, 2019
    楼上不是作者吗
    banliyaya
        5
    banliyaya  
    OP
       Nov 20, 2019
    @Sendya 感谢,已经弄好了
    banliyaya
        6
    banliyaya  
    OP
       Nov 22, 2019
    @Sendya 您好,再请教一下,目前一般的 icon 都已经没有问题了。但是目前有 2 个组件都图片没有展示出来,分别是 message 和 popconfirm 都,其他都比如 select、datapicker 都在源码里面看到了引用的图标,也分别引入进来了,但是这 2 个怎么引入都不会显示,ExclamationCircleOutline、CheckCircleOutline
    hahahaa8797
        7
    hahahaa8797  
       Dec 18, 2019
    请问您是如何配置的,是 antd 的哪个版本呢?我这边配置以一直在报错
    webpack 已经配置好了,在 icon.js 里面应该怎么写呢? export { SearchOutlined } from "@ant-design/icons-vue";我这样写在框架中的 Icon.js 会报错 Cannot read property 'name' of undefined 我的版本如下:"@ant-design/icons": "^4.0.0-alpha.11","ant-design-vue": "^1.4.10"。希望能提供一下您这边成功的配置和对应的版本号,万分感谢
    banliyaya
        8
    banliyaya  
    OP
       Dec 18, 2019 via iPhone
    @hahahaa8797 按照官方的文档上面配置是没有问题的。icons 似乎不是独立出来的也没有版本号啊
    hahahaa8797
        9
    hahahaa8797  
       Dec 18, 2019
    已经解决了,是有独立版本的。在 ant-design-vue 的 package.json 里面可以看到。里面写的是 2.2.1 的版本,我就换到"@ant-design/icons": "^2.1.1"版本就可以了。版本之间差距太大了,文件结构都不一样了
    zhanglichun333
        10
    zhanglichun333  
       Feb 1, 2020
    @Sendya 你好,遇到相同的问题,可以把链接重新发一下吗?很感谢
    zhanglichun333
        11
    zhanglichun333  
       Feb 3, 2020
    你好,遇到相同的问题,请问是怎么解决
    About   ·   Help   ·   Advertise   ·   Blog   ·   API   ·   FAQ   ·   Solana   ·   3567 Online   Highest 6679   ·     Select Language
    创意工作者们的社区
    World is powered by solitude
    VERSION: 3.9.8.5 · 42ms · UTC 04:55 · PVG 12:55 · LAX 21:55 · JFK 00:55
    ♥ Do have faith in what you're doing.