sourceMap configuration of Webpack

---------------------------------------webpack.config.js----------------------------------------------------------
module.exports = {

    mode:'development',

     // 开发环境 development
     // devtool:'cheap-module-eval-source-map',

    // 生产环境 production
    // devtool:'cheap-module-source-map',


    devtool:'cheap-module-eval-source-map',
    entry: {
        main: './src/index.js'
    },
    output: {
        filename: '[name].js',
        path: path.resolve(__dirname,'dist')
    },
    plugins:[new HtmlWebpackPlugin({
        template:'src/index.html'
    }),new CleanWebpackPlugin(['dist'])],
    module: {
        rules: [ 
            { 
                the Test: /\.jpg$/, // this configuration is the focus of 
                use: { 
                    Loader: "File-Loader", 
                    Options: { 
                        name: '[name] [EXT].', // packed out Image name and suffix are the same as before, 
                        OutputPath: "ImagesRF Royalty Free /" // pack out of the files stored in dist / images folder 
                    } 
                } 
            } 

        ] 
    } 
}; 
------------ Notes -------------------------- ------

• eval: can significantly improve the efficiency of the use of continuous build eval way

• source-map: generate .mapfile

• cheap: Use cheap mode can significantly improve the efficiency of souremap generated. In most cases we do not care about the column debugging information, and even if sourcemap is not listed, and some browser engine (eg v8) is also given column information (such as error information can be given only on what line, need to give the first of several column error)

• module: contains the loader's sourcemap (

• inline: The .mapas DataURI embedded, does not generate a separate .mapfile (in this relatively rare CI)