5 ms·

I'm kind of surprised how cold reactions are against Webpack here on HN. I consider Webpack by far the best module bundler. My path was: scripts, stealjs, requi

I'm kind of surprised how cold reactions are against Webpack here on HN. I consider Webpack by far the best module bundler. My path was: scripts, stealjs, requirejs, requirejs + grunt and also recently tried SystemJS. All of them are pretty awful. Try one of those and you'll realize how amazing Webpack is. For example one of the newer bundler - SystemJS pretty much force you to use jspm package manager. Jspm changes SystemJS configuration on every new package installation, so you can be never sure, if build is failing because jspm changed something. You can forget on imports without providing correct extensions (js,jsx,...), or prepare to fill you config will lot of defaultJSExtensions/file mapping. Also import Module from './module where module is folder with index.js file doesn't work out of the box and mapping has to be added. etc... The only thing I'm personally missing in webpack, is option to provide custom chunk loader, so I can load chunks with any other AMD loader, something similar to requirejs+almodjs or SystemJS static SFX builds, which was the reason I've tried SystemJS at first place, but it wasn't worth the pain.

beefsack 9y ago
I use Webpack in a couple of projects, but it only seems to fit well for single page applications that fit their near-standard configurations. We tried to replace Gulp with it at work for some relatively complex software but it was an absolute nightmare; Webpack is highly opinionated and to get it to build multiple different targets with different configurations requires jumping through a lot of hoops or worse, having to have separate Webpack configs and different build commands for each different asset target. The last straw for us was how messy it got trying to build our LESS at the same time. Packaging all the LESS into your compiled JS, then having to extract it to put it in other files is absolutely ridiculous.
- finchisko 9y ago
  That is something I forgot to mention. Webpack is great for SPAs and not so great for classic site with lot of html files. You can have multiple entries (html files), but share common chunks between them might be difficult in some special cases.
  - cytzol 9y ago
    > You can have multiple entries (html files), but share common chunks between them might be difficult in some special cases. This is what I'm trying to do at the moment -- create a static site that's just a bunch of HTML files, while still taking advantage of Sass, CSS modules, and Vue.js components. (God, I love scoped CSS so much.) I'm sure there's a way to get Webpack to do what I want, but I haven't found it yet. prerender-spa-plugin has been a huge help, though. It seems very similar to when I was learning Git: I know what I want to do, but Git's interface uses a level one layer lower than the one I'm operating on. "Undo the last commit", not "Reset the working tree to the previous commit's, but leave the staging area intact". Webpack's interface seems too abstract for what I want. I want to think in terms of individual pages, not of entry points; components, rather than chunks. Hopefully in five years when flat HTML files are vogue again there'll be a friendlier interface on top of it all. Edit: I don't mean to be 100% negative in my comment! Webpack has certainly helped me solve problems that, previously, I haven't been able to solve. That alone is great. I just wish it'll go "click" so I can "get" it.
    - finchisko 9y ago
      If I understand you correctly. You basically want to create completely static website with no javascript (or very little). Something like server side rendering, but without server (or to be precise with only http server) :-). And you've already found webpack module for the job.
      - cytzol 9y ago
        Yeah, you got it. I have a webpack.config.js that compiles everything, bundles it together, and spits out a bunch of HTML files. But what I don't have is the confidence that I'm doing things the right way and not using Webpack inappropriately!
      - douche 9y ago
        Sounds like a plain-old ASP.NET site with Razor partials.
    - 9y ago
tjpnz 9y ago
I'm sure it's ok when utilised by skilled hands. But unlike a lot of tools it's just too easy to get things wrong. Possibly by a lack of good documentation or design. I'm still feeling bitter after seeing it introduced on my last project, a Rails app. Build times went from seconds to 15 minutes. After experiencing that I will make every effort to argue against it's inclusion on my current project (should anyone propose it).
yunyu 9y ago
Have you tried rollup? Webpack's tree shaking is broken and doesn't work properly with libraries structured like d3, while rollup's works properly. I've managed to get trivial 150kb minified size reductions by switching.
- Ralfp 9y ago
  But isn't Rollup.js directed at libraries whereas Webpack aims for JS apps?
  - moron4hire 9y ago
    I use Rollup for both, though I don't remember exactly how, as I made a project out of my build setup: https://capnmidnight.github.io/marigold-build https://capnmidnight.github.io/marigold-build
- finchisko 9y ago
  Rollup looks nice too. As far I understand rollup, it's generating more human readable and shorter bundles, so it's more suitable for libraries. I didn't tried it yet, but I feel somehow that if I do, I will find bad parts there too. Like limited (comparing to webpack) module format support...
  - yunyu 9y ago
    Yeah, it's pretty common (for the tree shaking case) to make a custom d3/whatever library bundle with Rollup and use it with Webpack for your app, but it's a formidable alternative to Webpack regardless.

beefsack 9y ago

I use Webpack in a couple of projects, but it only seems to fit well for single page applications that fit their near-standard configurations. We tried to replace Gulp with it at work for some relatively complex software but it was an absolute nightmare; Webpack is highly opinionated and to get it to build multiple different targets with different configurations requires jumping through a lot of hoops or worse, having to have separate Webpack configs and different build commands for each different asset target. The last straw for us was how messy it got trying to build our LESS at the same time. Packaging all the LESS into your compiled JS, then having to extract it to put it in other files is absolutely ridiculous.

finchisko 9y ago
That is something I forgot to mention. Webpack is great for SPAs and not so great for classic site with lot of html files. You can have multiple entries (html files), but share common chunks between them might be difficult in some special cases.
- cytzol 9y ago
  > You can have multiple entries (html files), but share common chunks between them might be difficult in some special cases. This is what I'm trying to do at the moment -- create a static site that's just a bunch of HTML files, while still taking advantage of Sass, CSS modules, and Vue.js components. (God, I love scoped CSS so much.) I'm sure there's a way to get Webpack to do what I want, but I haven't found it yet. prerender-spa-plugin has been a huge help, though. It seems very similar to when I was learning Git: I know what I want to do, but Git's interface uses a level one layer lower than the one I'm operating on. "Undo the last commit", not "Reset the working tree to the previous commit's, but leave the staging area intact". Webpack's interface seems too abstract for what I want. I want to think in terms of individual pages, not of entry points; components, rather than chunks. Hopefully in five years when flat HTML files are vogue again there'll be a friendlier interface on top of it all. Edit: I don't mean to be 100% negative in my comment! Webpack has certainly helped me solve problems that, previously, I haven't been able to solve. That alone is great. I just wish it'll go "click" so I can "get" it.
  - finchisko 9y ago
    If I understand you correctly. You basically want to create completely static website with no javascript (or very little). Something like server side rendering, but without server (or to be precise with only http server) :-). And you've already found webpack module for the job.
    - cytzol 9y ago
      Yeah, you got it. I have a webpack.config.js that compiles everything, bundles it together, and spits out a bunch of HTML files. But what I don't have is the confidence that I'm doing things the right way and not using Webpack inappropriately!
    - douche 9y ago
      Sounds like a plain-old ASP.NET site with Razor partials.
  - 9y ago

tjpnz 9y ago

I'm sure it's ok when utilised by skilled hands. But unlike a lot of tools it's just too easy to get things wrong. Possibly by a lack of good documentation or design. I'm still feeling bitter after seeing it introduced on my last project, a Rails app. Build times went from seconds to 15 minutes. After experiencing that I will make every effort to argue against it's inclusion on my current project (should anyone propose it).

yunyu 9y ago

Have you tried rollup? Webpack's tree shaking is broken and doesn't work properly with libraries structured like d3, while rollup's works properly. I've managed to get trivial 150kb minified size reductions by switching.

Ralfp 9y ago
But isn't Rollup.js directed at libraries whereas Webpack aims for JS apps?
- moron4hire 9y ago
  I use Rollup for both, though I don't remember exactly how, as I made a project out of my build setup: https://capnmidnight.github.io/marigold-build https://capnmidnight.github.io/marigold-build
finchisko 9y ago
Rollup looks nice too. As far I understand rollup, it's generating more human readable and shorter bundles, so it's more suitable for libraries. I didn't tried it yet, but I feel somehow that if I do, I will find bad parts there too. Like limited (comparing to webpack) module format support...
- yunyu 9y ago
  Yeah, it's pretty common (for the tree shaking case) to make a custom d3/whatever library bundle with Rollup and use it with Webpack for your app, but it's a formidable alternative to Webpack regardless.