server-side rendering react (c) configuration webpack grammar compiler package jsx

require the Path = const ( 'path' ); 
const nodeExternals = require ( 'WebPACK-Node-externals'); // for the server, for such a code with the client require different processing 
module.exports = { 
    target: ' Node ', // for the server, for such a code with the client require different processing 
    MODE:' Development ' , 
    entry: ' ./src/index.js' , 
    Output: { 
        filename: 'bundle.js' , 
        path: Path.resolve (__ dirname, 'Build' ) 
    }, 
    externals: [nodeExternals ()], 
    Module1: { 
        the rules: [{ 
            Test: /\.js?$/ ,
            Loader: 'Babel-Loader', // need to install Loader Babel-Core-Babel 
            the exclude: / Node-modules / , 
            Options: { 
                Presets: [ // compilation rules 
                    ' REACT ',   // need to PRESET-REACT-Babel 
                    ' 0-Stage ', // with the need to install the PRESET-Stage--Babel 0 
                    ' ES2015 ', // Babel-PRESET-ES2015 
                    [' the env ', {Targets: {browsers: [' Last versions 2 ']} }] // is compatible with all browsers last two versions of installation PRESET-env-babel 
                ] 
            } 
        }] 
    } 
}

1. target: 'node' identification code is packaged webpack end node, thereby using different ways of packaging. For example, require ( 'path') is needed in the browser code path modules are packaged in, and the server to keep only require ( 'path') of this code, without this module come packaged path.
2. May simply use the target is not enough, so the increased use webpack-node-externals package.
3. For all our parser installed remember to install the corresponding dependent babel-preset-xxx
4. Finally, the file can be executed packaged bundle.js