Webpack 2 Quellkarten werden nicht generiert

Question

Webpack 2 source-map wird nicht für Javascript und CSS generiert. Es zeigt nicht einmal Fehler. Ich habe die gleiche Syntax wie die offizielle Dokumentation verwendet. Ich fügte sogar den Quellcode-Parameter von UglifyJs-Plugin zu true hinzu. Kann mir bitte jemand helfen?

Unten ist mein webpack Config

const path = require('path'); 
const ExtractTextPlugin = require("extract-text-webpack-plugin"); 
const webpack = require('webpack'); 

const extractSass = new ExtractTextPlugin({ 
    filename: "vendor-styles.css" 
}); 

module.exports = { 
    entry: './js/app/index.js', 

    output: { 
    path: path.resolve(__dirname, "./js/dist/"), 
    filename: "[name].js" 
    }, 

    devtool: "source-map", 

    plugins: [ 
    extractSass, 
    new webpack.ProvidePlugin({ 
     Promise: 'es6-promise-promise', 
     $: "jquery", 
     jQuery: "jquery", 
     "window.jQuery": "jquery" 
    }), 
    new webpack.optimize.CommonsChunkPlugin({ 
     name: 'vendor', 
     minChunks: function (module) { 
     return module.context && module.context.indexOf('node_modules') !== -1; 
     } 
    }), 
    new webpack.optimize.UglifyJsPlugin({sourceMap: true}) 
    ], 

    module: { 
    rules: [{ 
     test: /\.js$/, 
     exclude: /node_modules/, 
     loader: "babel-loader", 

     query: { 
      presets: [ 
      'env', 
      'react' 
      ] 
     } 
     }, 
     { 
     test: /\.scss$/, 
     use: extractSass.extract({ 
      use: [{ 
      loader: "css-loader", 
      options: { 
       sourceMap: true, 
       importLoaders: true 
      } 
      }, { 
      loader: "sass-loader", 
      options: { 
       sourceMap: true 
      } 
      }], 
      // use style-loader in development 
      fallback: "style-loader" 
     }) 
     }, 
     { 
     test: /\.css$/, 
     use: extractSass.extract({ 
      use: [{ 
      loader: "css-loader", 
      options: { 
       sourceMap: true, 
       importLoaders: true 
      } 
      }], 
      // use style-loader in development 
      fallback: "style-loader" 
     }) 
     }, 
     { 
     test: /\.woff(\?v=\d+\.\d+\.\d+)?$/, 
     use: "url-loader?limit=10000&mimetype=application/font-woff&name=/css/fonts/[name].[ext]" 
     }, 
     { 
     test: /\.woff2(\?v=\d+\.\d+\.\d+)?$/, 
     use: "url-loader?limit=10000&mimetype=application/font-woff&name=/css/fonts/[name].[ext]" 
     }, 
     { 
     test: /\.ttf(\?v=\d+\.\d+\.\d+)?$/, 
     use: "url-loader?limit=10000&mimetype=application/octet-stream&name=/css/fonts/[name].[ext]" 
     }, 
     { 
     test: /\.eot(\?v=\d+\.\d+\.\d+)?$/, 
     use: "file-loader?name=/css/fonts/[name].[ext]" 
     }, 
     { 
     test: /\.svg(\?v=\d+\.\d+\.\d+)?$/, 
     use: "url-loader?limit=10000&mimetype=image/svg+xml&name=/css/fonts/[name].[ext]" 
     }, 
     { 
     test: /\.(png|jpg|jpeg|gif)$/, 
     loader: 'url-loader' 
     }, 
    ] 
    } 
} 

Answer 1

ich hatte das gleiche Problem, aber ich habe endlich webpack sourcemaps für meine .jsx Dateien auszuspucken, durch die SourceMapDevToolPlugin verwenden. Ich habe es direkt aus dem Beispiel in der Dokumentation kopiert; https://webpack.js.org/plugins/source-map-dev-tool-plugin/

Hoffe, es hilft :)

Answer 2

Fügen Sie diese Codezeile vor dem Eintritt devtool: 'cheap-module-eval-source-map', dann im Debugger sollten Sie genaue Zeilennummer Fehler.