inline-sourcemap-file gives wrong file path of .coffee file

[tiye]

Too early to try that :p I wrote console.log and main.coffee:2 is printed in the console, but as I click that link, I will jump to a wrong path of main.coffee.

The command I compile it with:

cjsify -o build/build.js --inline-source-map -w coffee/main.coffee

content of main.coffee

# empty line
console.log "loaded"

Folder structure:

➤➤ tree -I components
.
|-- bower.json
|-- build
|   |-- build.js
|   |-- index.html
|   `-- page.css
|-- coffee
|   `-- main.coffee
|-- dev.coffee
`-- layout
    |-- index.jade
    `-- page.styl

The url I debug my page:

http://laptop/demo-of-threejs/build/index.html

by clicking the line number after console.log, jump to the url:

http://laptop/coffee/main.coffee

no such a file. Tried to visit from filesystem, still fail. Right url of coffee should be:

http://laptop/demo-of-threejs/coffee/main.coffee

The generated js file

// Generated by CommonJS Everywhere 0.7.1
(function (global) {
  function require(file, parentModule) {
    if ({}.hasOwnProperty.call(require.cache, file))
      return require.cache[file];
    var resolved = require.resolve(file);
    if (!resolved)
      throw new Error('Failed to resolve module ' + file);
    var module$ = {
        id: file,
        require: require,
        filename: file,
        exports: {},
        loaded: false,
        parent: parentModule,
        children: []
      };
    if (parentModule)
      parentModule.children.push(module$);
    var dirname = file.slice(0, file.lastIndexOf('/') + 1);
    require.cache[file] = module$.exports;
    resolved.call(module$.exports, module$, module$.exports, dirname, file);
    module$.loaded = true;
    return require.cache[file] = module$.exports;
  }
  require.modules = {};
  require.cache = {};
  require.resolve = function (file) {
    return {}.hasOwnProperty.call(require.modules, file) ? require.modules[file] : void 0;
  };
  require.define = function (file, fn) {
    require.modules[file] = fn;
  };
  var process = function () {
      var cwd = '/';
      return {
        title: 'browser',
        version: 'v0.10.5',
        browser: true,
        env: {},
        argv: [],
        nextTick: global.setImmediate || function (fn) {
          setTimeout(fn, 0);
        },
        cwd: function () {
          return cwd;
        },
        chdir: function (dir) {
          cwd = dir;
        }
      };
    }();
  require.define('/coffee/main.coffee', function (module, exports, __dirname, __filename) {
    console.log('loaded');
  });
  require('/coffee/main.coffee');
}.call(this, this));
/*
//@ sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjp0cnVlLCJzb3VyY2VzIjpbIi9jb2ZmZWUvbWFpbi5jb2ZmZWUiXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6Ijs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7SUFDQSxPQUFPLElBQVAsQ0FBWSxRQUFaLENBQUEsQyJ9
*/

BTW, do you test your pages by serving them with a Node server?

[michaelficarra]

I can't reproduce this. It's working for me. Maybe a video would help?

[tiye]

A video here. Linux is not so good at capturing screen... only got a .mpg file https://www.dropbox.com/s/jzlwj58jvq1fd3r/out.mpg Failed to upload it to Youtube.. It should be clear enough to see the characters if you play it locally.

And code here, in case you want to point out which line is wrong.. https://github.com/jiyinyiyong/three-quarter

By the way, are those videos on the site below available in the US? I usually upload videos there. http://www.tudou.com/home/item_u56179749s0p1.html

---

update:

By typing "show" I mean "slow" when using NPM and Git.. video takes too long time - -!

[michaelficarra]

Hmm, it looks like your browser might not support the newer sourcesContent field of the source map. Can you list the name and version of your browser along with the platform you're running it on? Did you build it from source or grab a binary distribution?

[tiye]

Archlinux Chrome Version 28.0.1500.5 dev Package from https://aur.archlinux.org/packages/google-chrome-dev/ via yaourt -S google-chrome-dev

[michaelficarra]

I'm not sure if I can help you any further. I did notice that there's no "enable source maps" option anywhere in the settings that you briefly show. The version you have should support source maps and sourcesContent, though. I'd confirm that source map support is enabled.

[tiye]

SourceMaps is on all the time since I learnt Browserify. Before I record that video I was using -s build.map to debug my code and it should be right. Anyway -s is enough for debugging. I found there's google-chrome-dev-28.0.1500.20-1 available. I will add comment here if that begin to work after upgrading.