Gulp with WebPack. Which one should build my coffee / jade etc?

I have an existing project that is currently using gulp.

The key libraries / frameworks / languages โ€‹โ€‹are:

  • MongoDB - Mongoose
  • AngularJS - with ui-router, also using ngClassify
  • ExpressJS - with passport
  • NodeJS
  • Jade
  • CoffeeScript
  • Sass -.sass format
  • Jpg / png to

Everything is currently being viewed using a live reload using uglify and gzipped. My angular html view / directives are sent to the js file of the template cache file. Even images are reduced using an image min.

A single page app is very modular in design, there are multiple "pages" in the app, each page has a specific use (take a profile page for example) using ui-route to view views. Not all users will use every page. So I prefer to move to WebPack with every page being a module. The goal of this app is to be as reactive as possible. With potential soft load time when switching the page / module in which they are located.

My current project structure has a src and dist directory, each with a server and client folder. the list directory can of course be safely removed on every build. I currently don't have raw js files or raw html (other than gulpfile.js, which just require my gulpfile.coffee), everything gets preprocessed from gulp and here it is.

So here are my questions:

  • I'll replace most of my gulpfile with webpack and let webpack handle everything (what's the advantage of this). Or I create a mediation folder (gulp output), then run webpack in that folder (only dealing with minijs / css / html files). Basically, knowing what my libraries / frameworks are and my situation, how would you structure your build process?
  • Can you use the ngClassify app.coffee file as an entry point? Or it should be compiled first. (If you can, how?)
+3


source to share


1 answer


You can use Gulp to run a Webpack build and manage other tasks that might arise, however the idea behind Webpack is that this is your whole build, you no longer need Gulp tasks for "minify", "concatenate" and "imagemin" files and so on as Webpack does it all for you using Plugins and Loaders .

You will need to run Webpack in your project source, not an already running package created by your custom Gulp construct.



Angular questions I have no answer, I'm afraid :)

+2


source







All Articles