I'm having trouble figuring out how to add npm packages which are not specifically built to be used with brunch to my elixir/phoenix project.
One thing I don't want to do is manually copy files from node_modules/
to vendor/
.
If anyone knows how to properly configure Brunch to use Tailwind in a Phoenix app, any help would be greatly appreciated.
Include postcss-brunch and tailwindcss packages
$ npm install postcss-brunch tailwindcss --save-dev
Create Tailwind config file (in assets directory)
$ ./node_modules/.bin/tailwindcss init
Add Tailwind as postcss plugin (assets/brunch-config.js)
// Configure your plugins
plugins: {
babel: {
// Do not use ES6 compiler in vendor code
ignore: [/vendor/]
},
postcss: {
processors: [
require('tailwindcss')('./tailwind.js')
]
}
},
Use Tailwind in css (assets/css/app.css)
@tailwind preflight;
@tailwind utilities;