codesandbox - 无法让 CSS 文件在 CodeSandbox 中工作

Question

我无法让 CSS 工作/包含在我创建的代码和框中。我的目标是简单地创建一个包含几个不同 CSS 和 JavaScript 文件的沙箱，并让这些文件与 index.html 文件中的 HTML 标记一起使用。

我在网上找到了一个可以使用 CSS 的沙箱，但它包含 CSS 的方式似乎与我正在做的类似。我决定慢慢将我的沙箱更改为他们的沙箱，看看我是否能发现差异，但是在将我的沙箱完全更改为他们的沙箱之后，我只剩下一个带有工作 CSS 的沙箱和一个带有不起作用的 CSS 的沙箱 - 但是这些沙盒看起来和我一模一样。

CSS 不起作用：（内联 CSS 除外） https://codesandbox.io/s/happy-rubin-cytfo?file=/index.html

CSS 确实有效： https ://codesandbox.io/s/01-3-ways-to-add-css-forked-9dwq5?file=/index.html

有人可以帮我理解为什么 CSS 在一个而不是另一个中起作用吗？

标签： codesandbox

Answer 1

我已经想通了。在“沙盒信息”部分，两个沙盒的“环境”不同。一个是“包裹”，一个是“create-react-app”。create-react-app 使用 webpack，并以不同于 parcel 的方式打包文件，这就是为什么 CSS 在一个而不是另一个中起作用的原因。在 create-react-app 版本中，它不知道捆绑 CSS。