postcss-selector-replace

This is postcss plugin.

A new css function was added in Xamarin.Forms 3.
I immediately prepared a scss environment, but there was one problem.
It is Xamarin's own tag which is not based on the CSS specification.
In node-sass, scss not based on the specification is not built.
In order to solve this we decided to pipe css built from scss and then apply selector symbols based on our own rules.
This is the postcss plugin created for that.

Example

postcss.config.js

module.exports = {
  plugins: [
    require('postcss-selector-replace')({
      "before": ["[base]", "[test]"],
      "after": ["^", "~"]
    })
  ]
}

before.css

[base]contentpage {
    background-color: red;
}

after.css

^contentpage {
    background-color: red;
}