fix: reduce runtime (#1378)

.eslintrc.js

@@ -1,4 +1,18 @@
 module.exports = {
   root: true,
   extends: ["@webpack-contrib/eslint-config-webpack", "prettier"],
+  overrides: [
+    {
+      files: "src/runtime/**/*",
+      env: {
+        browser: true,
+      },
+      rules: {
+        "prefer-destructuring": "off",
+        "no-param-reassign": "off",
+        "no-continue": "off",
+        "no-underscore-dangle": "off",
+      },
+    },
+  ],
 };

src/index.js

@@ -207,10 +207,13 @@ export default async function loader(content, map, meta) {
       imports.unshift({
         type: "api_sourcemap_import",
         importName: "___CSS_LOADER_API_SOURCEMAP_IMPORT___",
-        url: stringifyRequest(
-          this,
-          require.resolve("./runtime/cssWithMappingToString")
-        ),
+        url: stringifyRequest(this, require.resolve("./runtime/noSourceMaps")),
+      });
+    } else {
+      imports.unshift({
+        type: "api_sourcemap_import",
+        importName: "___CSS_LOADER_API_NO_SOURCEMAP_IMPORT___",
+        url: stringifyRequest(this, require.resolve("./runtime/noSourceMaps")),
       });
     }
   }

src/runtime/api.js

@@ -2,9 +2,7 @@
   MIT License http://www.opensource.org/licenses/mit-license.php
   Author Tobias Koppers @sokra
 */
-// css base code, injected by the css-loader
-// eslint-disable-next-line func-names
-module.exports = function (cssWithMappingToString) {
+module.exports = (cssWithMappingToString) => {
   const list = [];
 
   // return the list of modules as css string
@@ -21,18 +19,15 @@ module.exports = function (cssWithMappingToString) {
   };
 
   // import a list of modules into the list
-  // eslint-disable-next-line func-names
-  list.i = function (modules, mediaQuery, dedupe) {
+  list.i = function i(modules, mediaQuery, dedupe) {
     if (typeof modules === "string") {
-      // eslint-disable-next-line no-param-reassign
       modules = [[null, modules, ""]];
     }
 
     const alreadyImportedModules = {};
 
     if (dedupe) {
       for (let i = 0; i < this.length; i++) {
-        // eslint-disable-next-line prefer-destructuring
         const id = this[i][0];
 
         if (id != null) {
@@ -45,7 +40,6 @@ module.exports = function (cssWithMappingToString) {
       const item = [].concat(modules[i]);
 
       if (dedupe && alreadyImportedModules[item[0]]) {
-        // eslint-disable-next-line no-continue
         continue;
       }
 

src/runtime/getUrl.js

@@ -1,24 +1,20 @@
 module.exports = (url, options) => {
   if (!options) {
-    // eslint-disable-next-line no-param-reassign
     options = {};
   }
 
   if (!url) {
     return url;
   }
 
-  // eslint-disable-next-line no-underscore-dangle, no-param-reassign
   url = String(url.__esModule ? url.default : url);
 
   // If url is already wrapped in quotes, remove them
   if (/^['"].*['"]$/.test(url)) {
-    // eslint-disable-next-line no-param-reassign
     url = url.slice(1, -1);
   }
 
   if (options.hash) {
-    // eslint-disable-next-line no-param-reassign
     url += options.hash;
   }
 

src/runtime/noSourceMaps.js

@@ -0,0 +1 @@
+module.exports = (i) => i[1];

src/runtime/cssWithMappingToString.js → src/runtime/sourceMaps.js

@@ -1,12 +1,12 @@
-module.exports = function cssWithMappingToString(item) {
-  const [, content, , cssMapping] = item;
+module.exports = (item) => {
+  const content = item[1];
+  const cssMapping = item[3];
 
   if (!cssMapping) {
     return content;
   }
 
   if (typeof btoa === "function") {
-    // eslint-disable-next-line no-undef
     const base64 = btoa(
       unescape(encodeURIComponent(JSON.stringify(cssMapping)))
     );

src/utils.js

@@ -935,7 +935,7 @@ function getModuleCode(result, api, replacements, options, loaderContext) {
   let beforeCode = `var ___CSS_LOADER_EXPORT___ = ___CSS_LOADER_API_IMPORT___(${
     options.sourceMap
       ? "___CSS_LOADER_API_SOURCEMAP_IMPORT___"
-      : "function(i){return i[1]}"
+      : "___CSS_LOADER_API_NO_SOURCEMAP_IMPORT___"
   });\n`;
 
   for (const item of api) {

test/__snapshots__/esModule-option.test.js.snap

@@ -4,11 +4,12 @@ exports[`"esModule" option should work when not specified: errors 1`] = `Array [
 
 exports[`"esModule" option should work when not specified: module 1`] = `
 "// Imports
+import ___CSS_LOADER_API_NO_SOURCEMAP_IMPORT___ from \\"../../../src/runtime/noSourceMaps.js\\";
 import ___CSS_LOADER_API_IMPORT___ from \\"../../../src/runtime/api.js\\";
 import ___CSS_LOADER_AT_RULE_IMPORT_0___ from \\"-!../../../src/index.js??ruleSet[1].rules[0].use[0]!./imported.css\\";
 import ___CSS_LOADER_GET_URL_IMPORT___ from \\"../../../src/runtime/getUrl.js\\";
 var ___CSS_LOADER_URL_IMPORT_0___ = new URL(\\"./img.png\\", import.meta.url);
-var ___CSS_LOADER_EXPORT___ = ___CSS_LOADER_API_IMPORT___(function(i){return i[1]});
+var ___CSS_LOADER_EXPORT___ = ___CSS_LOADER_API_IMPORT___(___CSS_LOADER_API_NO_SOURCEMAP_IMPORT___);
 ___CSS_LOADER_EXPORT___.i(___CSS_LOADER_AT_RULE_IMPORT_0___);
 var ___CSS_LOADER_URL_REPLACEMENT_0___ = ___CSS_LOADER_GET_URL_IMPORT___(___CSS_LOADER_URL_IMPORT_0___);
 // Module
@@ -50,11 +51,12 @@ exports[`"esModule" option should work with a value equal to "false": errors 1`]
 
 exports[`"esModule" option should work with a value equal to "false": module 1`] = `
 "// Imports
+var ___CSS_LOADER_API_NO_SOURCEMAP_IMPORT___ = require(\\"../../../src/runtime/noSourceMaps.js\\");
 var ___CSS_LOADER_API_IMPORT___ = require(\\"../../../src/runtime/api.js\\");
 var ___CSS_LOADER_AT_RULE_IMPORT_0___ = require(\\"-!../../../src/index.js??ruleSet[1].rules[0].use[0]!./imported.css\\");
 var ___CSS_LOADER_GET_URL_IMPORT___ = require(\\"../../../src/runtime/getUrl.js\\");
 var ___CSS_LOADER_URL_IMPORT_0___ = require(\\"./img.png\\");
-var ___CSS_LOADER_EXPORT___ = ___CSS_LOADER_API_IMPORT___(function(i){return i[1]});
+var ___CSS_LOADER_EXPORT___ = ___CSS_LOADER_API_IMPORT___(___CSS_LOADER_API_NO_SOURCEMAP_IMPORT___);
 ___CSS_LOADER_EXPORT___.i(___CSS_LOADER_AT_RULE_IMPORT_0___);
 var ___CSS_LOADER_URL_REPLACEMENT_0___ = ___CSS_LOADER_GET_URL_IMPORT___(___CSS_LOADER_URL_IMPORT_0___);
 // Module
@@ -96,11 +98,12 @@ exports[`"esModule" option should work with a value equal to "true" and the "mod
 
 exports[`"esModule" option should work with a value equal to "true" and the "mode" value equal to "global": module 1`] = `
 "// Imports
+import ___CSS_LOADER_API_NO_SOURCEMAP_IMPORT___ from \\"../../../src/runtime/noSourceMaps.js\\";
 import ___CSS_LOADER_API_IMPORT___ from \\"../../../src/runtime/api.js\\";
 import ___CSS_LOADER_AT_RULE_IMPORT_0___ from \\"-!../../../src/index.js??ruleSet[1].rules[0].use[0]!./imported.css\\";
 import ___CSS_LOADER_GET_URL_IMPORT___ from \\"../../../src/runtime/getUrl.js\\";
 var ___CSS_LOADER_URL_IMPORT_0___ = new URL(\\"./img.png\\", import.meta.url);
-var ___CSS_LOADER_EXPORT___ = ___CSS_LOADER_API_IMPORT___(function(i){return i[1]});
+var ___CSS_LOADER_EXPORT___ = ___CSS_LOADER_API_IMPORT___(___CSS_LOADER_API_NO_SOURCEMAP_IMPORT___);
 ___CSS_LOADER_EXPORT___.i(___CSS_LOADER_AT_RULE_IMPORT_0___);
 var ___CSS_LOADER_URL_REPLACEMENT_0___ = ___CSS_LOADER_GET_URL_IMPORT___(___CSS_LOADER_URL_IMPORT_0___);
 // Module
@@ -143,11 +146,12 @@ exports[`"esModule" option should work with a value equal to "true" and the "mod
 
 exports[`"esModule" option should work with a value equal to "true" and the "mode" value equal to "local": module 1`] = `
 "// Imports
+import ___CSS_LOADER_API_NO_SOURCEMAP_IMPORT___ from \\"../../../src/runtime/noSourceMaps.js\\";
 import ___CSS_LOADER_API_IMPORT___ from \\"../../../src/runtime/api.js\\";
 import ___CSS_LOADER_AT_RULE_IMPORT_0___ from \\"-!../../../src/index.js??ruleSet[1].rules[0].use[0]!./imported.css\\";
 import ___CSS_LOADER_GET_URL_IMPORT___ from \\"../../../src/runtime/getUrl.js\\";
 var ___CSS_LOADER_URL_IMPORT_0___ = new URL(\\"./img.png\\", import.meta.url);
-var ___CSS_LOADER_EXPORT___ = ___CSS_LOADER_API_IMPORT___(function(i){return i[1]});
+var ___CSS_LOADER_EXPORT___ = ___CSS_LOADER_API_IMPORT___(___CSS_LOADER_API_NO_SOURCEMAP_IMPORT___);
 ___CSS_LOADER_EXPORT___.i(___CSS_LOADER_AT_RULE_IMPORT_0___);
 var ___CSS_LOADER_URL_REPLACEMENT_0___ = ___CSS_LOADER_GET_URL_IMPORT___(___CSS_LOADER_URL_IMPORT_0___);
 // Module
@@ -192,11 +196,12 @@ exports[`"esModule" option should work with a value equal to "true" and the "mod
 
 exports[`"esModule" option should work with a value equal to "true" and the "mode" value equal to "pure": module 1`] = `
 "// Imports
+import ___CSS_LOADER_API_NO_SOURCEMAP_IMPORT___ from \\"../../../src/runtime/noSourceMaps.js\\";
 import ___CSS_LOADER_API_IMPORT___ from \\"../../../src/runtime/api.js\\";
 import ___CSS_LOADER_AT_RULE_IMPORT_0___ from \\"-!../../../src/index.js??ruleSet[1].rules[0].use[0]!./imported.css\\";
 import ___CSS_LOADER_GET_URL_IMPORT___ from \\"../../../src/runtime/getUrl.js\\";
 var ___CSS_LOADER_URL_IMPORT_0___ = new URL(\\"./img.png\\", import.meta.url);
-var ___CSS_LOADER_EXPORT___ = ___CSS_LOADER_API_IMPORT___(function(i){return i[1]});
+var ___CSS_LOADER_EXPORT___ = ___CSS_LOADER_API_IMPORT___(___CSS_LOADER_API_NO_SOURCEMAP_IMPORT___);
 ___CSS_LOADER_EXPORT___.i(___CSS_LOADER_AT_RULE_IMPORT_0___);
 var ___CSS_LOADER_URL_REPLACEMENT_0___ = ___CSS_LOADER_GET_URL_IMPORT___(___CSS_LOADER_URL_IMPORT_0___);
 // Module
@@ -241,11 +246,12 @@ exports[`"esModule" option should work with a value equal to "true": errors 1`]
 
 exports[`"esModule" option should work with a value equal to "true": module 1`] = `
 "// Imports
+import ___CSS_LOADER_API_NO_SOURCEMAP_IMPORT___ from \\"../../../src/runtime/noSourceMaps.js\\";
 import ___CSS_LOADER_API_IMPORT___ from \\"../../../src/runtime/api.js\\";
 import ___CSS_LOADER_AT_RULE_IMPORT_0___ from \\"-!../../../src/index.js??ruleSet[1].rules[0].use[0]!./imported.css\\";
 import ___CSS_LOADER_GET_URL_IMPORT___ from \\"../../../src/runtime/getUrl.js\\";
 var ___CSS_LOADER_URL_IMPORT_0___ = new URL(\\"./img.png\\", import.meta.url);
-var ___CSS_LOADER_EXPORT___ = ___CSS_LOADER_API_IMPORT___(function(i){return i[1]});
+var ___CSS_LOADER_EXPORT___ = ___CSS_LOADER_API_IMPORT___(___CSS_LOADER_API_NO_SOURCEMAP_IMPORT___);
 ___CSS_LOADER_EXPORT___.i(___CSS_LOADER_AT_RULE_IMPORT_0___);
 var ___CSS_LOADER_URL_REPLACEMENT_0___ = ___CSS_LOADER_GET_URL_IMPORT___(___CSS_LOADER_URL_IMPORT_0___);
 // Module