例外TypeError：ReactHotAPIは、機能

Question

エラーの説明ではありません

TypeError: ReactHotAPI is not a function 
<anonymous> 
bundle.js:2632 
<anonymous> 
bundle.js:2632 
<anonymous> 
bundle.js:2632 
__webpack_require__() 
bundle.js:556 
hotCreateRequire/fn() 
bundle.js:87 
<anonymous> 
bundle.js:2572 
<anonymous> 
bundle.js:2572 
<anonymous> 
bundle.js:2572 
__webpack_require__() 
bundle.js:556 
hotCreateRequire/fn() 
bundle.js:87 
<anonymous> 
bundle.js:2347 
__webpack_require__() 
bundle.js:556 
hotCreateRequire/fn() 
bundle.js:87 
<anonymous> 
bundle.js:1491 
__webpack_require__() 
bundle.js:556 
hotCreateRequire/fn() 
bundle.js:87 
<anonymous> 
bundle.js:1411 
<anonymous> 
bundle.js:1411 
<anonymous> 
bundle.js:1411 
__webpack_require__() 
bundle.js:556 
hotCreateRequire/fn() 
bundle.js:87 
<anonymous> 
bundle.js:698 
<anonymous> 
bundle.js:698 
<anonymous> 
bundle.js:698 
__webpack_require__() 
bundle.js:556 
hotCreateRequire/fn() 
bundle.js:87 
<anonymous> 
bundle.js:595 
<anonymous> 
bundle.js:595 
__webpack_require__() 
bundle.js:556 
hotCreateRequire/fn() 
bundle.js:87 
<anonymous> 
bundle.js:586 
__webpack_require__() 
bundle.js:556 
<anonymous> 
bundle.js:579 
<anonymous> 
bundle.js:1 
bundle.js:2632:318 

私のWebConfig、

module.exports = { 
    ip: IP, 
    port: PORT, 
    devtool: 'source-map', 
    resolve: { 
    alias: { 
     'react-native': 'react-web', 
     'ReactNativeART': 'react-art', 
    }, 
    extensions: ['', '.js', '.jsx'], 
    }, 
    entry: isProd? [ 
    config.paths.index 
    ]: [ 
    'webpack-dev-server/client?http://' + IP + ':' + PORT, 
    'webpack/hot/only-dev-server', 
    config.paths.index, 
    ], 
    output: { 
    path: path.join(__dirname, 'output'), 
    filename: 'bundle.js' 
    }, 
    plugins: [ 
    new HasteResolverPlugin({ 
     platform: 'web', 
     nodeModules: ['react-web'] 
    }), 
    new webpack.DefinePlugin({ 
     'process.env': { 
     'NODE_ENV': JSON.stringify('development'), 
     } 
    }), 
    isProd? new webpack.ProvidePlugin({ 
     React: "react" 
    }): new webpack.HotModuleReplacementPlugin(), 
    new webpack.NoErrorsPlugin(), 
    new HtmlPlugin(), 
    ], 
    module: { 
    loaders: [ 
     { 
     test: /\.jsx?$/, 
     loaders: ['react-hot', 'babel-loader?presets[]=es2015&presets[]=react&presets[]=stage-2&presets[]=stage-0'], 
     include: [config.paths.src], 
     exclude: '/node_module' 
     }, 
    { 
     test: /\.css$/, 
     loader: "style-loader!css-loader" 
    }, 
    { 
     test: /.*\.(gif|png|jpe?g|svg)$/i, 
     loader: 'file-loader' 
    }], 
    resolve: { 
     extensions: ['.js', '.jsx'] 
    } 
    } 
}; 

私はこの問題を解決するには非常に多くの方法を試してみました。書き込まれたどこかでノードモジュールが除外されます。はい、それは除外の後に動作します。私はGiftedMassangerをWeb用に別途ビルドしますが、私はノードモジュールを除外しません。今、私はGiftedMessangerをメインアプリケーションと統合し、Webpackの本当の残酷なことに直面します。ノードモジュールを除外すると、メインアプリケーションは動作し、才能のあるメッセンジャーは動作しません。ノードモジュールを除外しないと、ReactHotAPIは関数ではありません。私は両者を満足させるために中間的な方法を望んでいる。

Answer 1

ローダーでnode_moduleを除外する必要があります。これはnode_moduleを除外しました。これはうまくいくと思います。

loaders: [ 
     { 
     test: /\.jsx?$/, 
     loaders: ['react-hot', 'babel-loader?presets[]=es2015&presets[]=react&presets[]=stage-2&presets[]=stage-0'], 
     include: [config.paths.src], 
     exclude: '/node_modules/' 
     }, 
    { 
     test: /\.css$/, 
     loader: "style-loader!css-loader" 
    }, 
    { 
     test: /.*\.(gif|png|jpe?g|svg)$/i, 
     loader: 'file-loader' 
    }]