search

SolidZORO / next-plugin-antd-less

🎩 Use Antd (Less) with Next.js v12, Zero Dependency on other Next-Plugins.
MIT License
345 stars 48 forks source link

feat: support for antd-pro #68

Closed szy0syz closed 2 years ago

szy0syz commented 2 years ago

目前在 next 11 中 使用动态导入 加载 antd-pro 组件样式异常，放宽正则匹配规则后可以正常使用。

szy0syz commented 2 years ago

解决方案来源于 pro-components/issues/2333

SolidZORO commented 2 years ago

Hi, 刚看了修改部分，其实这个是最开始的版本，后来为了兼容 serverless 才改成现在这个样子的。 参考 https://github.com/SolidZORO/next-plugin-antd-less/commit/d0bb2bc48a79c3752c04f81888a2e72dd30959b8

所以可以按照 /(antd\/.*?\/style).*(?<![.]js)$/ 只修改前面部分兼容 antd-pro 吗？

我刚想找 antd-pro 来看看 less 到底是怎么引用的，但是没找到。

你可以到这边 https://regex101.com/r/pj2uBb/1 修改一下正则，并添加一些 antd-pro 的规则吗？

import 'antd/button/style/index.less
import 'antd/button/style/index.css';
import 'antd/dist/button/style/index.css';
import 'antd/es/button/style/index.css';
import '~antd/es/style/themes/default.less';

目前你看到的应该只有这些，全是 antd 的。

szy0syz commented 2 years ago

👍 好的，这两天赶工先用上，我稍后点测试了回复。 😅

esymeptoo commented 2 years ago

image 我这边使用@ant-design/pro-layout build的时候直接就报错了 我发现只要是第三方包lib里 通过require引入less文件就会出问题

esymeptoo commented 2 years ago

请问有解决方案吗

SolidZORO commented 2 years ago

@esymeptoo 你看能不能自己排查一下，看一下 FAQ。另外包一下你的环境什么的，这样我如果有时间才好处理。当然我现在对 Next.js 也比较绝望，不知道要不要继续修下去。

https://github.com/SolidZORO/next-plugin-antd-less/blob/12098507b948f7728c73c6df8a39ac263de7354a/overrideWebpackConfig.js#L216-L221

ducan-ne commented 2 years ago

I'm solved with this addition regex https://github.com/clgtIO/next-plugin-antd-less/blob/00e79001548f0f5f02e45ec4d39925d427293e24/overrideWebpackConfig.js#L448-L448

esymeptoo commented 2 years ago

I'm solved with this addition regex https://github.com/clgtIO/next-plugin-antd-less/blob/00e79001548f0f5f02e45ec4d39925d427293e24/overrideWebpackConfig.js#L448-L448

i fixed it with next-transpile-modules

SolidZORO commented 2 years ago

now, v1.4.3 is support Antd Pro.

YoussefAK commented 2 years ago

Hi and thank you for the great next plugin. I have tried to add pro components in my project but without success, it seems that the pro components css are not loaded. Can you please provide an example using pro components? Thanks a lot.