red-perfume / red-perfume-task-runner

Experimental CSS Atomizer
https://red-perfume.github.io
MIT License
26 stars 4 forks source link

Remove unused CSS #37

Open TheJaredWilcurt opened 3 years ago

TheJaredWilcurt commented 3 years ago

This would be a top level boolean option on a task { removeUnused: true }. It would also be accompanied by a top level array of selectors to whitelist that will be used by JavaScript { removalWhitelist: [ '.cow .moo', '.dog' ] }.

{
  removeUnused: true,
  removalWhitelist: [
    '.frog'
  ],
  styles: {
    data: `
      .cow {
        padding: 8px;
      }
      .frog {
        padding: 2px;
      }
      .bat {
        margin: 19px;
        background: #F00;
      }
    `,
    result: function (result, err) {
      // .rp__padding__--COLON8px { padding: 8px } .rp__padding__--COLON2px { padding: 2px }
      console.log(result);
    }
  },
  markup: [
    {
      data: '<div class="cow"></div>',
      result: function (result, err) {
        // '<div class="rp__padding__--COLON8px"></div>'
        console.log(result);
      }
    }
  ],
  scripts: {
    result: function (result, err) {
      // { '.cow': [ 'rp__padding__--COLON8px ], '.frog': [ 'rp__padding__--COLON2px' ] }
      console.log(result);
    }
  }
}
TheJaredWilcurt commented 2 years ago

Blocked by: