Adding Tailwind CSS to Phoenix

Install postcss and tailwind

$ cd assets/ && npm install postcss-brunch tailwindcss --save-dev

Create tailwind config file

$ cd assets/ && ./node_modules/.bin/tailwind init

Configure tailwind as a processor in assets/brunch-config.js

plugins: {  
  babel: {
    // Do not use ES6 compiler in vendor code
    ignore: [/vendor/]
  },
  postcss: {
    processors: [
      require('tailwindcss')('./tailwind.js')
    ]
  }
},

Import tailwind css assets/css/app.css

@tailwind preflight;
@tailwind components;
@tailwind utilities;