css - React.js + Webpack 无法识别@media 表达式

标签 css reactjs webpack sass webpack-style-loader

我目前在 React.js (15.6.1) 和 Webpack 1 上运行的网站上工作。我正在使用 SASS-compatible version流行的 Flexbox 网格。但是出于某种原因,它似乎不像通常那样编译@media 表达式。

在此示例中,@include viewport($key); 按预期工作,但它完全跳过了媒体查询。

@media screen and (min-width: 48em) {
    @include viewport($key);
}

出于某种原因,我没有收到任何错误。我试过使用 sass-loader以及fast-sass-loader但似乎都没有解决我的问题。

如果有任何有用的建议,我将不胜感激!

最佳答案

你可以使用 react-media npm

https://github.com/ReactTraining/react-media

关于css - React.js + Webpack 无法识别@media 表达式,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/44925973/

相关文章:

javascript - 动态填充两个对象之间的空间

CSS 行高指南

javascript - 有条件地渲染带有样式组件的组件

javascript - Webpack url-loader 中的某些图像出现 404s

reactjs - ReactJS-Webpack编译错误: Module build failed

javascript - 无法使用链接的本地 Node 模块构建项目

css - 如何在没有 float 的情况下制作具有流体中心的 3 列布局

javascript - 如何将一组可拖动对象限制为一个可放置对象,将另一组可拖动对象限制为第二个可放置对象

javascript - 如何在基于类的组件中设置 displayName?

reactjs - 带有 props.children 的 Typescript React 功能组件