Vue.js and Brunch: Webpack Alternative
vuejsdevelopers.com
Vue.js and Brunch: Webpack Alternative
1–10 of 113 posts
Re: Vue.js and Brunch: Webpack Alternative
#2Great ideas. It seems like this sort of 'sane defaults' functionality could easily be added to future versions of webpack, and that might really help with adoption... rather than this community endlessly switching tool chains.
Re: Vue.js and Brunch: Webpack Alternative
#3I loved Brunch back a few years ago. But I wasn't happy with how plugins worked, or their "all files get included in your bundle even if you never required them".
So I built my own build system on top of Gulp, and added a set of tasks using browserify for web apps (https://github.com/BraveNewWorldDev/parched-example-app). It's heavily "convention over configuration", like "npm install parched-babel" is all you need to get Babel integrated.
I'm still using it in production on websites, Cordova apps, and Electron apps, but I'd still recommend webpack nowadays since that's where the community is.
Re: Vue.js and Brunch: Webpack Alternative
#4Brunch has a good "vs Webpack" section in their docs: http://brunch.io/docs/why-brunch#brunch-vs-webpack
Some of the big table stakes features that Brunch is missing are code splitting and handling of binary assets (allowing things like image inlining). It also doesn't have true hot module reloading, which is a pretty useful dev feature.
Re: Vue.js and Brunch: Webpack Alternative
#5I looked into Vue + Webpack vs Vue + Brunch on my last project. I ended up with Brunch because the requirements are fairly basic and Brunch are easier to grok. Had the requirements be a little bit more complex, I could have easily gone for Webpack.
IMO, there are a few key things lacking with the Vue + Brunch combo:
- The `vue-brunch` plugin seems to be no longer in active development? (https://github.com/theocodes/vue-brunch)
- The `sass-loader` plugin allows me to use Sass dialect in SFC-style Vue (Single File Component). I'm using plain CSS with Vue + Brunch SFC as I cannot find a Brunch plugin offering similar functionality.
- There are some Brunch idiosyncracies. For one, the processing pipeline is executed as per `package.json` (dev)Dependencies ordering. I spent quite a bit of time before figuring this out.
Re: Vue.js and Brunch: Webpack Alternative
#6I really love using Laravel Mix [1], which is a wrapper around webpack. I know nothing about webpack, because mix makes it easy to just get going on my actual project instead of futzing about with configuration.
Edit: FYI, Laravel not required.
1. https://github.com/JeffreyWay/laravel-mix/tree/master/docs#r...
Re: Vue.js and Brunch: Webpack Alternative
#7not sure if i did something wrong, but i cloned the app and ran the build and there's over 7500 lines of boilerplate included before the 'main.js' import in public/app.js. what is going on?
Re: Vue.js and Brunch: Webpack Alternative
#8If you're looking for alternatives to Webpack, please also check out JSPM (a good short description might be "preprocessing system + package manager + systemjs"):
It takes a little more to get it to work with vue (the plugin that makes .vue files work is older and unsupported nowadays), but I use it just fine, with my template, styling and component files separated (I wrote a little thing: https://gitlab.com/mrman/systemjs-plugin-vue-template-compil...)
If you dislike how complex webpack is, you'll like JSPM -- here's the video that got me hooked (it's pretty old but still valid): https://www.youtube.com/watch?v=iukBMY4apvI
Re: Vue.js and Brunch: Webpack Alternative
#9Great ideas. It seems like this sort of 'sane defaults' functionality could easily be added to future versions of webpack, and that might really help with adoption... rather than this community endlessly switching tool chains.
I'm surprised we haven't seen config packages for webpack take off along the lines of the configs in the ESLint community. There's nothing stopping anyone from publishing an extensible base config.
Re: Vue.js and Brunch: Webpack Alternative
#10I've been writing a Brunch/Vue.js app for the last few months and, for a relative newcomer to JavaScript frameworks, Brunch was far easier to get up and running with than Webpack. I spent a couple of days failing to get things working the way I wanted with Webpack and after discovering Brunch I was productive within half an hour.
My `brunch-config.js` is about 30 lines long and everything works as I'd expect.