When comparing Webpack vs Yeoman, the Slant community recommends Webpack for most people. In the question“What are the best tools for front-end JavaScript development?” Webpack is ranked 3rd while Yeoman is ranked 6th. The most important reason people chose Webpack is:
Plugins and loaders are easy to write and allow you to control each step of the build, from loading and compiling CoffeeScript, LESS and JADE files to smart post processing and asset manifest building.
Ranked in these QuestionsQuestion Ranking
Pros
Pro Rich and flexible plugin infrastructure
Plugins and loaders are easy to write and allow you to control each step of the build, from loading and compiling CoffeeScript, LESS and JADE files to smart post processing and asset manifest building.
Pro Tap into npm's huge module ecosystem
Using Webpack opens you up to npm, that has over 80k modules of which a great amount work both client-side and server-side. And the list is growing rapidly.
Pro Can create a single bundle or multiple chunks loaded on demand, to reduce initial loading time
Webpack allows you to split your codebase into multiple chunks. Chunks are loaded on demand. This reduces the initial loading time.
Pro Supports source maps for easier debugging
Source maps allow for easier debugging, because they allow you to find the problems within the origin files instead of the output file.
Pro ES6 module support
Webpack supports ES6 modules and their import
and export
methods without having to compile them to CommonJS require
Pro Share the same modules client-side and server-side
Because Webpack allows you to use the same require() function as node.js, you can easily share modules between the client-side and server-side.
Pro Bundles CommonJs and AMD modules (even combined)
Webpack supports AMD and CommonJS module styles. It performs clever static analysis on the AST of your code. It even has an evaluation engine to evaluate simple expressions. This allows you to support most existing libraries.
Pro Mix ES6 AMD and CommonJS
Webpack supports using all three module types, even in the same file.
Pro Limit plugin integration issues
Pro Active community
Yeoman has an active community with new generators being created at a rapid pace. Because of the momentum behind the community, you can expect good support and adoption for new tools and frameworks promptly after they come out.
Pro Huge number of generators for scaffolding your project
Yeoman generators allow you to quickly set up a new project. Invoked with the scaffolding tool 'yo' they provide a boilerplate & tooling selection. There are over 1000 generators, including generators for ember, angular & backbone, to choose from, the majority of which are community maintained.
Pro Allows you to choose between different build systems
Yeoman supports both major build systems - Grunt and Gulp. These build systems will help you automate tasks such as minification & concatenation of files, running tests, deploying and live-updating your webpage among many others.
Pro Free and open source
Yeoman is free, open source and licensed under BSD.
Pro Support for the package manager of your choice
Yeoman supports both Bower and npm, and is flexible in regard to tools to allow it to work with a wider range of project requirements.
Pro Standardized workflow process
Yeoman wants webapp development to be more standardized under the "Yeoman workflow" banner. As such it encourages the use of a specific combination of tools - a scaffolding tool (yo), a build tool (grunt, gulp, etc) and a package manager (bower, npm).
Pro Generators can be composed with other generators
Yeoman's scaffolding system allows generators to rely on other generators allowing for better code reuse and standardization between generators that use a common sub-component.
Pro Cross-platform
As a command line tool it works on OS X, Linux & Windows.
Pro Works with the package manager directly
Yeoman doesn't just scaffold your project, but also helps you integrate with your package manager directly, so you can manage your entire project with it.
Pro Developers can create their own plugins
Developers can also create their own Yeoman generator which are practically plugins with which Yeoman works. Generators are basically Node.js modules and can be created just like any other Node module.
There is also a very detailed and useful guide on how to create a generator on the Yeoman official website.
Cons
Con Config file may be hard to understand
Due to a somewhat hard to grasp syntax, configuring Webpack may take some time.
Con Can not load files discovered during runtime
Con Combining Yeoman and backend frameworks can bring problems
Combining Yeoman and a backend framework such as Django, Rails or Laravel can create problem because the project structure of Yeoman may not be compatible with that of the backend project. It can be tuned to work but for small projects it can be relatively time consuming.