Получение исходных карт, работающих с оцененным кодом

У меня есть скрипт сборки, который запускает весь мой код через uglifyjs, делает кучу причудливых кеширующих вещей и, в конечном итоге, запускает eval( code ) некоторые файлы JavaScript.

Я пытаюсь запустить весь этот процесс с помощью исходных карт, но я не могу заставить его работать, пока я использую eval. Если я напрямую ссылаюсь на файлы, используя <script src="...">, все работает нормально.

В моем коде eval у меня есть:

code, blah blah blah
//@ sourceMappingURL=/cache/618a67795c7460184bd9b99020cbb9fd.map

а затем в этом файле .map у меня есть:

{
      "version"  : 3
    , "file"     : "618a67795c7460184bd9b99020cbb9fd.map"
    , "sources"  : ["/js/Parallax-JS/js/parallax-2.js"]
    , "names"    : [
          "a"
        , "bunch"
        , "of"
        , "variable"
        , "names"
    ]
    , "mappings" : "... LONG MAP ..."
}

Вместо этого я попытался поставить //@ sourceURL= в конце, и это, по крайней мере, дает мне правильное имя файла, но все еще не имеет читаемого источника.

Любые идеи? Тестирование в Chrome 25 (dev) и 26 (canary)


javascript source-maps
person Mark Kahn    schedule 17.01.2013    source источник

Ответы (2)


arrow_upward
7
arrow_downward

У меня была аналогичная проблема, и решение, похоже, использует встроенные SourceMaps (DataURL SourceMap).

Вот пример:

eval("blah blah\n//@ sourceMappingURL=data:application/json;base64,...");

Похоже, вы не можете ссылаться на внешние ресурсы из eval.

Я думаю, вам также нужно использовать sourcesContent для вставки исходного кода в SourceMap.

Протестировано с Chrome 32.

person Tobias K.    schedule 12.02.2014
comment
Я все еще немного смущен. Не могли бы вы предоставить рабочий jsfiddle этого? Спасибо - person AjaxLeung; 16.04.2016
comment
Это не работает для меня. Это был спекулятивный ответ или вы убедились, что он работает? - person Joel Day; 29.08.2016

arrow_upward
-1
arrow_downward

Вот настройка с использованием Grunt для компиляции javascript в один файл с использованием uglify с исходной картой.

пакет.json

"src": {
    "js": "src/js"
},
"dest": {
    "js": "bin/js"
}

Gruntfile.js

grunt.initConfig({
    /**
     * Loading in the package file to read source and destination directories
     */
    pkg: grunt.file.readJSON('package.json'),
    uglify: {
    options: {
        banner: '/* all.min.js <%= grunt.template.today("dd-mm-yyyy") %> */\n',
        sourceMap: '<%= pkg.dest.js %>/all.min.js.map',
        sourceMappingURL: 'all.min.js.map',
        sourceMapRoot: '../../',
        mangle: false
        /*mangle: {
            except: ['jQuery']
        }*/
    },
    js: {
        src: [
            '<%= pkg.src.js %>/**/*.js'
        ],
        dest: '<%= pkg.dest.js %>/all.min.js'
    }
    }
};

grunt.loadNpmTasks('grunt-contrib-uglify');
grunt.registerTask('min', ['uglify']);

Что создает следующие файлы:

все.мин.js

/* all.min.js 04-10-2013 */
angular.module("App",[])
//# sourceMappingURL=all.min.js.map

all.min.js.map

{"version":3,"file":"bin/js/all.min.js","sources":["src/js/App.js"],"names":["angular","module"],"mappings":"AAeAA,QAAQC","sourceRoot":"../../"}
person Kim T    schedule 24.10.2013