You signed in with another tab or window. Reload to refresh your session.You signed out in another tab or window. Reload to refresh your session.You switched accounts on another tab or window. Reload to refresh your session.Dismiss alert
Copy file name to clipboardExpand all lines: src/content/api/loaders.mdx
+31Lines changed: 31 additions & 0 deletions
Display the source diff
Display the rich diff
Original file line number
Diff line number
Diff line change
@@ -15,6 +15,7 @@ contributors:
15
15
- chenxsan
16
16
- jamesgeorge007
17
17
- alexeyr
18
+
- raj-sapalya
18
19
---
19
20
20
21
A loader is a JavaScript module that exports a function. The [loader runner](https://github.com/webpack/loader-runner) calls this function and passes the result of the previous loader or the resource file into it. The `this` context of the function is filled-in by webpack and the [loader runner](https://github.com/webpack/loader-runner) with some useful methods that allow the loader (among other things) to change its invocation style to async, or get query parameters.
@@ -373,6 +374,36 @@ Extracts given loader options. Optionally, accepts JSON schema as an argument.
373
374
374
375
T> Since webpack 5, `this.getOptions` is available in loader context. It substitutes `getOptions` method from [loader-utils](https://github.com/webpack/loader-utils#getoptions).
375
376
377
+
You can pass a JSON Schema to validate loader options automatically.
378
+
If a user passes an invalid or unknown option, webpack throws a
379
+
descriptive error at build start rather than failing silently.
380
+
381
+
```js
382
+
constschema= {
383
+
type:"object",
384
+
properties: {
385
+
prefix: {
386
+
type:"string",
387
+
description:"String to prepend to each file.",
388
+
},
389
+
minify: {
390
+
type:"boolean",
391
+
description:"Whether to minify the output.",
392
+
},
393
+
},
394
+
additionalProperties:false,
395
+
};
396
+
397
+
exportdefaultfunction (source) {
398
+
constoptions=this.getOptions(schema);
399
+
constprefix=options.prefix??"";
400
+
return`${prefix}\n${source}`;
401
+
}
402
+
```
403
+
404
+
T> `additionalProperties:false` causes webpack to throw if the user
405
+
passes an unrecognized option, catching misconfiguration at build start.
0 commit comments