ES6（babel + webpack）类方法中的静默错误

Question

THE PROBLEM :

I use a webpack bundle to locate and transpile the ES6.

I want to catch errors without try/catch block. How can i get this and what is the reason makes exceptions silent? This problem apperars not only in constructor() method. Any method of the class thow errors like this silently

import React from 'react';
class TestComponent extends React.Component {
    constructor(props) {
        super(props);
        /*
            Try/catch block works fine.
            "test is not defined(…)" 
        */
        try {
            test.fake(1);
        } catch (e) {
            console.error(e);
        }
        // Line below should theoretically throw exception but it does not 
        test.fake(1);
    }
    render() {
        return <div>TEST</div>
    }
}
export default TestComponent;   

This is my webpack.config

var path = require('path');
var webpack = require('webpack');
var ExtractTextPlugin = require('extract-text-webpack-plugin');
var HtmlWebpackPlugin = require('html-webpack-plugin');

module.exports = {
    devtool: 'cheap-module-eval-source-map',
    //devtool: 'eval',
    entry: [
        'webpack-dev-server/client?http://localhost:3000',
        'webpack/hot/only-dev-server',
        './src/js/main'
    ],
    output: {
        filename: 'app.js',
        path: path.join(__dirname, 'dist'),
        publicPath: '/assets/'
    },
    plugins: [
        new webpack.HotModuleReplacementPlugin(),
        new webpack.NoErrorsPlugin(),
        new ExtractTextPlugin('app.css', {
            allChunks: true
        }),
        new webpack.DefinePlugin({
            __DEV_TOOLS__: true
        }),
        new HtmlWebpackPlugin({
            title: 'Redux Boilerplate',
            filename: 'index.html',
            template: 'index.template.html'
        })
    ],
    resolve: {
        root: path.resolve('./src/js')
    },
    module: {
        loaders: [
            {
                test: /\.scss$/,
                loader: ExtractTextPlugin.extract('style-loader', 'css-loader!sass')
            }, {
                test: /\.js$/,
                loaders: ['babel'],
                exclude: /node_modules/
            }
        ]
    },
    cssnext: {
        browsers: 'last 2 versions'
    }
};

Answer 1

Webpack will transpile not compile your code. When you trans-pile the above, there are not syntax issues or missing requirements, so webpack will simply run that code through babel and transpile to EC5. You might want to look for a loader or plugin that actually executes the code after transpilation. Better yet, combine webpack with gulp or karma and get a full fledged solution. We use something like this. https://github.com/webpack/karma-webpack