在带有cssmodules的CRA中使用react lazy会导致块在生产中具有重复的css

在带有cssmodules的CRA（Create React App）中使用React Lazy可能会导致块在生产环境中具有重复的CSS。这个问题主要是由于Webpack的代码拆分和动态导入导致的。

在使用React Lazy进行组件懒加载时，Webpack会将懒加载的组件代码拆分为单独的块，以减小初始加载的文件大小。然而，由于CSS模块化（CSS modules）的特性，样式也会被当做模块处理并拆分到对应的块中。

在生产环境中，当多个组件使用相同的CSS模块时，由于代码拆分导致的块重复加载，这些块可能会包含相同的CSS模块，从而导致重复的CSS。

要解决这个问题，可以尝试以下几种方法：

1. 使用Webpack的SplitChunks插件进行更细粒度的代码拆分配置，以避免重复的CSS模块被拆分到不同的块中。
2. 在Webpack的配置文件中，通过optimization.splitChunks.cacheGroups选项，将共享相同CSS模块的组件归为同一个块，避免重复加载。
3. 使用CSS的全局样式（global styles）来替代CSS模块，将样式直接应用于整个应用程序，而不是模块化处理。
4. 如果不使用CSS模块化，可以考虑在Webpack配置中禁用CSS模块化，以避免重复的CSS模块。

需要注意的是，以上方法都需要在Webpack配置文件中进行相应的修改。此外，对于不同的项目和具体场景，可能需要综合考虑实际情况来选择合适的解决方案。

关于腾讯云相关产品和产品介绍链接地址，由于要求不提及具体的云计算品牌商，无法提供具体的链接。但腾讯云提供了丰富的云计算服务和解决方案，可以根据具体需求查阅腾讯云官方文档或与腾讯云技术支持联系获取更多信息。