This is my first foray into Sage 10 but is postCSS always this slow in Mix? Does it need configuring?
I’m trying to get a Tailwind CSS workflow going and every change is taking 5-10 seconds to reload the new CSS.
This is my first foray into Sage 10 but is postCSS always this slow in Mix? Does it need configuring?
I’m trying to get a Tailwind CSS workflow going and every change is taking 5-10 seconds to reload the new CSS.
What’s your current mix config? I know Sage 9’s webpack config was abnormally snappy, but unfortunately it was not sustainable long-term. 5-10 does sound unusually long, though.
Can you try without scripts? The default scripts in Sage 10 is broken at the moment (namely the dynamic imports).
My PostCSS config:
module.exports = ({ file, options }) => {
return {
plugins: {
tailwindcss: `./tailwind.js`,
},
};
};
Laravel Mix
mix.postCss(src`styles/app.css`, 'styles').webpackConfig({
module: {
rules: [
{
test: /\.css/,
use: [{loader: "postcss-loader", options: {}}],
},
],
},
});
And yeah I had to remove the .extract()
from JS to get mix working at all.
mix.postCss('resources/assets/styles/app.css', 'styles', [
require('postcss-easy-import')(),
require('precss')(),
require('tailwindcss')('./tailwind.config.js'),
])
im using precss
and postcss-easy-import
but theres an example. you dont need a postcss config or webpack config rules.
otherwise, just empty out everything but your bootstrap and jquery imports in app.js
and add back .extract()
and get rolling.
Awesome. That’s loading a lot quicker.
This topic was automatically closed after 42 days. New replies are no longer allowed.