grunt-usemin: Возможно ли иметь уменьшенный файл исходной карты *.js, который указывает на исходные файлы, а не на объединенный?

Я не знаю, возможно ли это, но я хочу, чтобы моя задача usemin генерировала SourceMap для исходных файлов.

Скажем, у меня есть следующие файлы *.js в качестве блока на моей странице index.html:

<!-- build:js scripts/app.js -->
<script src="scripts/s1.js"></script>
<script src="scripts/s2.js"></script>
...
...
<!-- endbuild -->

поведение usemin по умолчанию, которое мне нравится, представляет собой двухэтапный процесс:

  1. concat — объединение всех файлов в блоке и размещение полученного файла app.js в .tmp/concat/scripts/app.js.
  2. uglify — уменьшите указанный выше файл app.js и поместите его в dist/scripts/app.js.

Играя с ним, я смог сгенерировать файлы app.js.map, один для фактических исходных файлов, которые находятся в папке .tmp/concat/scripts, а другой для объединенного файла в папке dist/scripts.

Проблема в том, что мне нужно отлаживать файл app.js dist, используя файлы s1.js, s2.j2 исходного блока (возможно, и другие), но я снова ссылаюсь на созданный usemin конкатенированный файл app.js в .tmp.

i.e

.tmp
    |
    concat
        |
        scripts
            app.js
            app.js.map (references to s1.js, s2.js, etc...)
– application
    |– index.html
    |– scripts
        s1.js
        s2.js
        ..
– dist
    |- scripts
        app.js
        app.js.map (references to .tmp's app.js only, but I need it to take me to original s1.js, s2.js files)

Я надеюсь, что я делаю что-то не так, и я могу создать исходный файл карты, который указывает на исходные файлы, но если нет, то как все другие программисты используют такой usemin и могут отлаживать минифицированный .js в производстве?


gruntjs grunt-usemin
person Dror Weiss    schedule 27.04.2015    source источник

Ответы (2)


arrow_upward
3
arrow_downward

Да! Используйте параметр sourceMapIn.

Как я это сделал:

useminPrepare: {
options: {
    ...
    flow: {
        steps: {
            js: ['concat', 'uglifyjs'],
            css: ['concat', 'cssmin']
        },
        post: {
            js: [{
                name: 'concat',
                createConfig: function (context, block) {
                    context.options.generated.options = {
                        sourceMap: true
                    };
                }
            }, {
                name: 'uglify',
                createConfig: function (context, block) {
                    context.options.generated.options = {
                        sourceMapIn: '.tmp/concat/' + block.dest.replace('.js', '.js.map'),
                        mangle: false,
                        beautify: {
                            beautify: true
                        }
                    };
                }
            }]
        }
    }
}

}

person Dror Weiss    schedule 29.04.2015

arrow_upward
1
arrow_downward

Я попробовал это с решением @wilenx, но это не сработало, потому что в sourceMap: true отсутствовала конфигурация uglify.

Для меня это было минимальное рабочее решение:

useminPrepare: {
      html: 'app/index.html',
      options: {
        dest: 'dist',
        flow: {
          html: {
            steps: {
              js: ['concat', 'uglifyjs'],
              css: ['cssmin']
            },
            post: {
              js: [{
                name: 'concat',
                createConfig: function (context) {
                  context.options.generated.options = {
                    sourceMap: true
                  };
                }
              }, {
                name: 'uglify',
                createConfig: function (context, block) {
                  context.options.generated.options = {
                    sourceMap : true,
                    sourceMapIn: '.tmp/concat/' + block.dest.replace('.js', '.js.map')
                  };
                }
              }]
            }
          }
        }
      }
    },

person Marcel Amsler    schedule 05.08.2016