create-react-app npm运行构建错误的CSS顺序

Question

我进入了index.js

import './styles/index.css';
import './styles/responsive.css';

index.css包含浏览器桌面样式，而当屏幕变小时（如在移动设备中），response.css将被覆盖。 在开发中，这很好用，但是在运行npm run build之后使用编译后的CSS会使响应样式混乱。 尝试调试后，我发现在build / static / css / main * .chunk.css中，来自active.css的条目比index.css排名靠前，这产生了问题。

有什么办法可以解决这个问题？ 我可以将response.css合并到index.css中，但我认为这只是一种解决方法

Answer 1

我相信您的问题没有答案。 如果您用Google搜索“错误的CSS顺序”，则可能会发现2年以上的webpack的github问题。 像这样的https://github.com/webpack-contrib/extract-text-webpack-plugin/issues/548 ，还有很多其他的。

我已经通过将样式合并到一个文件中解决了这一问题。 我使用scss所以做了类似的事情：

// main.scss

@import 'globals';
@import 'responsive';

和在js

import main.scss