2016-11-07 6 views
1

Ich versuche, eine Webpack (1.13.3) Konfig für eine React (15.3.2) App einzurichten, und ich möchte die Produktionsversion von React in meiner Produktion erstellen. Ich bin auf Windows.Reagieren Webpack Produktionsfehler

Ich verwende diese (die überall online bei der Suche):

new webpack.ProvidePlugin({ 
    'process.env': { 
    'NODE_ENV': JSON.stringify('production') 
    } 
}) 

aber sobald ich das hinzufügen und führe webpack (CLI) Ich werde rund um das Gesicht mit vielen vielen Fehlern schlägt .

ich eine ganze Reihe dieser Warnungen:

WARNING in ./~/fbjs/lib/partitionObject.js.flow Module parse failed: C:\node\sandbox\react-webpack\node_modules\fbjs\lib[ SOME FILE NAME HERE].flow Unexpected token (18:24) You may need an appropriate loader to handle this file type.

... und ein paar dieser Fehler:

ERROR in ./~/react/lib/NativeMethodsMixin.js Module not found: Error: Cannot resolve module 'react-native/lib/TextInputState' in C:\node\sandbox\react-webpack\node_modules\react\lib @ ./~/react/lib/NativeMethodsMixin.js 17:21-63

Ich bin nicht mit india Reaktion, ich Ich wüsste nicht wie.

Ich verwende auch webpack.optimize.UglifyJsPlugin in meiner webpack.config.production.js Datei.

Wenn ich entfernen die webpack.ProvidePlugin biss die Build funktioniert, aber beinhaltet die Entwicklung Version von Reagieren und ich erhalte Warnungen in der Konsole:

Warning: It looks like you're using a minified copy of the development build of React. When deploying React apps to production, make sure to use the production build which skips development warnings and is faster.

Was sind diese webpack Fehler alles über ..? Wie bekomme ich einen Produktionsaufbau von React, der ebenfalls minimiert wird?

UPDATE

Voll webpack Config angefordert. Ich habe Setup einen Test-App für diese, mit einem Minimum an Konfiguration und die Warnungen und Fehler werden immer noch angezeigt:

webpack.config.js

module.exports = process.env.NODE_ENV === 'production' ? require('./webpack.config.production.js') : require('./webpack.config.development.js') 

webpack.config.base.js

module.exports = { 
    entry: { 
    'bundle': './client/index.js' 
    }, 
    output: { 
    path: './public', 
    filename: 'js/[name].js' 
    }, 
    module: { 
    loaders: [ 
     { 
     test: /\.js$/, 
     exclude: /(node_modules|bower_components)/, 
     loader: 'babel-loader', 
     query: { presets: ['es2015', 'react'] } 
     } 
    ] 
    } 
} 

webpack.config.development.js

var config = require('./webpack.config.base') 
module.exports = config 

webpack.config.production.js

var webpack = require('webpack') 

var config = require('./webpack.config.base') 

config.plugins = [ 
    new webpack.ProvidePlugin({ 
    'process.env': { 
     'NODE_ENV': JSON.stringify('production') 
    } 
    }), 
    new webpack.optimize.UglifyJsPlugin({ 
    include: /\.js$/, 
    compress: { warnings: false } 
    }) 
] 

module.exports = config 

Der Test app ich nur mit bin hat die folgenden Optionen:

"dependencies": { 
    "express": "^4.14.0", 
    "react": "^15.3.2", 
    "react-dom": "^15.3.2" 
}, 
"devDependencies": { 
    "babel": "^6.5.2", 
    "babel-core": "^6.18.2", 
    "babel-loader": "^6.2.7", 
    "babel-preset-es2015": "^6.18.0", 
    "babel-preset-react": "^6.16.0", 
    "webpack": "^1.13.3" 
} 

/client/index.js

import React from 'react' 
import ReactDOM from 'react-dom' 
import Hello from '../components/Hello' 
ReactDOM.render(<Hello />, document.getElementById('page')) 

/components/Hallo.js

import React from 'react' 
const Hello = props => <p>Hello world...</p> 
export default Hello 

wieder in einer separaten Frage gestellt, aber mit der vollständigen Fehlerliste, und aus einer nativen Ansicht Reaktion, da die Fehler Verweise Mutter reagieren zu können, auch wenn ich nicht bin versucht, es zu benutzen:

Webpack in production: Why React Native errors?

+0

Sie scheinen alles richtig zu machen. Sind Sie sicher, dass Sie keine externe Bibliothek verwenden, die von einer reaktiven Umgebung abhängig ist? Das scheint hier das Problem zu sein. Können Sie Ihre vollständige Webpack-Konfiguration posten? – Ambroos

+0

Ich habe gerade meine Frage mit den Webpack-Konfigurationsdateien aktualisiert. Es funktioniert, keine Warnungen oder Fehler, ohne das 'webpack.ProvidePlugin'. Mit dem 'webpack.ProvidePlugin' werden alle Fehler wieder angezeigt. –

+0

Gerade habe ich auch meine 'Abhängigkeiten'-Listen hinzugefügt ... –

Antwort