Converts some resource URL to a webpack module request.
i Before call
urlToRequestyou need callisUrlRequestto ensure it is requestable url
const url = "path/to/module.js"; if (loaderUtils.isUrlRequest(url)) { // Logic for requestable url const request = loaderUtils.urlToRequest(url); } else { // Logic for not requestable url }Simple example:
const url = "path/to/module.js"; const request = loaderUtils.urlToRequest(url); // "./path/to/module.js"Any URL containing a ~ will be interpreted as a module request. Anything after the ~ will be considered the request path.
const url = "~path/to/module.js"; const request = loaderUtils.urlToRequest(url); // "path/to/module.js"URLs that are root-relative (start with /) can be resolved relative to some arbitrary path by using the root parameter:
const url = "/path/to/module.js"; const root = "./root"; const request = loaderUtils.urlToRequest(url, root); // "./root/path/to/module.js"To convert a root-relative URL into a module URL, specify a root value that starts with ~:
const url = "/path/to/module.js"; const root = "~"; const request = loaderUtils.urlToRequest(url, root); // "path/to/module.js"Interpolates a filename template using multiple placeholders and/or a regular expression. The template and regular expression are set as query params called name and regExp on the current loader's context.
const interpolatedName = loaderUtils.interpolateName( loaderContext, name, options );The following tokens are replaced in the name parameter:
[ext]the extension of the resource[name]the basename of the resource[path]the path of the resource relative to thecontextquery parameter or option.[folder]the folder the resource is in[query]the queryof the resource, i.e.?foo=bar[contenthash]the hash ofoptions.content(Buffer) (by default it's the hex digest of thexxhash64hash)[<hashType>:contenthash:<digestType>:<length>]optionally one can configure- other
hashTypes, i. e.xxhash64,sha1,md4(wasm version),native-md4(cryptomodule version),md5,sha256,sha512 - other
digestTypes, i. e.hex,base26,base32,base36,base49,base52,base58,base62,base64,base64safe - and
lengththe length in chars
- other
[hash]the hash ofoptions.content(Buffer) (by default it's the hex digest of thexxhash64hash)[<hashType>:hash:<digestType>:<length>]optionally one can configure- other
hashTypes, i. e.xxhash64,sha1,md4(wasm version),native-md4(cryptomodule version),md5,sha256,sha512 - other
digestTypes, i. e.hex,base26,base32,base36,base49,base52,base58,base62,base64,base64safe - and
lengththe length in chars
- other
[N]the N-th match obtained from matching the current file name againstoptions.regExp
In loader context [hash] and [contenthash] are the same, but we recommend using [contenthash] for avoid misleading.
digestType with base64safe don't contain /, + and = symbols.
Examples
// loaderContext.resourcePath = "/absolute/path/to/app/js/javascript.js" loaderUtils.interpolateName(loaderContext, "js/[hash].script.[ext]", { content: ... }); // => js/9473fdd0d880a43c21b7778d34872157.script.js // loaderContext.resourcePath = "/absolute/path/to/app/js/javascript.js" // loaderContext.resourceQuery = "?foo=bar" loaderUtils.interpolateName(loaderContext, "js/[hash].script.[ext][query]", { content: ... }); // => js/9473fdd0d880a43c21b7778d34872157.script.js?foo=bar // loaderContext.resourcePath = "/absolute/path/to/app/js/javascript.js" loaderUtils.interpolateName(loaderContext, "js/[contenthash].script.[ext]", { content: ... }); // => js/9473fdd0d880a43c21b7778d34872157.script.js // loaderContext.resourcePath = "/absolute/path/to/app/page.html" loaderUtils.interpolateName(loaderContext, "html-[hash:6].html", { content: ... }); // => html-9473fd.html // loaderContext.resourcePath = "/absolute/path/to/app/flash.txt" loaderUtils.interpolateName(loaderContext, "[hash]", { content: ... }); // => c31e9820c001c9c4a86bce33ce43b679 // loaderContext.resourcePath = "/absolute/path/to/app/img/image.png" loaderUtils.interpolateName(loaderContext, "[sha512:hash:base64:7].[ext]", { content: ... }); // => 2BKDTjl.png // use sha512 hash instead of xxhash64 and with only 7 chars of base64 // loaderContext.resourcePath = "/absolute/path/to/app/img/myself.png" // loaderContext.query.name = loaderUtils.interpolateName(loaderContext, "picture.png"); // => picture.png // loaderContext.resourcePath = "/absolute/path/to/app/dir/file.png" loaderUtils.interpolateName(loaderContext, "[path][name].[ext]?[hash]", { content: ... }); // => /app/dir/file.png?9473fdd0d880a43c21b7778d34872157 // loaderContext.resourcePath = "/absolute/path/to/app/js/page-home.js" loaderUtils.interpolateName(loaderContext, "script-[1].[ext]", { regExp: "page-(.*)\\.js", content: ... }); // => script-home.js // loaderContext.resourcePath = "/absolute/path/to/app/js/javascript.js" // loaderContext.resourceQuery = "?foo=bar" loaderUtils.interpolateName( loaderContext, (resourcePath, resourceQuery) => { // resourcePath - `/app/js/javascript.js` // resourceQuery - `?foo=bar` return "js/[hash].script.[ext]"; }, { content: ... } ); // => js/9473fdd0d880a43c21b7778d34872157.script.jsconst digestString = loaderUtils.getHashDigest( buffer, hashType, digestType, maxLength );bufferthe content that should be hashedhashTypeone ofxxhash64,sha1,md4,md5,sha256,sha512or any other node.js supported hash typedigestTypeone ofhex,base26,base32,base36,base49,base52,base58,base62,base64,base64safemaxLengththe maximum length in chars