问题标签 [postcss-loader]

我正在尝试将 Postcss 插件与我的 Vuepress 自定义主题一起使用，但我无法让它工作。Vuepress 的文档非常模糊，任何来自 postcss-loader 的东西都可以工作。

有人可以告诉我如何使用它吗？

在将其加载到 css-loader 以使用 css-modules 之前，我正在使用 webpack 和 postcss-loader 来自动修复和缩小我的 CSS。我在缩小 CSS 时遇到了麻烦。通过 webpack 检查发出的 .js 文件显示 CSS 没有被 cssnano 缩小（因为我仍然可以看到空白字符）。我究竟做错了什么？

一些相关的配置文件：

webpack.config.js：

postcss.config.js：

包.json

提前致谢。

在 css-loader v0.28 中，我使用了 root 选项，但在 css-loader v1.0.0 中，该选项已被删除，我检查了更改日志（https://github.com/webpack-contrib/css-loader/blob/ master/CHANGELOG.md）并找到了这个：

删除 root 选项，使用 postcss-loader 和 postcss-url 插件

但我无法很好地集成 postcss-url。

例如，我之前的 css-loader 选项是：

所以当我写一些这样的css片段时：

css-loader 解析后会变成：

我喜欢以前的风格，但也许我们应该升级 css-loader，所以应该使用postcss-url。我不能很好地使用它，文档也不能给我更多信息，所以我来到这里希望有人能帮助我。

我应该使用什么 postcss-url 选项来获得正确答案？

我是 stackoverflow 的新手，想问你一个我在互联网上找不到的问题......我希望我在好网站上 :)

所以这是我的问题：我想将一些 css 文件从 node_modules 依赖项导入到反应应用程序中。我使用 webpack 进行开发，但出现了一个我不明白的错误，这在标题中。所以这是编译器的错误详细信息：

另外，在导航控制台中我得到了这个：

那是我的 scss 文件的内容无法加载 css 文件。应用程序.scss：

你也可以查看我的 webpack 配置文件：

我的代码有什么问题？

非常感谢你帮助我！如果我不是很清楚，请询问我任何其他信息

我正在尝试在 webpack 中启用 sourceMaps，但 sass-loader 和 postcss-loader 组合似乎存在问题。

启用 sass-loader 和 postcss-loader 后，我的控制台显示“无源”：

但是当我禁用 postcss-loader 时，sourceMap 工作正常并指向“排版”文件：

webpack.config.js

主文件

排版.scss

我的问题是更多的方法。我有一个只使用 css 的项目，带有 css 自定义属性。vars例如。这个项目是反应，启用了 css 模块。具有如下结构：

component -- folder1 ---- folder1.css -- folder2 ----folder2.css node_modules -- module1 ---- module1.css

在本地项目中，我有 webpack，带有 postcss 加载器和以下插件：

在本地component和node_modules *.css文件中都有:root定义。为哪些变量设置。

例如，我有一个颜色文件，其中定义了所有颜色变量。

我的目标是在开发和生产中，我都var()输出了 IE 11 的值。所以让我们说颜色是var(--color-black)它会输出color: #000& color: var(--color-black)。

发生的事情是我必须在每个模块中导入后备才能出现。这仅适用于组件下的本地 css 文件，而不适用于 node_modules。:root这也多次应用相同的值。

我正在寻找的是其他人可能已经使用最少数量的 postcss 配置来实现在 IE 11+ 中工作但仍然只允许编写未来 css 的东西。

任何帮助，将不胜感激。

我尝试过 ::placeholder 或 ::-webkit-input-placeholder 选择器来更改占位符的颜色。但我发现只有设置颜色失败，其他属性如 text-align 或 font-weight 效果很好。添加'！important'也不起作用。我使用过vue-loader && css-loader && autoprefixer。但它在codepen中运行良好，只需简单的输入和简单的css代码。这是我的 webpack 配置

@angular/cli@7+ 允许customWebpackConfig指定 a 来提供自定义的 webpack 配置，例如：

然后，该文件在技术上允许您预先添加、附加或替换 webpack 配置的任何部分。在升级到之前@angular@7.1.3，@angular/cli@7.1.3我们已经退出了 webpack 配置以进行一些添加。其中一个新增功能是postcss-momentum-scrollingpostcss-loader 插件，该插件自动启用 iOS 动量滚动在所有可滚动容器上。

我正在寻求支持，以了解如何生成必要的自定义 webpack 代码以通过@angular/cli@7+.

这是我在custom-webpack.config.js文件中尝试过的示例：

一旦我接触到 webpack 配置的 scss 块，它似乎会进行替换而不是合并或前置，从而破坏构建。

我想知道是否有人对如何查看@angular/cli生成的初始 webpack 配置是修改的起点以及预览/查看作为调试执行的代码的方法有指导或建议。

此外，类似定制的示例也会很棒。

谢谢！

我正在编写一个使用 PostCSS 的 CLI，即使我uncss在 plugins 数组中没有，我也会从uncss. 有没有办法让 PostCSS 打印出当前加载的插件？

这个问题与这个问题有关。

我正在尝试将postcss-loader插件与 webpack 一起使用，但我不明白如何使用它，在我的输出构建中我没有 css 文件和 js 文件，只有一个 js 文件，以及构建的 js 中的 css .

这是 my-container.js 文件：

这是 container.scss 文件：

index.js：

这是我的 webpack 配置文件：

我检查了 js 文件中的 css 并且没有任何供应商前缀，例如在我的 scss 代码display: flex;中必须生成一些前缀，任何人都可以告诉我如何设置它？