2

I am writing a postcss plugin intended to be used in a vue.js project. This plugin needs to run after vue-loader has processed the css and added any scoped id's to the selectors. Is there a way with vue.config.js, or some other way, to specify the order of postcss plugins?

Currently I have my plugin being included in postcss.config.js. I see that add-id for scoped styles is itself a postcss plugin defined here, but I'm not sure how it is actually used.

My postcss config and plugin files:

// postcss.config.js
module.exports = {
    plugins: [
        require('./postcss-mycustomplugin')()
    ]
};

// postcss-mycustomplugin.js
var postcss = require('postcss');

module.exports = postcss.plugin('mycustomplugin', function mycustomplugin(options) {
    return function (css) {
        // `css` still has not been processed by vue's postcss plugin
    }
});

To reiterate, I'd like my plugin to run on the css after scoped id's have been added.

ParkerD
  • 1,214
  • 11
  • 18

0 Answers0