weixin / posthtml-px2rem

Change px to rem in HTML inline CSS based on PostHTML
https://www.npmjs.com/package/posthtml-px2rem
46 stars 7 forks source link

Look at posthtml-postcss + postcss plugins :) #3

Open voischev opened 8 years ago

voischev commented 8 years ago

https://github.com/posthtml/posthtml-postcss https://github.com/cuth/postcss-pxtorem

hzlzh commented 8 years ago

We are using https://github.com/cuth/postcss-pxtorem in our gulp workflow now, so I made this posthtml-px2rem for HTML output use.

voischev commented 8 years ago
gulp.task('html', function() {
    var posthtml = require('gulp-posthtml');
    return gulp.src('src/**/*.html')
        .pipe(posthtml([ require('posthtml-postcss')([
            require('postcss-pxtorem')
            /* other postcss plugins */
        ]/*, postcssOptionsObj */) ]))
        .pipe(gulp.dest('build/'));
});

should make equal result for HTML

chenkun24 commented 7 years ago

posthtml-px2rem has some issues rather than postcss-pxtorem, for example, media query option. So if there are some css styles in html (not inline-style), it seems better to use posthtml-postcss+postcss-pxtorem instead. If there are only inline-styles in HTML, posthtml-px2rem can handle.