问题标签 [postcss]

我有一些通用的、可重用的样式表来构建，它与单个 JavaScript 文件无关。Webpack 是否可以直接处理 PostCSS 文件？如：

我现在只是使用precss插件，但我想像这样计算 PostCSS 中的变量

+postCSS 中有计算插件吗？

我也试过calc($sidebar-width + $container-padding-left);，但它不起作用。

我查找了https://github.com/postcss/postcss/blob/master/docs/plugins.md 但我找不到我想要的。

我在将 Webpack 与 postcss-loader 结合起来观看导入的 css 文件时遇到了一些麻烦。它们在第一次运行时被处理，但是当我修改这些文件时 webpack 不会重新编译。

例如

我有我的主要 css 文件，我在其中导入所有 css 模块：

在基本导入中，为了举例，我将颜色应用于身体：

我现在将背景设置为另一种颜色，以调试是否重新加载 css 文件，但不是。

这是我的 webpack 配置：

我正在尝试将 grunt-postcss 与 autoprefixer 一起使用，但 css 没有得到前缀。Autoprefixer 创建新文件，但不添加前缀。没有错误。

这是我的 gruntfile：

怎么了？

我对运行 autoprefixer 的 postcss 感到不满，并且代码：

...正在输出：

但它不应该输出这个吗？

我的 postcss 设置是：

我不知道我是否做错了什么，是否输出不正确，或者它实际上是否正确。

谢谢

这是我第一次尝试设置 Webpack，所以我确定我在这里遗漏了一些东西。

我正在尝试使用 Webpack 加载我的 PostCSS 文件，使用 ExtractTextPlugin 将 css 文件生成到“dist”中。问题是 Webpack 似乎没有拾取 css 文件。它们位于“客户端/样式”下，但我尝试将它们移至“共享”，结果相同。

我使用 --display-modules 选项运行 Webpack，并验证那里没有显示任何 css 文件。

我试过在没有提取文本插件的情况下运行它，结果是一样的：bundle.js 中没有内置 CSS。

这是我的产品配置：

这是我的主要 css 文件的一个示例：@import 'normalize.css/normalize';

有人知道为什么会这样吗？我错过了什么吗？

谢谢

我希望我的源映射是一个子目录，相对于 CSS 目录，例如

使用我的 base.css 的源地图注释

在谷歌阅读文档我得到的印象是源映射只需要一个相对路径（我假设相对于 CSS 目录），但是似乎没有浏览器能够读取这个 URL，我做错了什么？

我正在使用 PostCSS 顺便说一句，我的代码是：

内置的 CSS Modules 支持webpack看起来很简单：你只需在require/ importCSS 文件和 webpack 生成代码，它会做两件事：

• 将生成的 CSS 注入您的网页
• 返回您要使用的类名字典。

用法也很简单：

我想测试替代 CSS Modules 实现，一个PostCSS插件 - 因为它似乎与其他PostCSS插件配合得很好，尤其是autoprefixer. 但根据官方文档，与CSS 模块postcss-modules相比，它的工作方式似乎非常不同。webpack文档中没有使用示例，只有一些生成的回调代码JSON。任何示例如何在实践中使用它来实现与上面的示例代码相同的目标？

当前使用 webpack 并加载 open sans 不起作用。一切都需要一个 .css 文件才能工作吗？

网络包配置

我有一个项目，其中包含一组 css 文件（每个反应组件一个）。我在 webpack 和 postcss-cssnext 中使用 css-loader（带有模块）。

理想情况下，我想要一个variables.css，这样我就可以在 css 文件中共享变量。我尝试过variables.css包含以下内容：

然后我将其导入，以便通过 css 加载程序。问题是，其他文件不接受这些变量，所以要么这不起作用，要么我做错了什么（包括在组件 css 文件中直接起作用）。

一个有效的方法是拥有一个styles.json具有以下 webpack 设置的文件：

主要问题是每次更改变量时都必须重新启动 webpack 开发服务器（因此重新加载 webpack 配置）。这并不理想。

那么，有什么更好的方法来做到这一点吗？