-webkit-flex-direction 使用 React 时未在浏览器上显示

Question

我最近不得不支持一个只能在 React 应用程序中使用 -webkit-flex 的设备。当我添加 -webkit- 前缀时，所有 css flex 属性都可以正常工作，但 -webkit-flex-direction 属性不会出现在浏览器中。 css 文件加载正常，所有其他属性都显示并正确更新。

我尝试了一个非 React 应用程序并且该属性工作正常，所以我知道问题出在 React 上。我在这里创建了一个最小的示例： https://github.com/CarlesRojas/react-webkit-flex-direction-issue

该应用是使用 create-react-app 工具制作的，唯一相关的文件是：

src/App.js

src/App.css

为什么这个属性不起作用？提前致谢。

Answer 1

目前，互联网上没有任何令人信服的信息说明为什么 React 无法识别 -webkit-flex-direction 属性，但根据您的 minimal example code，以下步骤是解决此问题的解决方案：

1. 从App.js 中删除import "./App.css"; 文件。
2. 将App.css 文件移动到public 文件夹。
3. 将<link rel="stylesheet" href="App.css" /> 添加到index.html 的head 部分

这样，React 就不会干扰外部 CSS 文件的内容了。