fix: source map generation

Author: alexander-akait

package-lock.json

@@ -45,6 +45,7 @@
     "icss-utils": "^4.1.0",
     "loader-utils": "^1.2.3",
     "camelcase": "^5.2.0",
+    "normalize-path": "^3.0.0",
     "postcss": "^7.0.14",
     "postcss-modules-extract-imports": "^2.0.0",
     "postcss-modules-local-by-default": "^2.0.6",

package.json

@@ -17,6 +17,7 @@ import {
   getCurrentRequest,
   stringifyRequest,
 } from 'loader-utils';
+import normalizePath from 'normalize-path';
 
 import schema from './options.json';
 import { importParser, icssParser, urlParser } from './plugins';
@@ -46,9 +47,19 @@ export default function loader(content, map, meta) {
         map = JSON.stringify(map);
       }
 
+      // Source maps should use forward slash because it is URLs (https://github.com/mozilla/source-map/issues/91)
+      // We should normalize path because previous loaders like `sass-loader` using backslash when generate source map
+
+      if (map.file) {
+        map.file = normalizePath(map.file);
+      }
+
+      if (map.sourceRoot) {
+        map.sourceRoot = normalizePath(map.sourceRoot);
+      }
+
       if (map.sources) {
-        map.sources = map.sources.map((source) => source.replace(/\\/g, '/'));
-        map.sourceRoot = '';
+        map.sources = map.sources.map((source) => normalizePath(source));
       }
     }
   } else {
@@ -120,17 +131,15 @@ export default function loader(content, map, meta) {
 
   postcss(plugins)
     .process(content, {
-      // we need a prefix to avoid path rewriting of PostCSS
-      from: `/css-loader!${getRemainingRequest(this)
+      from: getRemainingRequest(this)
         .split('!')
-        .pop()}`,
+        .pop(),
       to: getCurrentRequest(this)
         .split('!')
         .pop(),
       map: options.sourceMap
         ? {
             prev: map,
-            sourcesContent: true,
             inline: false,
             annotation: false,
           }
@@ -301,39 +310,14 @@ export default function loader(content, map, meta) {
           );
         });
 
-      let newMap = result.map;
-
-      if (sourceMap && newMap) {
-        // Add a SourceMap
-        newMap = newMap.toJSON();
-
-        if (newMap.sources) {
-          newMap.sources = newMap.sources.map(
-            (source) =>
-              source
-                .split('!')
-                .pop()
-                .replace(/\\/g, '/'),
-            this
-          );
-          newMap.sourceRoot = '';
-        }
-
-        newMap.file = newMap.file
-          .split('!')
-          .pop()
-          .replace(/\\/g, '/');
-        newMap = JSON.stringify(newMap);
-      }
-
       const runtimeCode = `exports = module.exports = require(${stringifyRequest(
         this,
         require.resolve('./runtime/api')
       )})(${!!sourceMap});\n`;
       const importCode =
         imports.length > 0 ? `// Imports\n${imports.join('\n')}\n\n` : '';
       const moduleCode = `// Module\nexports.push([module.id, ${cssAsString}, ""${
-        newMap ? `,${newMap}` : ''
+        result.map ? `,${result.map}` : ''
       }]);\n\n`;
       const exportsCode =
         exports.length > 0

src/index.js

@@ -34,23 +34,6 @@ Array [
 
 exports[`sourceMap option false should not generate source map when source map is \`undefined\` from other loader: warnings 1`] = `Array []`;
 
-exports[`sourceMap option false should not generate source map when source map is valid and it is string from other loader: errors 1`] = `Array []`;
-
-exports[`sourceMap option false should not generate source map when source map is valid and it is string from other loader: module (evaluated) 1`] = `
-Array [
-  Array [
-    1,
-    ".class {
-  color: red;
-}
-",
-    "",
-  ],
-]
-`;
-
-exports[`sourceMap option false should not generate source map when source map is valid and it is string from other loader: warnings 1`] = `Array []`;
-
 exports[`sourceMap option false should not generate source map: errors 1`] = `Array []`;
 
 exports[`sourceMap option false should not generate source map: module (evaluated) 1`] = `
@@ -68,23 +51,6 @@ Array [
 
 exports[`sourceMap option false should not generate source map: warnings 1`] = `Array []`;
 
-exports[`sourceMap option false should not generate sourceMap when source map is valid from other loader: errors 1`] = `Array []`;
-
-exports[`sourceMap option false should not generate sourceMap when source map is valid from other loader: module (evaluated) 1`] = `
-Array [
-  Array [
-    1,
-    ".class {
-  color: red;
-}
-",
-    "",
-  ],
-]
-`;
-
-exports[`sourceMap option false should not generate sourceMap when source map is valid from other loader: warnings 1`] = `Array []`;
-
 exports[`sourceMap option true should generate source map when source map is \`null\` from other loader: errors 1`] = `Array []`;
 
 exports[`sourceMap option true should generate source map when source map is \`null\` from other loader: module (evaluated) 1`] = `
@@ -100,9 +66,8 @@ Array [
       "file": "basic.css",
       "mappings": "AAAA;EACE,UAAU;AACZ",
       "names": Array [],
-      "sourceRoot": "",
       "sources": Array [
-        "/replaced/original/path/",
+        "basic.css",
       ],
       "sourcesContent": Array [
         ".class {
@@ -133,9 +98,8 @@ Array [
       "file": "basic.css",
       "mappings": "AAAA;EACE,UAAU;AACZ",
       "names": Array [],
-      "sourceRoot": "",
       "sources": Array [
-        "/replaced/original/path/",
+        "basic.css",
       ],
       "sourcesContent": Array [
         ".class {
@@ -151,76 +115,6 @@ Array [
 
 exports[`sourceMap option true should generate source map when source map is \`undefined\` from other loader: warnings 1`] = `Array []`;
 
-exports[`sourceMap option true should generate source map when source map is valid and it is string from other loader: errors 1`] = `Array []`;
-
-exports[`sourceMap option true should generate source map when source map is valid and it is string from other loader: module (evaluated) 1`] = `
-Array [
-  Array [
-    1,
-    ".class {
-  color: red;
-}
-",
-    "",
-    Object {
-      "file": "basic.css",
-      "mappings": "AAAA;ECCE,UAAU;AACZ",
-      "names": Array [],
-      "sourceRoot": "",
-      "sources": Array [
-        "/replaced/original/path/",
-        "/replaced/original/path/",
-      ],
-      "sourcesContent": Array [
-        ".class { a: b c d; }",
-        ".class {
-  color: red;
-}
-",
-      ],
-      "version": 3,
-    },
-  ],
-]
-`;
-
-exports[`sourceMap option true should generate source map when source map is valid and it is string from other loader: warnings 1`] = `Array []`;
-
-exports[`sourceMap option true should generate source map when source map is valid from other loader: errors 1`] = `Array []`;
-
-exports[`sourceMap option true should generate source map when source map is valid from other loader: module (evaluated) 1`] = `
-Array [
-  Array [
-    1,
-    ".class {
-  color: red;
-}
-",
-    "",
-    Object {
-      "file": "basic.css",
-      "mappings": "AAAA;ECCE,UAAU;AACZ",
-      "names": Array [],
-      "sourceRoot": "",
-      "sources": Array [
-        "/replaced/original/path/",
-        "/replaced/original/path/",
-      ],
-      "sourcesContent": Array [
-        ".class { a: b c d; }",
-        ".class {
-  color: red;
-}
-",
-      ],
-      "version": 3,
-    },
-  ],
-]
-`;
-
-exports[`sourceMap option true should generate source map when source map is valid from other loader: warnings 1`] = `Array []`;
-
 exports[`sourceMap option true should generate source map: errors 1`] = `Array []`;
 
 exports[`sourceMap option true should generate source map: module (evaluated) 1`] = `
@@ -236,9 +130,8 @@ Array [
       "file": "basic.css",
       "mappings": "AAAA;EACE,UAAU;AACZ",
       "names": Array [],
-      "sourceRoot": "",
       "sources": Array [
-        "/replaced/original/path/",
+        "basic.css",
       ],
       "sourcesContent": Array [
         ".class {