iT邦幫忙

0

關於 gulp autoprefixer 無法加grid的前綴

package.json裡面設定

  "browserslist": [
    "last 4 version",
    "ie 6-8",
    "Firefox > 20"],

autoprefixer 有運作
原始CSS

    display: flex;

會輸出

  display: -webkit-box;
  display: -moz-box;
  display: -ms-flexbox;
  display: flex;

可是 輸出 grid 時就會沒反應

//原始
.code{
   display: grid;
}

//輸出
.code {
  display: grid;
}

依賴版本
"autoprefixer": "^9.7.4",
"gulp-postcss": "^8.0.0",
"gulp": "^4.0.2",

請問有沒有大大也有遇到這問題
是版本問題還是設定的問題...

補gulpfile.js

'use strict';
const gulp = require('gulp');
const sass = require('gulp-sass');
const postcss = require('gulp-postcss');
const plumber = require('gulp-plumber');
const autoprefixer = require('autoprefixer');
const purgecss = require('gulp-purgecss');

gulp.task('sass', function () {

    return gulp.src('src/css/**/*.scss')
      .pipe(plumber())
      .pipe(sass().on('error', sass.logError))
      .pipe(postcss([
          require('tailwindcss'),
          autoprefixer(),
        ])) 
      .pipe(gulp.dest('./public/css'));
  });

  gulp.task('watch', function () {
    gulp.watch('src/css/**/*.scss', gulp.series('sass'));
  });

  gulp.task('default',gulp.parallel('sass','watch'));
fillano iT邦超人 1 級 ‧ 2020-03-18 18:02:09 檢舉
你怎麼不貼gulefile.js?
咖咖拉 iT邦新手 1 級 ‧ 2020-03-19 10:51:40 檢舉
@fillano 大大
以補上~

1 個回答

1
fillano
iT邦超人 1 級 ‧ 2020-03-20 09:51:48
最佳解答

參考: https://github.com/postcss/autoprefixer#does-autoprefixer-polyfill-grid-layout-for-ie

預設是關掉的,所以你要在gulpfile.js裡面加上設定:autoprefixer({grid:"autoreplace"})

咖咖拉 iT邦新手 1 級 ‧ 2020-03-20 10:41:47 檢舉

可以了~~謝謝大大

我要發表回答

立即登入回答