Blame view

postcss.config.js 2.12 KB
陈峰 authored
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70
'use strict';

/**
 * postcss plugins for both dev and pro
 */
// TODO 定义雪碧图规则按照url规则生成雪碧图
// const fs = require('fs');
// const path = require('path');
const autoprefixer = require('autoprefixer');

// const postSprites = require('postcss-sprites');
const postPxtorem = require('postcss-pxtorem');
const postUse = require('postcss-use');

// const spritescore = require('postcss-sprites/lib/core');
// const distDir = path.join(__dirname, './public/sprites');
// const cssDir = path.join(__dirname, './public/scss');
// const et = 'pro';

// let sprites = {
//     spritesmith: {
//         padding: 8
//     },
//     stylesheetPath: distDir,
//     spritePath: distDir,
//     filterBy(file) {
//         // 小于2k 合并雪碧图
//         if (fs.statSync(file.path).size < 5000) {
//             return Promise.resolve();
//         }
//         return Promise.reject();
//     },
//     groupBy(file) {
//         let group = path.relative(cssDir, file.styleFilePath).replace('.scss', '').replace('.vue', '');
//         const split = group.split('/').filter(g => g !== '.' && g !== '..');

//         return Promise.resolve(split.join('.'));
//     },
//     hooks: {
//         onUpdateRule: function(rule, comment, image) {
//             if (et === 'pro') {
//                 image.spriteUrl = '~sprites/' + image.spriteUrl + ('?t=' + new Date().getTime());
//             } else {
//                 image.spriteUrl = '~sprites/' + image.spriteUrl;
//             }
//             spritescore.updateRule(rule, comment, image);
//         }
//     }
// };

let plugins = [
    // postSprites(sprites),
    postPxtorem({
        rootValue: 40,
        unitPrecision: 5, // 保留5位小数字
        minPixelValue: 2, // 小于 2 时,不转换
        selectorBlackList: [], // 选择器黑名单,可以使用正则
        propWhiteList: [] // 属性名称为空,表示替换所有属性的值
    }),
    autoprefixer({
        remove: false
    }),
    postUse({
        modules: ['postcss-clearfix', 'postcss-crip', 'postcss-short', 'postcss-center', 'postcss-position']
    })
];

module.exports = {
    plugins
};