webpack CLI

Summary

It's no surprise that getting webpack up and running is hard. Especially for beginners. The problem often starts due lack of understanding either JS or too much configuration needed. A CLI for webpack could be a preventive action to include the ability to quickstart and to get a boilerplate up and running.

Implementation

Acorn / AST parsers

Been discussing this with @TheLarkInn previously and the suggestion that got brought up is to make use of AST parsing. Acorn is a good starting point. Check out ESprima too, for more ways to extend Acorn.

As mentioned, Acorn allows webpack configurations to be fine-grained and fully customizable. This is a powerful way to make sure we do not hazzle with Readline or streams in Node every time we need to make or transform webpack configurations. From Mink I've learnt that if you need to make a addition to a webpack configuration you are in deep trouble. Source Code is getting more messy as well as it doesn't work at all as expected output would be.

AST tools is therefore a big win. Dealing with direct analysis prevents development issues.

CLI Interface

There's a few choices out there. Blessed and Inquirer are the most proficient ones. I would suggest Inquirer. Blessed has an advanced and clutty interface and its not that pretty. Inquirer serves our need well.

NodeJS

This is rather obvious. NodeJS has built in support for terminal prompts, allowing us to create a custom interface with webpack goodies. Bad thing is that it takes time to do this compared against a direct usage of parity libraries.

Organizing, Discussion and Questions

This is definitely doable. However, webpack has a lot on their hands, it could take time, but if we as an open source community do this together (and right) we could come up with a great tool. If you have questions about the suggestion, post them. Discussion is free, keep it at a technical and relative level.

References

• Yeoman - Have a look at the interface and source code
• Webpack - Using this internally, could be a good coherent implementation
• ESlint - Uses espree to transform JS to AST
• Babylon - relatively similar implementation
• Escodegen - Generate code from AST?
• Uglify - JavaScript parser

From Gitter Discussion with Kevin Partington

Suggestion to features

• Transform a webpack configuration v.1.x to v.2.x
• Create boilerplate setup with customizable implementation
• Add loaders and similar "high-level" features such as entry points

Design Scheme

• Estree