如何使用grunt、browserify和babelify启用源地图

Question

我想为jsx文件生成源地图，这些文件是用babelify和browserify转换的。似乎一些源地图是作为base64编码的注释生成的，位于输出文件的底部，但堆栈跟踪不支持它们。

我的任务看起来像下面这样：

browserify: {
  options: {
    browserifyOptions: {
      debug: true
    },
    debug: true,
    transform: ['babelify']
  },
  app: {
    src: 'src/app.jsx',
    dest: 'dist/app.js'
  }
},

Answer 1

这对我来说很有效：

browserify: {
    dev: {
        options: {
            browserifyOptions: {
                debug: true
            },
            transform: [["babelify"]]
        },
        files: {
            "dist/bundle.js": "src/index.js"
        }
    }
},

Answer 2

需要使用grunt-exorcise从捆绑包中提取地图。

Browserify recommends it

browserify: {
  options: {
    browserifyOptions: {
      debug: true
    },
    debug: true,
    transform: ['babelify']
  },
  app: {
    src: 'src/app.jsx',
    dest: 'dist/app.js'
  }
},
exorcise: {
    app: {
       options: {},
       files: {
          'dist/app.js.map':['dist/app.js'],
       }
    }
},