问题标签 [postcss]
For questions regarding programming in ECMAScript (JavaScript/JS) and its various dialects/implementations (excluding ActionScript). Note JavaScript is NOT the same as Java! Please include all relevant tags on your question; e.g., [node.js], [jquery], [json], [reactjs], [angular], [ember.js], [vue.js], [typescript], [svelte], etc.
javascript - 需要 gulpfile 中的另一个文件(不在 node_modules 中)
我已经使用 gulp 一段时间了,并且知道如何导入另一个节点模块,例如
没关系,但是我的 gulpfile 充满了我想移入单独文件并“要求”的代码。具体来说,我正在编写一个 postcss 插件,当在 gulpfile 中声明为函数时,我已经可以使用它了。我的问题是如何将我的函数放在一个外部文件中并像我做一个节点模块一样需要它。我是否需要“导出”所需文件中的功能?我需要使用 ES6 模块或类似的东西吗?
顺便说一句,我意识到如果我这样做,我可能会(A)把它变成一个适当的节点模块并将它放在一个私有 NPM 存储库中,但这似乎没有必要,或者(B)把它变成一个适当的 gulp插件,但这需要学习如何编写 gulp 插件并学习流和东西。这两个可能都更好,但需要更多时间,所以我决定暂时保持函数简单和本地化。
webpack - 使用 webpack css 模块进行容器查询
我正在尝试在 webpack 项目中使用 css 容器查询和 css 模块。这个配置看起来像这样:
和这样的 postcss 配置:
我希望能够让这个类工作:
并且能够将“卡片列表”导入我的组件。
但是,这似乎不起作用。我一直无法在网上找到有关此类问题的任何信息。
css - 同步使用自动前缀
我想在我的节点应用程序中使用 autoprefixer 来编译 css。对于我的特定需求,我想在没有回调或承诺的情况下调用 autoprefixer。
很简单:
或者
我正在为此奋斗一段时间,请您帮帮我。
谢谢你
ps:我已经尝试过 postcss-js,但它产生了一个 json 对象供反应使用,而不是纯 css。例如 {borderRadius:"5px"}
postcss - 如何将选择器添加到现有规则?
有没有办法使用 Postcss API 将选择器添加到现有规则?像myRule.addSelector(".newSelector")
什么?
目前我必须这样做:
css - 如何在 sass-loader 和 ExtractTextPlugin 完成后运行 POSTCSS?
我试图弄清楚如何在我的最终输出 css 文件上运行 postcss。
我当前的配置在编译所有依赖的 SASS 并采用静态 CSS 导入并使用 ExtractTextPlugin 提取它们时效果很好。
看来我可以在 CSS 块上运行 POSTCSS 优化,但不能在最终产品上运行。这意味着我无法摆脱重复的 CSS 规则。
在 sass-loader 和 extractTextPlugin 发挥作用之后,如何在最终状态的 CSS 文件上运行 POSTCSS?
postcss - How to specify a format or pattern for SCSS variable names using stylelint?
I use postcss-scss with stylelint on my .scss files and I'm trying to figure out how to enforce a rule so that all my variables follow the same naming convention throughout my project.
Is there a way to specify a format or pattern (i.e. a regex) for variable names? I am aware of https://github.com/davidtheclark/stylelint-selector-bem-pattern for selectors but I could not find anything about variable names.
I'm thinking something along the lines of https://github.com/sasstools/sass-lint/pull/257 but that would be compatible with stylelint rules.
For example I may want my variable names to always be camelCase, in which case:
webpack - 与 webpack 一起使用时的 PostCSS 插件顺序
我想使用以下 postCSS 插件:
- postcssimport ( https://github.com/postcss/postcss-import )
- postcssnested ( https://github.com/postcss/postcss-nested )
- postcsssimplevars ( https://github.com/postcss/postcss-simple-vars )
- postcssmixins ( https://github.com/postcss/postcss-mixins )
- 自动前缀(https://github.com/postcss/autoprefixer)
- 丢失(https://github.com/peterramsing/lost)
- postcssflexibility ( https://github.com/7rulnik/postcss-flexibility )
但我不确定我应该把它们放在里面的顺序
有什么帮助吗?
gruntjs - 如何在多个文件上使用带有 postcss 和 Grunt 的 autoprefixer?
标题说明了一切。我的 postcss 任务如下:
目前我有另一个名为 style-human 的 css 文件,我也想为其添加前缀。但是,该任务仅在 style.css 文件(缩小版本)之前添加。
webpack - 如何使用 lost、autoprefixer 和 postcss-flexibility?
我想知道我们应该使用autoprefixer
, lost
, postcssflexibility
in的顺序webpack
?