解决antd icon打包过大的问题

相门城下

1.webpack配置alias

resolve: {
    alias: {
        ...
        '@ant-design/icons/lib/dist$': path.resolve(__dirname, '../src/icons.ts'),
        '@': path.resolve(__dirname, '../src')
    }
}

2.在src目录下编写icons.ts,内容是使用到的icon

export {default as UserOutline} from '@ant-design/icons/lib/outline/UserOutline';
export {default as CloseCircleFill} from '@ant-design/icons/lib/fill/CloseCircleFill';
export {default as InfoCircleFill} from '@ant-design/icons/lib/fill/InfoCircleFill';
export {default as CheckCircleFill} from '@ant-design/icons/lib/fill/CheckCircleFill';

注:1.如果打包错误,请检查alias的配置和icons.ts的路径
2.icon.ts的内容,包括自己用到的icon和组件用到的icon

阅读 5.4k

前端备忘录
老来多忘事,记不住的就写下来吧
773 声望
7 粉丝
0 条评论
你知道吗?

773 声望
7 粉丝
宣传栏