Skip to content

Commit 6fa672d

Browse files
committed
feat: add context loader option
1 parent 7ef5ed1 commit 6fa672d

21 files changed

Lines changed: 1955 additions & 3982 deletions

File tree

CHANGELOG.md

Lines changed: 12 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,17 @@
11
# Change log
22

3+
## 4.4.0 (2024-11-04)
4+
5+
- feat: add `context` loader option to resolve assets w/o leading `/` in a directory outer your project:
6+
```js
7+
new HtmlBundlerPlugin({
8+
loaderOptions: {
9+
context: path.resolve(__dirname, '../other/'),
10+
},
11+
}),
12+
```
13+
- docs: update readme
14+
315
## 4.3.0 (2024-11-04)
416

517
- feat: add preprocessor for [Tempura](https://github.com/lukeed/tempura) template engine.

README.md

Lines changed: 52 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -490,7 +490,8 @@ See [boilerplate](https://github.com/webdiscus/webpack-html-scss-boilerplate)
490490
<a id="toc-loader-options" name="toc-loader-options"></a>
491491
1. [Loader options](#loader-options)
492492
- [sources](#loader-option-sources) (processing of custom tag attributes)
493-
- [root](#loader-option-root) (allow to resolve root path in attributes)
493+
- [root](#loader-option-root) (allow to resolve a path with leading `/`)
494+
- [context](#loader-option-context) (allow to resolve a path w/o leading `/`)
494495
- [beforePreprocessor](#loader-option-before-preprocessor) (callback)
495496
- [preprocessor](#loader-option-preprocessor) (callback or string) and [preprocessorOptions](#loader-option-preprocessorOptions) (templating)
496497
- [eta](#loader-option-preprocessor-options-eta)
@@ -3108,7 +3109,7 @@ Type: `string|boolean` Default: `false`
31083109
31093110
The `root` option allow to resolve an asset file with leading `/` root path.
31103111
3111-
Defaults is disabled because the file with leading `/` is a valide URL in the public path, e.g. `dist/`.
3112+
Defaults is disabled because the file with leading `/` is a valid URL in the public path, e.g. `dist/`.
31123113
The files with leading `/` are not processed.
31133114
31143115
Define the `root` option as the absolute path to the source directory to enable the processing.
@@ -3152,6 +3153,55 @@ Now you can use the `/` root path for the source assets:
31523153
31533154
#### [↑ back to contents](#contents)
31543155
3156+
<a id="loader-option-context" name="loader-option-context"></a>
3157+
3158+
### `context`
3159+
3160+
Type: `string` Default: `undefined`
3161+
3162+
The `context` option allow to resolve an asset file without leading `/` path.
3163+
3164+
For example, there are project files:
3165+
3166+
```
3167+
project/src/views/index.html
3168+
project/src/styles/style.scss
3169+
project/src/images/logo.png
3170+
otherDir/stock-photos/cologne.png // <= file outer your project directory
3171+
```
3172+
3173+
You can use the [root](loader-option-root) option to use assets in your project directory
3174+
and define the `context` option to use assets outer your project directory:
3175+
3176+
```js
3177+
new HtmlBundlerPlugin({
3178+
entry: {
3179+
index: 'src/views/index.html',
3180+
},
3181+
loaderOptions: {
3182+
root: path.resolve(__dirname, 'src'),
3183+
context: path.resolve(__dirname, '../otherDir'),
3184+
},
3185+
});
3186+
```
3187+
3188+
Now you can use the leading `/` for the assets in your project and w/o `/` for assets from outer directory:
3189+
3190+
```html
3191+
<html>
3192+
<head>
3193+
<link href="/styles/style.scss" rel="stylesheet" />
3194+
</head>
3195+
<body>
3196+
<h1>Hello World!</h1>
3197+
<img src="/images/logo.png" />
3198+
<img src="stock-photos/cologne.png" />
3199+
</body>
3200+
</html>
3201+
```
3202+
3203+
#### [↑ back to contents](#contents)
3204+
31553205
<a id="loader-option-before-preprocessor" name="loader-option-before-preprocessor"></a>
31563206
31573207
### `beforePreprocessor`

0 commit comments

Comments
 (0)