[解決済み] babelとwebpackを使用する場合、どのようにソースマップを生成するのですか？

質問

webpackの初心者なのですが、ソースマップを生成するための設定を教えてください。私は webpack serve をコマンドラインから実行すると、正常にコンパイルされます。しかし、私は本当にソースマップが必要です。これは私の webpack.config.js .

var webpack = require('webpack');

module.exports = {

  output: {
    filename: 'main.js',
    publicPath: '/assets/'
  },

  cache: true,
  debug: true,
  devtool: true,
  entry: [
      'webpack/hot/only-dev-server',
      './src/components/main.js'
  ],

  stats: {
    colors: true,
    reasons: true
  },

  resolve: {
    extensions: ['', '.js', '.jsx'],
    alias: {
      'styles': __dirname + '/src/styles',
      'mixins': __dirname + '/src/mixins',
      'components': __dirname + '/src/components/',
      'stores': __dirname + '/src/stores/',
      'actions': __dirname + '/src/actions/'
    }
  },
  module: {
    preLoaders: [{
      test: /\.(js|jsx)$/,
      exclude: /node_modules/,
      loader: 'jsxhint'
    }],
    loaders: [{
      test: /\.(js|jsx)$/,
      exclude: /node_modules/,
      loader: 'react-hot!babel-loader'
    }, {
      test: /\.sass/,
      loader: 'style-loader!css-loader!sass-loader?outputStyle=expanded&indentedSyntax'
    }, {
      test: /\.scss/,
      loader: 'style-loader!css!sass'
    }, {
      test: /\.(png|jpg|woff|woff2)$/,
      loader: 'url-loader?limit=8192'
    }]
  },

  plugins: [
    new webpack.HotModuleReplacementPlugin(),
    new webpack.NoErrorsPlugin()
  ]

};

私はwebpackの初心者で、ドキュメントを見てもこの問題が何に対してのものなのかよく分からないので、あまり役に立ちませんでした。

解決方法は？

ソースマップを使用するために devtool オプション 値 から true から 値 で利用できる this list 例えば source-map

devtool: 'source-map'

devtool : 'source-map' - SourceMapが出力されます。