Added loader chaining and resolveLoader examples. #1529
Conversation
There was a problem hiding this comment.
Thanks for your contribution @asulaiman! Please see my comments -- mostly regarding formatting -- so we can get this merged.
| @@ -1,5 +1,7 @@ | |||
| --- | |||
| title: How to write a loader? | |||
| contributors: | |||
There was a problem hiding this comment.
Minor nitpick: can you move the the contributors under sort? It's nice to see the sort order and title easily
| @@ -17,6 +19,28 @@ The loader is expected to give back one or two values. The first value is a resu | |||
|
|
|||
| In the complex case, when multiple loaders are chained, only the last loader gets the resource file and only the first loader is expected to give back one or two values (JavaScript and SourceMap). Values that any other loader give back are passed to the previous loader. | |||
|
|
|||
| In other words the loading order for chained loaders goes from right to left or bottom to top. | |||
There was a problem hiding this comment.
Drop the single line break between here and the next line, it won't change the display at all. Also, you may want to put "or bottom to top" in parentheses as it's essentially the same behavior. Or even better, maybe just rewrite as:
In other words, chained loaders are executed in reverse order -- either right to left or bottom to top depending on the format of your array.
| @@ -17,6 +19,28 @@ The loader is expected to give back one or two values. The first value is a resu | |||
|
|
|||
| In the complex case, when multiple loaders are chained, only the last loader gets the resource file and only the first loader is expected to give back one or two values (JavaScript and SourceMap). Values that any other loader give back are passed to the previous loader. | |||
|
|
|||
| In other words the loading order for chained loaders goes from right to left or bottom to top. | |||
| For example: lets say you have two loaders that go by the name of `fooLoader` and `barLoader`. You would like to execute `fooLoader` and then pass the result of the transformation from `fooLoader` finally to `barLoader`. | |||
There was a problem hiding this comment.
I think you can drop the "For example:" and just lead off with "Let's say".
There was a problem hiding this comment.
You should also probably use foo-loader / bar-loader vs. camel case seeing as that's how most loaders are packaged/named.
| use: [{ loader: 'barLoader' }, { loader: 'fooLoader' }] | ||
| ] | ||
| } | ||
| ``` |
There was a problem hiding this comment.
The formatting is off here -- it should be two spaces within markdown files. Can you double check to make sure your editor is listening to the .editorconfig file?
There was a problem hiding this comment.
Also, I think you're missing a closing bracket on the top-level rule. Here's a simplified version with improved formatting:
module: {
rules: [
{
test: /\.js/,
use: [
'bar-loader',
'foo-loader'
]
}
]
}|
|
||
| ``` javascript | ||
| resolveLoader: { | ||
| modules: ['node_modules', path_resolve(__dirname, 'loaders') |
There was a problem hiding this comment.
Should be indented two spaces (one tab if your editor is listening to the .editorconfig).
| modules: ['node_modules', path_resolve(__dirname, 'loaders') | ||
| } | ||
| ``` | ||
|
|
There was a problem hiding this comment.
Add another line break between sections.
|
@skipjack thanks for reviewing! Ive adjusted based on your comments, didnt realize that we were supposed to follow formatting conventions for JS in the docs as well. Maybe that should also be a part of the contributing doc. |
Add trailing bracket and update formatting in `resolveLoader` example.
There was a problem hiding this comment.
@asulaiman great thanks! Fixed one other configuration issue and now we should be good to go.
Sure, we can add that. Ideally it should just happen automatically via the |
|
|
|
@skipjack resolved some conflicts with master today. If alls good here, could we have this merged? |
|
@asulaiman yessir -- thanks for resolving the conflicts, made my life a little easier! |
Based on feedback from most users on the old docs (https://webpack.github.io/docs/how-to-write-a-loader.html), ive tried add some clarification over the usage of custom loaders.