阵营生产显示空白页

我有一个问题用的WebPack的身材，我运行的命令是阵营生产显示空白页

cross-env NODE_ENV=production webpack --config webpack.prod.js

和文件的WebPack PROD是：

var webpack = require('webpack'); 
var webpackMerge = require('webpack-merge'); 
var ExtractTextPlugin = require('extract-text-webpack-plugin'); 
var HtmlWebpackPlugin = require('html-webpack-plugin'); 
var commonConfig = require('./webpack.common.js'); 
var path = require('path'); 

const ENV = process.env.NODE_ENV = process.env.ENV = 'production'; 

module.exports = webpackMerge(commonConfig, { 
    devtool: 'source-map', 

    output: { 
    path: path.join(process.cwd(), '/public'), 
    publicPath: '/', 
    filename: '[name].[hash].js' 
}, 

plugins: [ 
    //new webpack.NoErrorsPlugin(), 
    new webpack.optimize.DedupePlugin(), 
    new webpack.optimize.UglifyJsPlugin({ 
     mangle: { 
      keep_fnames: true, 
      except: ['$super'] 
     } 
    }), 
    new ExtractTextPlugin('[name].[hash].css'), 
    new webpack.DefinePlugin({ 
     'process.env': { 
      NODE_ENV: JSON.stringify('production') 
     } 
    }) 
    ] 
});

webpack.common.js是

var webpack = require('webpack'); 
var CopyWebpackPlugin = require('copy-webpack-plugin'); 
var HtmlWebpackPlugin = require('html-webpack-plugin'); 
var ExtractTextPlugin = require('extract-text-webpack-plugin'); 
var path = require('path'); 
var pkgBower = require('./package.json'); 

module.exports = { 

entry: { 
    'app': './main.js' 
}, 

resolve: { 
    root: path.join(__dirname, ''), 
    modulesDirectories: ['node_modules', 'bower_components'], 
    extensions: ['', '.js', '.jsx'] 
}, 

module: { 
    loaders: [...] 
}, 

devServer: { 
    outputPath: path.join(__dirname, 'public') 
}, 

plugins: [ 
    new HtmlWebpackPlugin({ 
     template: process.env.NODE_ENV == 'development' ? 'index.html' : 'index.prod.html', 
     baseUrl: process.env.NODE_ENV == 'development' ? '/' : '/' 
    })  
    ] 
};

我可以运行的构建，但不幸的是，当我打开index.html它显示了一个空白页给我，我想包括这SPA在春季启动项目，但我不知道如何;）

谢谢！

来源

2017-07-31 Lorenzo De Francesco

解决了！是一个“browserHistory”的问题

如果您使用“browserHistory”作为历史记录管理器，您的webpack需要使用“hashHistory”来运行node.js服务器，您可以将其用作普通网页！

见 Why is React Webpack production build showing Blank page?

来源

2017-07-31 21:34:13

首先，你使用Lorenzo是哪个版本的webpack？可能由于语法，它是1.X.

首先，检查你的package.json文件是哪个版本。然后，如果它真的是1.x，你可以建立在调试模式下。

export default { 
    entry: [ 
     './src/Client.js' 
    ], 
    debug: true 
}

您webpack.common.js内

检查错误，贴在这里。

我希望它能帮助，欢迎StackOverflow，这里是可以提高我们社区的一些注释=）

来源

2017-07-31 19:22:32

嗨尤里，我使用的是1.14版 –

启用调试模式，然后。 –

我改变了我的webpack.common这样 module.exports = { 项：{ '应用'：” ./main.js'， }， \t调试：真，} ，我没有赶上任何错误 –

阵营生产显示空白页

回答

相关问题