有没有办法测试 PostCSS Autoprefixer 是否正常工作?专用于 Rails 6 [英] Is there a way to test if PostCSS Autoprefixer is working? Specifically for Rails 6
问题描述
我正在使用 Webpacker 编写 Rails 6 web 应用程序.我的理解是 Rails 6 中的自动前缀通过 PostCSS 和它的 autoprefixer 插件开箱即用.
I am writing a Rails 6 webapp using Webpacker. Its my understanding that auto-prefixing in Rails 6 works out of the box via PostCSS and its autoprefixer plugin.
但是我无法验证这个库是否实际上是我的 css 的前缀.
However I cannot verify if this library is in fact prefixing my css or not.
有没有办法确认标准的默认 Rails 6.0.0 应用程序是否开箱即用自动前缀?
Is there a way to confirm if a standard default Rails 6.0.0 app auto-prefixes out of the box?
我已经运行 yarn autoprefixer --info
来查看它适用的 css 规则和浏览器,以及它适用于我的浏览器 chrome 77
的 def.我尝试使用它列出的适用参数.然而,它仍然没有在开发或生产中显示任何带前缀的 css.
I have run yarn autoprefixer --info
to see the css rules and browsers it applies to and its def applying to my browser chrome 77
. And I tried using a parameter that it lists as applying to. It still however dosn't show any prefixed css in dev or production.
我不确定 postcss-preset-env
是如何工作的,所以我不确定 css 是否只在使用需要前缀的浏览器时才被添加前缀.
Im not sure how postcss-preset-env
works so i'm not sure if the css only gets prefixed when using a browser that needs the prefix.
我来自使用 autoprefixer-rails gem,它挂在链轮上,只是给所有东西加上前缀.
Im coming from using autoprefixer-rails gem that hooks into sprockets and just prefixes everything.
这是我的 .postcss.config.js
文件...
Here is my .postcss.config.js
file...
module.exports = {
plugins: [
require('postcss-import'),
require('postcss-flexbugs-fixes'),
require('postcss-preset-env')({
autoprefixer: {
flexbox: 'no-2009'
},
stage: 3
})
]
}
推荐答案
您可以通过运行来测试您编译的 CSS(包括 PostCSS 的输出)在生产环境中的样子
You can test what your compiled CSS (including PostCSS's output) would look like in production by running
$ RAILS_ENV=production bundle exec rails webpacker:compile
这篇关于有没有办法测试 PostCSS Autoprefixer 是否正常工作?专用于 Rails 6的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!