Thank webpack Team for the AMA 👏
What are the highlights of webpack 2?
- new features?
- breaking changes?
Why did you create webpack in the first place?
What what the main motivation when you started the project?
What is the best way to load essential modules first and fast, while lazy loading other modules in background?
What is the best way to specify that a loader should compile a dependency from npm and have that working with npm link? I see that there are some issues with path.join and path.resolve with the resolve and resolveLoader settings.
How do you compare Webpack with JSPM? Do you think they are different tools for different purposes?
Elimination of dead code has been the biggest pain for me when it comes to developing web apps. Are there any guidelines that should be followed to keep redundant code to a minimum? Also, is there any parallel to tree shaking for CSS?
How could we manage webpack projects depending on each other? (e.g. with different loader configurations) Will this improve in webpack 2?
What do you think about WebAssembly? Will it be challenging to the way we bundling our code?
How do you feel about HTTP/2.0? Considering things like: the bundling stuff isn't so "necessary", etc.
Because of the babel configuration Webpack 2 forbids the usage of
with. Unfortunately this doesn't work for underscore/lodash templates. Is there a solution to get around this issue?
Do you work full time on webpack? Have you considered getting a company sponsor webpack development?
What's the plan with concord, and how does it tie in with Webpack 2.0? I noticed there's a few recent references to it in enhanced-resolve.
This is a simplified scenario that I think other people can relate to, and has the following properties:
- 2 React projects with a shared components repo,
shared-repohas its own dependencies on modules exclusive to the other 2 projects.
- All React projects use ES6 and ES7 syntax. We use
- We run with code with
babel-nodethat programmatically start
It seems that the most effective way to have good development speed would be something like:
- The main repos and
shared-reposhould be compiled with babel, the others modules should just be imported without compiling.
- When code is ready to be released we can use tags for the
shared-repoand the main repo.
To me this scenario seems a simple one. If the assumption is that
node_modules are compiled to ES5, ideally I would have like to just say in one line "use babel-loader for
shared-repo but for no other dependencies".
When we were trying to implement this kind of workflow, it took a few days of trial and error. Most of the information we used to implement the solution was found in small parts of github issues. Our current webpack.config code for this setup takes up many lines, and even though it now works, we are unsure if it is overly-complicated or has undesired effects.
We think there are a number of sticking points. Firstly,
externals interact with each others in as pipeline that we could not find documented to any large degree. The documentation provided seems to take these settings one-by-one, and often does not include examples of more complicated setups.
Secondly, we found the documentation very unclear for https://webpack.github.io/docs/resolving.html and https://webpack.github.io/docs/library-and-externals.html From reading issues on github and other resources it seems like other users of webpack are also confused.
A few things we would love to have covered in more detail:
- How paths are resolved and in which order
- How to make simple import works without using relative syntax (
import mod from 'shared-repo'vs
import mod from '../../../../ shared-repo).
- How inclusions and exclusions work for loaders (for our project that means what files are being compiled by
babel-loaderand what is not )
- How does a
.babelrcfile in dependencies work when that dependency is being compiled by babel from another project (i.e. how can this file be ignored, for instance with with
- What needs to be an absolute paths and what need to be a relative path (aka
path.resolve) to make
npm linkwork with not only loaders, but also plugins.
First, I would like to understand what is the ideal solution for this scenario
Second, we think that the webpack community would benefit from a bit better documentation of the above list.
The child compilation is really hard to understand - could you please give a brief overview how you would implement it correctly?
I agree that Webpack is powerful, but what do you think Webpack is not good at doing by its design choices?
Is https://github.com/webpack/extract-text-webpack-plugin going to be improved? It seems pretty slow. We used that to compile
.sass files. We do not use CSS modules. Building styles was taking up to 40 seconds. We ended up moving
.sass compilation to
What is the recommended knowledge for one to be able to help with developing webpack?
Is webpack-bootstrap outdated? It seems like it cannot find webpack-bootstrap in the global namespace
What are some cool webpack features you love, but aren't being used by others actively?
Any cool webpack tricks that most beginner/intermediates tend to overlook?
Hope you don't mind me asking multiple questions :D
Juho : What's the story behind SurviveJS? How did you come up with this plan?
How does it feel to be the creator of a widely used open source project like webpack?
In terms of programming what else do you guys do apart from developing and maintaining webpack? How do you manage your time? What are your productivity hacks?
I had struggle using webpack with applications that are not SPA. The best example I can mention is github.com. It consists of many small SPAish applications. What strategy I have to follow to use webpack when developing these kind of applications? (multiple bundles?...)
This is the npm I was targeting Juho. https://www.npmjs.com/package/bootstrap-webpack
I use Figwheel a lot in my personal projects, it's like Webpack, but it appears that they have some difference. In Figwheel code is replaced directly and I don't have to handle the propagation. Amok is more like Figwheel and it just patches code at runtime. I mean it sounds they(Figwheel, Amok) are superior that we don't need to configure very much to make HMR work. Will Webpack update the HMR in the future?
What's your advice to someone that never contributed to webpack before start doing it right now? Maybe documentation etc?
As community members how can we help you guys keep contributing to webpack development? If you decide to start a kickstarter campaign, how soon will it be?