Skip to content

Navigation Menu

Search code, repositories, users, issues, pull requests...

Provide feedback

We read every piece of feedback, and take your input very seriously.

Saved searches

Use saved searches to filter your results more quickly

Appearance settings

Commit cd0e428

Browse filesBrowse files
feat: the resourceQuery is passed to the interpolateName method (#163)
1 parent 06d36cf commit cd0e428
Copy full SHA for cd0e428

File tree

3 files changed

+76
-12
lines changed
Filter options

3 files changed

+76
-12
lines changed

‎README.md

Copy file name to clipboardExpand all lines: README.md
+25-11
Original file line numberDiff line numberDiff line change
@@ -197,52 +197,66 @@ In loader context `[hash]` and `[contenthash]` are the same, but we recommend us
197197
Examples
198198

199199
``` javascript
200-
// loaderContext.resourcePath = "/app/js/javascript.js"
200+
// loaderContext.resourcePath = "/absolute/path/to/app/js/javascript.js"
201201
loaderUtils.interpolateName(loaderContext, "js/[hash].script.[ext]", { content: ... });
202202
// => js/9473fdd0d880a43c21b7778d34872157.script.js
203203

204-
// loaderContext.resourcePath = "/app/js/javascript.js"
204+
// loaderContext.resourcePath = "/absolute/path/to/app/js/javascript.js"
205205
// loaderContext.resourceQuery = "?foo=bar"
206206
loaderUtils.interpolateName(loaderContext, "js/[hash].script.[ext][query]", { content: ... });
207207
// => js/9473fdd0d880a43c21b7778d34872157.script.js?foo=bar
208208

209-
// loaderContext.resourcePath = "/app/js/javascript.js"
209+
// loaderContext.resourcePath = "/absolute/path/to/app/js/javascript.js"
210210
loaderUtils.interpolateName(loaderContext, "js/[contenthash].script.[ext]", { content: ... });
211211
// => js/9473fdd0d880a43c21b7778d34872157.script.js
212212

213-
// loaderContext.resourcePath = "/app/page.html"
213+
// loaderContext.resourcePath = "/absolute/path/to/app/page.html"
214214
loaderUtils.interpolateName(loaderContext, "html-[hash:6].html", { content: ... });
215215
// => html-9473fd.html
216216

217-
// loaderContext.resourcePath = "/app/flash.txt"
217+
// loaderContext.resourcePath = "/absolute/path/to/app/flash.txt"
218218
loaderUtils.interpolateName(loaderContext, "[hash]", { content: ... });
219219
// => c31e9820c001c9c4a86bce33ce43b679
220220

221-
// loaderContext.resourcePath = "/app/img/image.gif"
221+
// loaderContext.resourcePath = "/absolute/path/to/app/img/image.gif"
222222
loaderUtils.interpolateName(loaderContext, "[emoji]", { content: ... });
223223
// => 👍
224224

225-
// loaderContext.resourcePath = "/app/img/image.gif"
225+
// loaderContext.resourcePath = "/absolute/path/to/app/img/image.gif"
226226
loaderUtils.interpolateName(loaderContext, "[emoji:4]", { content: ... });
227227
// => 🙍🏢📤🐝
228228

229-
// loaderContext.resourcePath = "/app/img/image.png"
229+
// loaderContext.resourcePath = "/absolute/path/to/app/img/image.png"
230230
loaderUtils.interpolateName(loaderContext, "[sha512:hash:base64:7].[ext]", { content: ... });
231231
// => 2BKDTjl.png
232232
// use sha512 hash instead of md5 and with only 7 chars of base64
233233

234-
// loaderContext.resourcePath = "/app/img/myself.png"
234+
// loaderContext.resourcePath = "/absolute/path/to/app/img/myself.png"
235235
// loaderContext.query.name =
236236
loaderUtils.interpolateName(loaderContext, "picture.png");
237237
// => picture.png
238238

239-
// loaderContext.resourcePath = "/app/dir/file.png"
239+
// loaderContext.resourcePath = "/absolute/path/to/app/dir/file.png"
240240
loaderUtils.interpolateName(loaderContext, "[path][name].[ext]?[hash]", { content: ... });
241241
// => /app/dir/file.png?9473fdd0d880a43c21b7778d34872157
242242

243-
// loaderContext.resourcePath = "/app/js/page-home.js"
243+
// loaderContext.resourcePath = "/absolute/path/to/app/js/page-home.js"
244244
loaderUtils.interpolateName(loaderContext, "script-[1].[ext]", { regExp: "page-(.*)\\.js", content: ... });
245245
// => script-home.js
246+
247+
// loaderContext.resourcePath = "/absolute/path/to/app/js/javascript.js"
248+
// loaderContext.resourceQuery = "?foo=bar"
249+
loaderUtils.interpolateName(
250+
loaderContext,
251+
(resourcePath, resourceQuery) => {
252+
// resourcePath - `/app/js/javascript.js`
253+
// resourceQuery - `?foo=bar`
254+
255+
return "js/[hash].script.[ext]";
256+
},
257+
{ content: ... }
258+
);
259+
// => js/9473fdd0d880a43c21b7778d34872157.script.js
246260
```
247261

248262
### `getHashDigest`

‎lib/interpolateName.js

Copy file name to clipboardExpand all lines: lib/interpolateName.js
+7-1
Original file line numberDiff line numberDiff line change
@@ -38,8 +38,14 @@ function encodeStringToEmoji(content, length) {
3838
function interpolateName(loaderContext, name, options) {
3939
let filename;
4040

41+
const hasQuery =
42+
loaderContext.resourceQuery && loaderContext.resourceQuery.length > 1;
43+
4144
if (typeof name === 'function') {
42-
filename = name(loaderContext.resourcePath);
45+
filename = name(
46+
loaderContext.resourcePath,
47+
hasQuery ? loaderContext.resourceQuery : undefined
48+
);
4349
} else {
4450
filename = name || '[hash].[ext]';
4551
}

‎test/interpolateName.test.js

Copy file name to clipboardExpand all lines: test/interpolateName.test.js
+44
Original file line numberDiff line numberDiff line change
@@ -167,6 +167,50 @@ describe('interpolateName()', () => {
167167
'test content',
168168
'js/9473fdd0d880a43c21b7778d34872157.script.js?foo=bar',
169169
],
170+
[
171+
'/app/js/javascript.js?foo=bar#hash',
172+
(resourcePath, resourceQuery) => {
173+
expect(resourcePath).toBeDefined();
174+
expect(resourceQuery).toBeDefined();
175+
176+
return 'js/[hash].script.[ext][query]';
177+
},
178+
'test content',
179+
'js/9473fdd0d880a43c21b7778d34872157.script.js?foo=bar',
180+
],
181+
[
182+
'/app/js/javascript.js?a',
183+
(resourcePath, resourceQuery) => {
184+
expect(resourcePath).toBeDefined();
185+
expect(resourceQuery).toBeDefined();
186+
187+
return 'js/[hash].script.[ext][query]';
188+
},
189+
'test content',
190+
'js/9473fdd0d880a43c21b7778d34872157.script.js?a',
191+
],
192+
[
193+
'/app/js/javascript.js',
194+
(resourcePath, resourceQuery) => {
195+
expect(resourcePath).toBeDefined();
196+
expect(resourceQuery).not.toBeDefined();
197+
198+
return 'js/[hash].script.[ext][query]';
199+
},
200+
'test content',
201+
'js/9473fdd0d880a43c21b7778d34872157.script.js',
202+
],
203+
[
204+
'/app/js/javascript.js?',
205+
(resourcePath, resourceQuery) => {
206+
expect(resourcePath).toBeDefined();
207+
expect(resourceQuery).not.toBeDefined();
208+
209+
return 'js/[hash].script.[ext][query]';
210+
},
211+
'test content',
212+
'js/9473fdd0d880a43c21b7778d34872157.script.js',
213+
],
170214
].forEach((test) => {
171215
it('should interpolate ' + test[0] + ' ' + test[1], () => {
172216
let resourcePath = '';

0 commit comments

Comments
0 (0)
Morty Proxy This is a proxified and sanitized view of the page, visit original site.