带有 react.js aspnet 的 webpack - 'global' 和 'exports' 未定义

Question

我正在尝试让一个反应应用程序与 aspnet 一起工作，我正在使用 webpack。

这是我的 webpack 配置

var path = require('path');
var webpack = require('webpack');
var HtmlWebpackPlugin = require('html-webpack-plugin');
var pkg = require('./package.json');

// bundle dependencies in separate vendor bundle
var vendorPackages = Object.keys(pkg.dependencies).filter(function (el) {
return el.indexOf('font') === -1; // exclude font packages from vendor bundle
});

/*
 * Default webpack configuration for development
 */
var config = {
devtool: 'eval-source-map',
cache: true,
entry: {
    main: path.join(__dirname, "app", "App.js"),
    vendor: vendorPackages
},
output: {
    path: path.join(__dirname, "js"),
    filename: '[name].js',
    sourceMapFilename: "[file].map"
},

resolve: {
    modulesDirectories: ['node_modules'], alias: {}, extensions: ['', '.jsx', '.js']
},
plugins: [
    new webpack.OldWatchingPlugin(),  //needed to make watch work. see 
    new webpack.optimize.CommonsChunkPlugin(/* chunkName= */"vendor", /* filename= */"vendor.js")
],
resolveLoader: {
    'fallback': path.join(__dirname, 'node_modules')
},
module: {
loaders: [{
    test: /\.js$/,
    exclude: /node_modules/,
    loader: 'babel',
    query: {
        presets: ['es2015','react']
    }
}, {
    test: /\.css$/,
    loader: 'style!css!'
}]
}
}

/*
 * If bundling for production, optimize output
 */
if (process.env.NODE_ENV === 'production') {
config.devtool = false;

config.plugins = [
    new webpack.optimize.OccurenceOrderPlugin(),

    new webpack.optimize.UglifyJsPlugin({
        comments: false,
        compress: { warnings: false}
    }),
    new webpack.DefinePlugin({
      'process.env': {NODE_ENV: JSON.stringify('production')}
    })
];
};

module.exports = config;

当我尝试访问该页面时，我在控制台中收到这 2 个错误。

SCRIPT5009: 'global' 未定义 vendor.js (42739,2)

SCRIPT5009: 'exports' 未定义 mobilelobbyapp.js (1,1)

我不知道如何解决这些问题。我确实在一个工作示例中注意到，从 webpack 导出的 js 文件具有

webpackJsonp([0],{

在我的文件开头

exports.ids = [0];
exports.modules = {

Answer 1

我找到了这个 post 并且我能够修复 SCRIPT5009：'global' 未定义 vendor.js 通过添加

new webpack.DefinePlugin({ global: {} }), to

plugins: [
    new webpack.OldWatchingPlugin(),  //needed to make watch work. see     
    new webpack.optimize.CommonsChunkPlugin(/* chunkName= */"vendor", /* filename= */"vendor.js"),
    new webpack.DefinePlugin({ global: {} }),
],

然后我修复了 SCRIPT5009：'exports' 通过删除

未定义

target: 'node',

来自我的 webpack.config

带有 react.js aspnet 的 webpack - 'global' 和 'exports' 未定义

webpack with react.js aspnet - 'global' and 'exports' undefined

javascript

webpack

reactjs.net