css-loader - npm Package Compare versions

Comparing version 6.7.4 to 6.8.0

dist/index.js

@@ -10,4 +10,2 @@ "use strict";
 var _semver = require("semver");
-var _CssSyntaxError = _interopRequireDefault(require("./CssSyntaxError"));
-var _Warning = _interopRequireDefault(require("./Warning"));
 var _options = _interopRequireDefault(require("./options.json"));
@@ -129,7 +127,7 @@ var _plugins = require("./plugins");
     }
-    callback(error.name === "CssSyntaxError" ? new _CssSyntaxError.default(error) : error);
+    callback(error.name === "CssSyntaxError" ? (0, _utils.syntaxErrorFactory)(error) : error);
     return;
   }
   for (const warning of result.warnings()) {
-    this.emitWarning(new _Warning.default(warning));
+    this.emitWarning((0, _utils.warningFactory)(warning));
   }
@@ -156,6 +154,20 @@ const imports = [].concat(icssPluginImports.sort(_utils.sort)).concat(importPluginImports.sort(_utils.sort)).concat(urlPluginImports.sort(_utils.sort));
   }
+  let isTemplateLiteralSupported = false;
+  if (
+  // eslint-disable-next-line no-underscore-dangle
+  this._compilation &&
+  // eslint-disable-next-line no-underscore-dangle
+  this._compilation.options &&
+  // eslint-disable-next-line no-underscore-dangle
+  this._compilation.options.output &&
+  // eslint-disable-next-line no-underscore-dangle
+  this._compilation.options.output.environment &&
+  // eslint-disable-next-line no-underscore-dangle
+  this._compilation.options.output.environment.templateLiteral) {
+    isTemplateLiteralSupported = true;
+  }
   const importCode = (0, _utils.getImportCode)(imports, options);
   let moduleCode;
   try {
-    moduleCode = (0, _utils.getModuleCode)(result, api, replacements, options, this);
+    moduleCode = (0, _utils.getModuleCode)(result, api, replacements, options, isTemplateLiteralSupported, this);
   } catch (error) {
@@ -165,4 +177,4 @@ callback(error);
   }
-  const exportCode = (0, _utils.getExportCode)(exports, replacements, needToUseIcssPlugin, options);
+  const exportCode = (0, _utils.getExportCode)(exports, replacements, needToUseIcssPlugin, options, isTemplateLiteralSupported);
   callback(null, `${importCode}${moduleCode}${exportCode}`);
 }

dist/utils.js

@@ -30,2 +30,4 @@ "use strict";
 exports.stringifyRequest = stringifyRequest;
+exports.syntaxErrorFactory = syntaxErrorFactory;
+exports.warningFactory = warningFactory;
 var _url = require("url");
@@ -794,3 +796,3 @@ var _path = _interopRequireDefault(require("path"));
 }
-function getModuleCode(result, api, replacements, options, loaderContext) {
+function getModuleCode(result, api, replacements, options, isTemplateLiteralSupported, loaderContext) {
   if (options.modules.exportOnlyLocals === true) {
@@ -804,3 +806,3 @@ return "";
   }
-  let code = JSON.stringify(result.css);
+  let code = isTemplateLiteralSupported ? convertToTemplateLiteral(result.css) : JSON.stringify(result.css);
   let beforeCode = `var ___CSS_LOADER_EXPORT___ = ___CSS_LOADER_API_IMPORT___(${options.sourceMap ? "___CSS_LOADER_API_SOURCEMAP_IMPORT___" : "___CSS_LOADER_API_NO_SOURCEMAP_IMPORT___"});\n`;
@@ -831,3 +833,3 @@ for (const item of api) {
     if (localName) {
-      code = code.replace(new RegExp(replacementName, "g"), () => options.modules.namedExport ? `" + ${importName}_NAMED___[${JSON.stringify(getValidLocalName(localName, options.modules.exportLocalsConvention))}] + "` : `" + ${importName}.locals[${JSON.stringify(localName)}] + "`);
+      code = code.replace(new RegExp(replacementName, "g"), () => options.modules.namedExport ? isTemplateLiteralSupported ? `\${ ${importName}_NAMED___[${JSON.stringify(getValidLocalName(localName, options.modules.exportLocalsConvention))}] }` : `" + ${importName}_NAMED___[${JSON.stringify(getValidLocalName(localName, options.modules.exportLocalsConvention))}] + "` : isTemplateLiteralSupported ? `\${${importName}.locals[${JSON.stringify(localName)}]}` : `" + ${importName}.locals[${JSON.stringify(localName)}] + "`);
     } else {
@@ -841,3 +843,3 @@ const {
       beforeCode += `var ${replacementName} = ___CSS_LOADER_GET_URL_IMPORT___(${importName}${preparedOptions});\n`;
-      code = code.replace(new RegExp(replacementName, "g"), () => `" + ${replacementName} + "`);
+      code = code.replace(new RegExp(replacementName, "g"), () => isTemplateLiteralSupported ? `\${${replacementName}}` : `" + ${replacementName} + "`);
     }
@@ -855,6 +857,17 @@ }
 }
+const SLASH = "\\".charCodeAt(0);
+const BACKTICK = "`".charCodeAt(0);
+const DOLLAR = "$".charCodeAt(0);
+function convertToTemplateLiteral(str) {
+  let escapedString = "";
+  for (let i = 0; i < str.length; i++) {
+    const code = str.charCodeAt(i);
+    escapedString += code === SLASH || code === BACKTICK || code === DOLLAR ? `\\${str[i]}` : str[i];
+  }
+  return `\`${escapedString}\``;
+}
 function dashesCamelCase(str) {
   return str.replace(/-+(\w)/g, (match, firstLetter) => firstLetter.toUpperCase());
 }
-function getExportCode(exports, replacements, icssPluginUsed, options) {
+function getExportCode(exports, replacements, icssPluginUsed, options, isTemplateLiteralSupported) {
   let code = "// Exports\n";
@@ -867,3 +880,3 @@ if (icssPluginUsed) {
         if (options.modules.namedExport) {
-          localsCode += `export var ${name} = ${JSON.stringify(value)};\n`;
+          localsCode += `export var ${name} = ${isTemplateLiteralSupported ? convertToTemplateLiteral(value) : JSON.stringify(value)};\n`;
         } else {
@@ -873,3 +886,3 @@ if (localsCode) {
           }
-          localsCode += `\t${JSON.stringify(name)}: ${JSON.stringify(value)}`;
+          localsCode += `\t${JSON.stringify(name)}: ${isTemplateLiteralSupported ? convertToTemplateLiteral(value) : JSON.stringify(value)}`;
         }
@@ -895,10 +908,10 @@ }
           if (options.modules.namedExport) {
-            return `" + ${importName}_NAMED___[${JSON.stringify(getValidLocalName(localName, options.modules.exportLocalsConvention))}] + "`;
+            return isTemplateLiteralSupported ? `\${${importName}_NAMED___[${JSON.stringify(getValidLocalName(localName, options.modules.exportLocalsConvention))}]}` : `" + ${importName}_NAMED___[${JSON.stringify(getValidLocalName(localName, options.modules.exportLocalsConvention))}] + "`;
           } else if (options.modules.exportOnlyLocals) {
-            return `" + ${importName}[${JSON.stringify(localName)}] + "`;
+            return isTemplateLiteralSupported ? `\${${importName}[${JSON.stringify(localName)}]}` : `" + ${importName}[${JSON.stringify(localName)}] + "`;
           }
-          return `" + ${importName}.locals[${JSON.stringify(localName)}] + "`;
+          return isTemplateLiteralSupported ? `\${${importName}.locals[${JSON.stringify(localName)}]}` : `" + ${importName}.locals[${JSON.stringify(localName)}] + "`;
         });
       } else {
-        localsCode = localsCode.replace(new RegExp(replacementName, "g"), () => `" + ${replacementName} + "`);
+        localsCode = localsCode.replace(new RegExp(replacementName, "g"), () => isTemplateLiteralSupported ? `\${${replacementName}}` : `" + ${replacementName} + "`);
       }
@@ -1007,2 +1020,36 @@ }
   return idx !== -1 ? url.slice(0, idx + 3) + preRequest + url.slice(idx + 3) : preRequest + url;
+}
+function warningFactory(obj) {
+  let message = "";
+  if (typeof obj.line !== "undefined") {
+    message += `(${obj.line}:${obj.column}) `;
+  }
+  if (typeof obj.plugin !== "undefined") {
+    message += `from "${obj.plugin}" plugin: `;
+  }
+  message += obj.text;
+  if (obj.node) {
+    message += `\n\nCode:\n  ${obj.node.toString()}\n`;
+  }
+  const warning = new Error(message);
+  warning.stack = null;
+  return warning;
+}
+function syntaxErrorFactory(obj) {
+  let message = "\nSyntaxError\n\n";
+  if (typeof obj.line !== "undefined") {
+    message += `(${obj.line}:${obj.column}) `;
+  }
+  if (typeof obj.plugin !== "undefined") {
+    message += `from "${obj.plugin}" plugin: `;
+  }
+  message += obj.file ? `${obj.file} ` : "<css input> ";
+  message += `${obj.reason}`;
+  const code = obj.showSourceCode();
+  if (code) {
+    message += `\n\n${code}\n`;
+  }
+  const error = new Error(message);
+  error.stack = null;
+  return error;
 }

package.json

 {
   "name": "css-loader",
-  "version": "6.7.4",
+  "version": "6.8.0",
   "description": "css loader module for webpack",
@@ -52,3 +52,3 @@ "license": "MIT",
     "postcss-modules-extract-imports": "^3.0.0",
-    "postcss-modules-local-by-default": "^4.0.1",
+    "postcss-modules-local-by-default": "^4.0.3",
     "postcss-modules-scope": "^3.0.0",
@@ -93,3 +93,3 @@ "postcss-modules-values": "^4.0.0",
     "style-loader": "^3.3.2",
-    "stylus": "^0.56.0",
+    "stylus": "^0.59.0",
     "stylus-loader": "^6.1.0",
@@ -96,0 +96,0 @@ "url-loader": "^4.1.1",

No alert changes

Improved metrics

Total package byte prevSize

131005

increased by0.83%

Lines of code

2268

increased by0.22%

Worsened metrics

Number of package files

15

decreased by-11.76%

Dependency changes

• + Addedcaniuse-lite@1.0.30001612(transitive)

• + Addedes-module-lexer@1.5.0(transitive)

• - Removedcaniuse-lite@1.0.30001613(transitive)

• Updatedpostcss-modules-local-by-default@^4.0.3