Gulp-compo-autoprefixer NPM

gulp-compo-autoprefixer

Gulp plugin for using the Autoprefixer in CompoJS

Install

npm i gulp-compo-autoprefixer -D

Using

const compoAutoprefixer = require('gulp-compo-autoprefixer')

function components() {
  return gulp.src('src/components/**/*.htm')
    .pipe(compoAutoprefixer())
    .pipe(concat('components.htm'))
    .pipe(gulp.dest('dist'))
}

// or

function components() {
  return gulp.src('src/components/**/*.htm')
    .pipe(compoAutoprefixer({
      overrideBrowserslist: ['last 15 versions']
    }))
    .pipe(concat('components.htm'))
    .pipe(gulp.dest('dist'))
}

Example

source

<c-component1>
  <h1>${ message }</h1>

  <style>
    :host {
      display: flex;
    }
  </style>
    
  <script>
    this.message = 'Компонент 1'
  </script>
</c-component1>

output

<c-component1>
  <h1>${ message }</h1>

  <style>
    :host {
      display: -webkit-box;
      display: -webkit-flex;
      display: -ms-flexbox;
      display: flex;
    }
  </style>
    
  <script>
    this.message = 'Компонент 1'
  </script>
</c-component1>