@webdiscus/pug-loader - npm Package Compare versions

Comparing version 1.7.0 to 1.7.1

CHANGELOG.md

 # Change log
 
+## 1.7.1 (2022-02-10)
+- added support for webpack alias an array of paths, [#10](https://github.com/webdiscus/pug-loader/issues/10)
+- fix optional prefix of alias in request when an alias name self contains the prefix
+
 ## 1.7.0 (2022-02-07)
@@ -4,0 +8,0 @@ - possible BREAKING CHANGE (low probability): limiting for the method `compile` by resolving a variable in the argument of require() used in pug, see [resolve resources](https://github.com/webdiscus/pug-loader#resolve_resources) .\

package.json

 {
   "name": "@webdiscus/pug-loader",
-  "version": "1.7.0",
+  "version": "1.7.1",
   "description": "The pug loader resolves paths and webpack aliases in a pug template and compiles it to HTML or into a template function.",
@@ -5,0 +5,0 @@ "keywords": [

README.md

@@ -257,10 +257,9 @@ <div align="center">
 
-> For generates smaller and faster JS code, it is recommended to use this options:
-> ```js
-> {
->   method: 'render',
->   esModule: true
-> }
-> 
-> ```
+💡 For generates smaller and faster template function, it is recommended to use following options:
+```js
+{
+  method: 'render', 
+  esModule: true
+}
+```
 
@@ -616,15 +615,15 @@ ### `data`
 
-| Example in pug template                                                                                                                                      | @webdiscus/<br>pug-loader<br>`render` / `html` methods | @webdiscus/<br>pug-loader<br>`compile` method | pugjs/<br>pug-loader  |
+| Example in pug template                                                                                                                                | @webdiscus/<br>pug-loader<br>`render` / `html` methods | @webdiscus/<br>pug-loader<br>`compile` method | pugjs/<br>pug-loader  |
 |--------------------------------------------------------------------------------------------------------------------------------------------------------|--------------------------------------------------------|-----------------------------------------------|-----------------------|
-| `img(src=require('image.jpeg'))`                                                                                                                       | ✅ but not recomended                                   | ❌                                             | ❌                     |
-| `img(src=require('./image.jpeg'))`                                                                                                                     | ✅                                                      | ✅                                             | ✅                     |
-| `img(src=require('../images/image.jpeg'))`                                                                                                             | ✅                                                      | ✅                                             | ✅                     |
-| `img(src=require('~Images/image.jpeg'))`                                                                                                               | ✅                                                      | ✅                                             | ✅                     |
-| `- var file = 'image.jpeg'`<br>``img(src=require(`~Images/${file}`))``                                                                                 | ✅                                                      | ✅                                             | ✅                     |
-| `- var file = './image.jpeg'`<br>`img(src=require(file))`                                                                                              | ✅                                                      | ✅                                             | ❌                     |
-| `- var file = './images/image.jpeg'`<br>`img(src=require(file))`                                                                                       | ✅                                                      | ❌                                             | ❌                     |
-| `- var file = '../images/image.jpeg'`<br>`img(src=require(file))`                                                                                      | ✅                                                      | ❌                                             | ❌                     |
-| `- var file = 'image.jpeg'`<br>``img(src=require(`./images/${file}`))``                                                                                | ✅                                                      | ✅                                             | ✅                     |
-| `- var file = 'image.jpeg'`<br>`img(src=require('../images/' + file))`                                                                                 | ✅                                                      | ✅                                             | ✅                     |
-| `pugjs/pug-loader` can't resolve a resource<br>when used a mixin and require in same file: <br> `include mixins`<br>`img(src=require('./image.jpeg'))` | ✅                                                      | ✅                                             | ❌                     |
+| `img(src=require('logo.png'))`                                                                                                                         | ✅ but not recomended                                   | ❌                                             | ❌                     |
+| `img(src=require('./logo.png'))`                                                                                                                     | ✅                                                      | ✅                                             | ✅                     |
+| `img(src=require('../images/logo.png'))`                                                                                                             | ✅                                                      | ✅                                             | ✅                     |
+| `img(src=require('~Images/logo.png'))`                                                                                                               | ✅                                                      | ✅                                             | ✅                     |
+| `- var file = 'logo.png'`<br>``img(src=require(`~Images/${file}`))``                                                                                 | ✅                                                      | ✅                                             | ✅                     |
+| `- var file = './logo.png'`<br>`img(src=require(file))`                                                                                              | ✅                                                      | ✅                                             | ❌                     |
+| `- var file = './images/logo.png'`<br>`img(src=require(file))`                                                                                       | ✅                                                      | ❌                                             | ❌                     |
+| `- var file = '../images/logo.png'`<br>`img(src=require(file))`                                                                                      | ✅                                                      | ❌                                             | ❌                     |
+| `- var file = 'logo.png'`<br>``img(src=require(`./images/${file}`))``                                                                                | ✅                                                      | ✅                                             | ✅                     |
+| `- var file = 'logo.png'`<br>`img(src=require('../images/' + file))`                                                                                 | ✅                                                      | ✅                                             | ✅                     |
+| `pugjs/pug-loader` can't resolve a resource<br>when used a mixin and require in same file: <br> `include mixins`<br>`img(src=require('./logo.png'))` | ✅                                                      | ✅                                             | ❌                     |
 
@@ -631,0 +630,0 @@

src/index.js

@@ -76,3 +76,5 @@ // add polyfill for node.js >= 12.0.0 && < 15.0.0
   const loaderContext = this,
-    webpackOptionsResolve = getWebpackOptionsResolve(loaderContext),
+    webpackOptionsResolve = loaderContext.hasOwnProperty('_compiler')
+      ? loaderContext._compiler.options.resolve || {}
+      : {},
     loaderOptions = loaderContext.getOptions() || {},
@@ -173,15 +175,2 @@ esModule = loaderOptions.esModule === true,
 
-/**
- * @param {Object} loaderContext The context object of webpack loader.
- * @returns {{}}
- */
-const getWebpackOptionsResolve = (loaderContext) => {
-  let options = {};
-  if (loaderContext.hasOwnProperty('_compiler')) {
-    options = loaderContext._compiler.options.resolve || {};
-  }
-
-  return options;
-};
-
 module.exports = function (content, map, meta) {
@@ -188,0 +177,0 @@ const callback = this.async();

src/resolver.js

@@ -7,10 +7,22 @@ // the 'enhanced-resolve' package already used in webpack, don't need to define it in package.json
 
+const aliasRegexp = /^([~@])?(.*?)(?=\/)/;
+
 /**
- * Create regexp to match alias.
- *
- * @param {string} match The matched alias.
- * @return {string} The regexp pattern with matched aliases.
+ * @param {string} request
+ * @returns {{aliasName: string, ignorePrefix: boolean, targetPath: string || array || null}}
  */
-const aliasRegexp = (match) => `^[~@]?(${match})(?=\\/)`;
+const parseAliasInRequest = (request) => {
+  const [, prefix, alias] = aliasRegexp.exec(request) || [];
+  const aliasName = (prefix || '') + (alias || '');
+  const targetPath = resolver.aliases[aliasName];
+  const ignorePrefix = prefix != null && alias != null && targetPath == null;
 
+  return {
+    // whether a prefix should be ignored to try resolve alias w/o prefix
+    ignorePrefix,
+    aliasName,
+    targetPath,
+  };
+};
+
 /**
@@ -46,6 +58,8 @@ * @param {string} path The start path to resolve.
  * @property {Object} [aliases = {}]
+ * @property {boolean} hasAlias
+ * @property {boolean} hasPlugins
  * @property {function(basedir:string, path:string, options:{})} init
  * @property {(function(file:string, context:string): string)} resolve
  * @property {(function(file:string, context:string): string)} interpolate
- * @property {(function(value:string, aliases:{}=): string)} resolveAlias
+ * @property {(function(value:string): string)} resolveAlias
  * @property {function(templateFile:string, value:string, dependencies:string[]): string} resolveRequireCode
@@ -62,2 +76,4 @@ * @property {function(templateFile:string, value:string, method:LoaderMethod): string} resolveRequireResource
   basedir: '/',
+  hasAlias: false,
+  hasPlugins: false,
 
@@ -71,3 +87,6 @@ /**
     resolver.basedir = basedir;
-    resolver.aliases = options.alias;
+    resolver.aliases = options.alias || {};
+    resolver.hasAlias = Object.keys(resolver.aliases).length > 0;
+    resolver.hasPlugins = options.plugins && Object.keys(options.plugins).length > 0;
+
     resolveFile = getFileResolverSync(path, options);
@@ -99,9 +118,15 @@ },
     if (resolvedPath == null) {
-      resolvedPath = resolver.resolveAlias(file, resolver.aliases);
+      resolvedPath = resolver.resolveAlias(file);
     }
 
     // fallback to enhanced resolver
-    if (resolvedPath == null) {
+    if (resolvedPath == null || Array.isArray(resolvedPath)) {
       try {
-        resolvedPath = resolveFile(context, file);
+        let request = file;
+        if (Array.isArray(resolvedPath)) {
+          // remove optional prefix in request for enhanced resolver
+          const { ignorePrefix } = parseAliasInRequest(request);
+          if (ignorePrefix) request = request.substring(1);
+        }
+        resolvedPath = resolveFile(context, request);
       } catch (error) {
@@ -155,3 +180,12 @@ resolveException(error, file, templateFile);
         resolvedPath = resolver.resolveAlias(file.substring(1));
-        if (resolvedPath) resolvedPath = file[0] + resolvedPath;
+
+        if (typeof resolvedPath === 'string') {
+          resolvedPath = file[0] + resolvedPath;
+        } else if (Array.isArray(resolvedPath)) {
+          // try to resolve via enhanced resolver by webpack self at compilation time
+          resolvedPath = file;
+          // remove optional prefix in request for enhanced resolver
+          const { ignorePrefix } = parseAliasInRequest(file.substring(1));
+          if (ignorePrefix) resolvedPath = file[0] + file.substring(2);
+        }
       }
@@ -174,22 +208,14 @@
    *
-   * @param {string} value The value of extends/include/require().
-   * @param {{}} [aliases = resolver.aliases] The `resolve.alias` of webpack config.
+   * @param {string} request The value of extends/include/require().
    * @return {string | null} If found an alias return resolved normalized path otherwise return false.
    */
-  resolveAlias: (value, aliases = resolver.aliases) => {
-    if (!aliases) return null;
+  resolveAlias: (request) => {
+    if (resolver.hasAlias === false) return null;
 
-    const patternAliases = Object.keys(aliases).join('|');
+    let { ignorePrefix, aliasName, targetPath } = parseAliasInRequest(request);
+    // try resolve alias w/o prefix
+    if (ignorePrefix === true) targetPath = resolver.aliases[aliasName.substring(1)];
 
-    // webpack.alias is empty
-    if (!patternAliases) return null;
-
-    const [, alias] = new RegExp(aliasRegexp(patternAliases)).exec(value) || [];
-
-    // path contains no alias
-    if (!alias) return null;
-
-    let resolvedFile = value.replace(new RegExp(aliasRegexp(alias)), aliases[alias]);
-
-    return path.join(resolvedFile);
+    return typeof targetPath === 'string' ? path.join(targetPath + request.substring(aliasName.length)) : targetPath;
+    //return typeof targetPath === 'string' ? targetPath + request.substring(aliasName.length) : null;
   },
@@ -196,0 +222,0 @@

New alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Fixed alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Improved metrics

Total package byte prevSize

62697

increased by2.05%

Lines of code

673

increased by2.59%

Worsened metrics

Number of lines in readme file

768

decreased by-0.13%

No dependency changes