Question

我想将javascript错误记录到服务器，但堆栈跟踪对于缩小的JS代码没有用。所以我在考虑使用Getsentry或Rollbar，在sourcemaps的帮助下显示正确的堆栈跟踪。但我很难在第一时间创建源图。

我收到此错误

“目的地（_build / js / app.js）没有写，因为src文件是空的。”

一旦正确创建源地图，就会出现另一个问题，即rev将重命名该文件。我还需要保留未经编译的连接文件。

下面是我的gruntfile.js（我删除了一些内容。）

module.exports = function(grunt) {

    grunt.initConfig({
        pkg: grunt.file.readJSON('package.json'),
        clean: {
            jsFolders: {
                src: [
                    '_build/js/ui',
                    '_build/js/vendor',
                    '_build/js/app',
                    '_build/js/*templates.js'
                ]
            },
            build: {
                src: ['_build/**/*']
            }
        },

        copy: {
            build: {
                files: [{
                    expand: true,
                    src: [
                        'index.html',
                        'img/**/*', //includes web.cofig also.
                        'img/**/*.svg',
                        '!img/**/*.psd',
                        'js/**/*', //includes web.cofig also.
                        'css/**/*', //includes web.cofig also.
                        '*.png',
                        'favicon.ico'
                    ],
                    dest: '_build/'
                }]
            },
        },

        rev: {
            option: {
                algorithm: 'sha1',
                length: 4
            },
            all: {
                files: {
                    src: [
                        '_build/**/*.{js,css,eot,ttf,woff}'
                    ]
                }
            }
        },

        useminPrepare: {
            html: ['_build/index.html']
        },

        usemin: {
            html: [
                '_build/index.html'
            ],
            css: [
                '_build/css/**/*.css'
            ]
        },

        uglify: {
            options: {
                sourceMap: '_build/js/app.js.map',
            },
            js: {
                files: {
                    '_build/js/app.js': ['_build/js/app.js']
                }
            }
        },

        cssmin: {
            minify: {
                expand: true,
                cwd: '_build/css/',
                src: '*.css',
                dest: '_build/css/'
            }
        },
    });

grunt.registerTask('build', [
        'clean:build',
        'handlebars',
        'compass',
        'autoprefixer',
        'copy:build',
        'useminPrepare',
        'concat',
        'uglify',
        'cssmin',
        'clean:jsFolders',
        'rev',
        'usemin',
    ]);

};

更新

尝试@Andy的解决方案，它仍然显示相同的错误"Destination (_build/js/app.js) not written because src files were empty."，并且在构建时也会在下面说明

 uglify:
  { options:
   { sourceMap: true,
     sourceMapName: '_build/js/app.js.map' },
  js: { files: { '_build/js/app.js': [ '_build/js/app.js' ] } },
  generated:
   { files:
      [ { dest: 'dist\\js\\app.js',
          src: [ '.tmp\\concat\\js\\app.js' ] } ] } }

不知道它来自哪里dest。我的输出文件夹是_build。

UPDATE2：
请参阅以下链接以获得更好的解决方案 https://stackoverflow.com/a/20574196/148271 https://github.com/gruntjs/grunt-contrib-uglify/issues/39#issuecomment-14856100

Answer 1

useminPrepare将现有的uglify配置与自己的配置合并，但嵌套在generated下。因此uglify的这个配置对我有用

grunt.initConfig({
  uglify: {
    generated: {
      options: {
        sourceMap: true
      }
    }
  }
});

Answer 2

没有简单的解决方案让源映射与usemin流一起使用。它是一个已知的问题，似乎在一年内没有得到解决：

https://github.com/yeoman/grunt-usemin/issues/30

https://github.com/yeoman/grunt-usemin/issues/220

Answer 3

uglify的选项是：

sourceMap: true,
sourceMapName: 'path/to/name.map'

例如，在我的GruntFile.js中，我使用了package.json中的名称：

sourceMap: true,
sourceMapName: 'dist/<%= pkg.name %>-<%= pkg.version %>.map'

使用grunt usemin和rev时使用SourceMaps进行Uglify

3 个答案: