.net - .Net Core MVC + ReactJS,Safari 浏览器中的 Webpack 问题
问题描述
我被这个奇怪的问题困住了。我的应用程序在 Chrome、Firefox、Edge、IE11 中运行良好。但是在 Safari 中出现了一些问题,我什至在控制台中都看不到确切的错误。控制台中的消息是通用的,要求我不要丑化/缩小脚本以查看确切的错误。
错误:*消息:“缩小的 React 错误 #130;访问http://facebook.github.io/react/docs/error-decoder.html?invariant=130&args[]=undefined&args[]=获取完整消息或使用用于完整错误和其他有用警告的非缩小开发环境。”
名称:“不变违规”*
确切的问题:如果我评论 JSON.stringify 插件,应用程序甚至不会打开。控制台给出以下错误。
“TypeError:'未定义'不是函数(评估'(0,d.render)')”
Uglify 插件没有影响,如果我评论它,该应用程序仍然可以工作,而不会 uglify 我的 JS。
以下是我的 webpack 文件。
const path = require('path');
const webpack = require('webpack');
const ExtractTextPlugin = require('extract-text-webpack-plugin');
const extractCSS = new ExtractTextPlugin('allstyles.css');
module.exports = {
entry: {
'common': ['react-datepicker', 'babel-polyfill', 'react', 'react-dom', 'react-redux', 'redux', 'isomorphic-fetch', 'es6-promise'],
'home': './ClientApp/pages/Home.js',
'header': './ClientApp/components/shared/Header.js',
'footer': './ClientApp/components/shared/Footer.js',
'game': './ClientApp/pages/Game.js',
'gamesbsport': './ClientApp/pages/GameSBSport.js',
'gamesbesport': './ClientApp/pages/GameSBESport.js',
'gamegbkeno': './ClientApp/pages/GameGBkeno.js',
'gamegbkthree': './ClientApp/pages/GameGBkTHREE.js',
'gamegblotto': './ClientApp/pages/GameGBlotto.js',
'gamegbpkten': './ClientApp/pages/GameGBpkTEN.js',
'gamegbsports': './ClientApp/pages/GameGBsports.js',
'gamegbssc': './ClientApp/pages/GameGBssc.js',
'casino': './ClientApp/pages/Casino.js',
'about': './ClientApp/components/About.js',
'info': './ClientApp/pages/member/info.js',
'trade': './ClientApp/pages/member/trade.js',
'bonus': './ClientApp/pages/member/bonus.js'
},
output: {
path: path.resolve(__dirname, 'wwwroot/dist'),
filename: '[name].js',
publicPath: '/dist/'
},
plugins: [
extractCSS,
new webpack.ProvidePlugin({
$: 'jquery',
jQuery: 'jquery',
'window.jQuery': 'jquery',
Popper: ['popper.js', 'default']
}),
new webpack.optimize.CommonsChunkPlugin({
name: ["header", "common", "runtime"],
minChunks: Infinity
}),
new webpack.optimize.OccurrenceOrderPlugin(),
//new webpack.DefinePlugin({
// 'process.env': {
// 'NODE_ENV': JSON.stringify('production')
// }
// }),
new webpack.optimize.UglifyJsPlugin()
],
module: {
rules: [
{ test: /\.css$/, use: extractCSS.extract(['css-loader?minimize']) },
{
test: /\.js?$/, use: {
loader: 'babel-loader',
options: {
presets: ['@babel/preset-react', '@babel/preset-env'],
plugins: [require('@babel/plugin-proposal-object-rest-spread'),
require('@babel/plugin-proposal-class-properties')],
babelrc: true
}
}
},
{
test: /\.js?$/,
loader: 'webpack-module-hot-accept',
exclude: /node_modules/,
},
{
test: /\.(jpe?g|png|gif|woff|woff2|eot|ttf|svg)(\?[a-z0-9=.]+)?$/,
loader: 'url-loader?limit=100000'
}
]
}
};
解决方案
推荐阅读
- psycopg2 - psycopg2 - 对带有 sql 组合的 select 语句使用通配符?
- java - 是否可以在 openJRE 没有 java FX 的环境中运行 JavaFX jar?
- regex - 如何使用正则表达式为所有数字加上引号?
- scala - 如何将 setLabelCol 中的多列传递给 spark mllib 中的 xgboost?
- python - 在 csv 中查找重复项和重复项的唯一性
- tags - 如何隐藏/删除 odoobot 在 many2many_tags 中创建的标签
- html - html5 - 图形元素位置重要性
- html - 如何正确定位每侧的两个元素?
- node.js - 查询在 mongodb 中有对象数组的嵌套对象
- reactjs - React Native WebView 中的 incognito 和 cacheEnabled 道具有什么区别?