I rely on Pinegrow a fair bit for prototyping but work as part of a large dev team, and alot of the scss is predefined in the application, the current pinegrow scss compilining doesn’t work with the existing codebase, but pinegrow tries to compile anyway so always breaks. Can you guys please provide an external build flag for bootstrap as you have for tailwind, as its making life really difficult as I have to recompile the scss in vs code and refresh to see changes, then go back into pinegrow which then instantly breaks the css again
1 Like
You can certainly use an external build with any bundler of your choice like Webpack/Vite!
Though, when using an external build for your bootstrap SCSS, you won’t be able to use the design panel (afaik bootstrap doesn’t have a bootstrap.config.js like tailwind.config.js), and your SCSS files won’t be listed in the stylesheet manager anymore as it’s compiled externally, and hence any Pinegrow way of customizing SCSS won’t apply anymore.
But, if your usage primarily involves using Pinegrow visual features to design your page, props panel for all bootstrap classes & library panel for classes & components, then an external build is a nice combo where you have great flexibility to manage your assets the way you want and run through all optimisations to get a slimmer bundle.
Here is quick github template with Bootstrap 5 + Vite - GitHub - TechAkayy/pg-bootstrap5-vite-app. Bootstrap’s official docs has a nice guide on using Vite (and other bundlers), but note there is one minor difference in this template. We use Vite only as a bundler (lib mode) to watch-build and not it’s dev-server during development. Check it out, and share your feedback!
After github clone/fork, run these commands in your external terminal before opening src/index.html in Pinegrow
npm install
npm run watch
Disclaimer: It has been ages I have worked on bootstrap, so would appreciate other bootstrap pros in the community to correct me if I have missed anything 
1 Like