问题标签 [gulp-autoprefixer]

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.

0 投票
2 回答
2112 浏览

css - gulp-autoprefixer 中的级联选项

从 gulp-autoprefixer 插件添加 autoprfixing 任务时,我注意到

选项。这个选项对我来说并不清楚它在做什么。

在文档中,我读到:

cascade (boolean):如果 CSS 未压缩,Autoprefixer 是否应该使用 Visual Cascade。默认值:真

因此,我使用 cascade: false 和 cascade true 将我的 SASS 编译为 CSS,在这两种情况下我得到了相同的结果:我的 SASS:

使用以下代码编译为 CSS autoprefixer({ cascade: false })

使用以下代码编译为 CSS autoprefixer({ cascade: true })

所以我的最后一个问题是 - autoprefixer 的 cascade: false/true 选项负责什么?

非常感谢您的回答。

0 投票
3 回答
25530 浏览

metronic - 将 Autoprefixer 浏览器选项替换为 Browserslist

我正在使用 [Metronic v6.03]

我按照文档的快速入门教程进行操作。 https://keenthemes.com/metronic/?page=docs

如果我输入命令“gulp build”,我会收到一条消息:

“将 Autoprefixer 浏览器选项替换为 Browserslist 配置。在 package.json 或 .browserslistrc 文件中使用 browserslist 键。

使用浏览器选项会导致一些错误。Browserslist 配置可用于 Babel、Autoprefixer、postcss-normalize 和其他工具。

如果您确实需要使用选项,请将其重命名为 overrideBrowserslist。

了解更多信息: https ://github.com/browserslist/browserslist#readme https://twitter.com/browserslist ”</p>

主题无法正确编译。

NPM 版本:6.9.0

纱线版本:1.16.0

古尔布版

命令行:2.2.0

本地版本:4.0.2

我将 package.json 中的 browserlist 行更改为

“浏览器列表”:[

]

并尝试将行替换为:

“浏览器列表”:[

]

在 Linux 上,我添加了一个带有上述行的文件 .browserslistrc。

0 投票
0 回答
773 浏览

nuxt.js - 在 Nuxt 项目中使用 Autoprefixer (Grid)

我正在尝试在我的 Nuxt 项目中为网格启动 autoprefixer。但遗憾的是没有成功。

我创建了一个 .browserslistrc 并在那里输入“默认”。

nuxt.config.js:

我究竟做错了什么?


解决方案:

0 投票
0 回答
69 浏览

sass - Gulp SASS、Autoprefixer 和 Sourcemaps

我正在使用 _s(下划线)启动 WordPress 主题并尝试使用我自己的 gulp 脚本来执行以下操作:

  • 从 ./sass/ 编译 sass 文件(有许多 scss 文件都作为“导入”添加到 ./sass/style.scss 中)
  • 为我的 CSS 自动添加前缀
  • 创建源映射文件
  • compile/autoprefix/sourcemapped 文件应位于名为 style.css 和 style.css.map 的主题 (./) 的根目录中

我让它正常工作 - 它确实生成了我的 style.css 和 style.css.map - 但它只是不添加浏览器前缀。就像 autoprefixer 插件不工作一样。

如何让 autoprefixer 为我的 CSS 添加前缀?我通过添加 transition: all .5s, display: grid 对其进行了测试,并且它们没有前缀。

也没有错误,所以我很茫然。

这是我的 gulpfile.js

0 投票
0 回答
15 浏览

css - css 属性 - 显示:网格中断 gulp 生成的 .map 文件的跟踪字符串

我有一个可扩展的项目,用 gulp 编译我所有的自动化前端文件(css、js、scss)。

由于生成的 css.map,连接 .scss 文件并生成一个 .css 文件以跟踪其 .scss 文件中每个元素的属性的任务对我来说正常工作,直到我没有知道,在 css.map 文件中,从给定文件中,破坏了其余 .scss 文件的跟踪链。'

问题是有显示网格类,正是“grid-template-areas”,这会导致我的 css.map 文件在引入该类后立即中断。

我的项目的 css.map 跟踪示例,类为“grid-template-areas”:

sources ": [" variables / _tipografia.scss "," variables / _coockie.scss "," variables / _caracteristicas.scss "," style.css "](就在文件 _caracteristicas.scss 中我有这个类)

没有类“grid-template-areas”的我的项目的 css.map 抓取示例:

在网上转了一千次,我只找到了使用 autoprefixer gulp 的可能解决方案,但没有一个对我有用。

任何人都知道源映射不喜欢这样的基于网格的类并破坏跟踪链的问题是什么?

Éstas son misdependencias de mi gulpfile:

Y está es mi tarea de compilar mis archivos .scss:

非常感谢。

0 投票
0 回答
87 浏览

javascript - 使用 Babel 时的 Autoprefixer Browsers 警告

我有一个项目,它使用 Babel 来执行所有与浏览器列表相关的选项。我在构建时收到警告:

互联网上有很多这个问题的例子,但是,对我来说,我的 package.json 中没有“autoprefixer”、“browsers”或“browserslist”。Gatsby 默认使用 Babel,它使用

在它的 package.json 中,但我的项目在任何地方都没有。

我的 package.json 依赖项供参考:

和我的 package.json devDependencies: