Css ReactJS-拒绝应用内联样式，因为它违反了以下内容安全策略指令

在生产环境中加载ReactJS项目时，我在浏览器检查器（Chrome、Brave、Safari）中遇到以下错误：

Refused to apply inline style because it violates the following Content Security Policy directive: "style-src-elem 'self' https://fonts.googleapis.com". Either the 'unsafe-inline' keyword, a hash ('sha256-TMIFk5ZjGNpczjRE6YVaBrPXVNzANj9JRK+w2bh9TX8='), or a nonce ('nonce-...') is required to enable inline execution.

我使用以下命令构建ReactJS项目（它解决了内联脚本问题，但没有解决内联样式问题）：

这是指样式的CSP策略部分：

Header set Content-Security-Policy "default-src 'self'; style-src 'self'; style-src-elem 'self' https://fonts.googleapis.com; ..."

我相信问题发生在构建阶段，React生成块文件（名称为'2.3c013fe3.chunk.js'）并在代码中嵌入内联样式，尽管我在源代码中的任何地方都没有使用内联样式。所有样式都包含在fileX.module.css中，并导入到tsx文件中，如以下示例所示：

Example.tsx

import styles from './Example.module.css';

const Example = () => (
    <div className={styles.container}>
        Hello world
    </div>
);

如果自动生成的区块文件是问题所在，我不知道如何使用哈希或nonce选项解决这个问题，因为React将始终生成这些内联样式。另一方面，我假设不安全内联不是一个选项，因为这基本上使CSP无用

---

有没有关于CSP指令或React设置的建议来解决此问题？（我阅读了所有类似的问答，但没有一个提到React的具体问题）

如果你能找到解决方法，我很想知道你是怎么做的…@Fieuxcédric不幸的是，我没有得到任何回复，也没有设法解决它，因此，同样的错误会一直出现在inspector中：/React.js的未来版本中可能会解决这个问题。。。

import styles from './Example.module.css';

const Example = () => (
    <div className={styles.container}>
        Hello world
    </div>
);

.container {
    display: flex;
    flex-direction: column;
    align-items: center;
}