Middleman 4 tutorial w/ external pipeline?

Hi, coming from Rails I found Middleman very easy to use. Since version 4 this isn’t true anymore, once I’m ready to accept your decision to ditch the asset pipeline in favour of a wealth of external libs.

I failed to find any decent example of Middleman 4 along with the external pipeline plus the usual suspects like Bootstrap, Foundation or else. npm or yarn? Webpack 1 or 2? Hundreds of lines of JS webpack config just to achieve something that used to be a few Ruby statements before? About 200MB node_modules to begin with? This is bizarre.

I’d appreciate any working, minimal and documented example of how a project using Middleman 4 should be structured, given that it’s sane to assume people would like to use stuff like jQuery, bootstrap or Foundation. What’s my best bet to get started, without any further ado? What’s required, what’s optional?

Any help is greatly appreciated. Regards

Christian

Take a look at this Middleman template. It has a minimal webpack config that is used for js only. You’ll see how to use jQuery as well.

https://bitbucket.org/stoneward/middleman-template

Chris

Thanks Chris, much appreciated. Could you by any chance add an example of how a npm-based extension is added, along with its scss and JS files? Do I need to add every single npm module (eg Foundation for sites) to the Sass load path, or does it happen automatically? What about integrating the JS needed for -say- Foundation?

Sincerely

Christian