Browsers ignore source maps

Do you want to request a feature or report a bug?
Bug

What is the current behavior?
Source maps are not generated. Breakpoints are ignored (at least in Chrome and FF), debugger; works fine. If I run webpack-dev-server -d and access http://localhost:8080/webpack-dev-server I can’t see any source maps, only bundle is generated. Running webpack -p produces source maps and debugger works fine.

If the current behavior is a bug, please provide the steps to reproduce.
Use the following setup:
webpack.config.js:

const path = require("path");

module.exports = {
    devtool: "source-map", // I've tried every option
    entry: path.resolve(__dirname, "src", "index.js"),
    output: {
        filename: "app.js",
        path: path.resolve(__dirname, "dist")
    },
    devServer: {
        contentBase: path.resolve(__dirname, "dist")
    }
};

package.json:

{
  "name": "app",
  "scripts": {
    "build": "webpack -p",
    "dev": "webpack-dev-server -d"
  },
  "devDependencies": {
    "webpack": "^2.2.1",
    "webpack-dev-server": "^2.3.0"
  }
}

What is the expected behavior?
Source maps should be emitted. Code execution should be stopped at the place where breakpoints is inserted.

If this is a feature request, what is motivation or use case for changing the behavior?

Please mention other relevant information such as the browser version, Node.js version, webpack version and Operating System.
Webpack: 2.2.1
Node: 6.0.0
OS: Ubuntu 14.04.5 4.4.0-62-generic
Chrome: 58.0.3000.4 and 56.0.2924.87

Output from running webpack-dev-server -d:

Project is running at http://localhost:8080/
webpack output is served from /
Content not from webpack is served from /home/workspace/webpack2/dist
Hash: 945e7e285eb1e522a279
Version: webpack 2.2.1
Time: 546ms
 Asset    Size  Chunks                    Chunk Names
app.js  857 kB       0  [emitted]  [big]  main
chunk    {0} app.js (main) 300 kB [entry] [rendered]
   [35] (webpack)-dev-server/client?http://localhost:8080 4.9 kB {0} [built]
   [36] ./src/index.js 85 bytes {0} [built]
   [37] ./~/ansi-html/index.js 4.26 kB {0} [built]
   [38] ./~/ansi-regex/index.js 135 bytes {0} [built]
   [40] ./~/events/events.js 8.33 kB {0} [built]
   [41] ./~/html-entities/index.js 231 bytes {0} [built]
   [48] ./~/querystring-es3/index.js 127 bytes {0} [built]
   [51] ./~/sockjs-client/lib/entry.js 244 bytes {0} [built]
   [77] ./~/strip-ansi/index.js 161 bytes {0} [built]
   [79] ./~/url/url.js 23.3 kB {0} [built]
   [80] ./~/url/util.js 314 bytes {0} [built]
   [81] (webpack)-dev-server/client/overlay.js 3.59 kB {0} [built]
   [82] (webpack)-dev-server/client/socket.js 856 bytes {0} [built]
   [84] (webpack)/hot/emitter.js 77 bytes {0} [built]
   [85] multi (webpack)-dev-server/client?http://localhost:8080 ./src/index.js 40 bytes {0} [built]
     + 71 hidden modules
webpack: Compiled successfully.

Author: Fantashit

1 thought on “Browsers ignore source maps

  1. I got my source maps by not using -d, but specifying --debug --output-pathinfo, and specifying:
    devtool: 'source-map' in my config.

Comments are closed.