如何使用grunt，browserify和babelify啓用源地圖

Question

我想爲使用babelify和browserify傳輸的jsx文件生成源地圖。似乎有些源代碼地圖在我的輸出文件的底部生成爲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'], 
     } 
    } 
},