Ich spiele mit React (@ 13.3) mit babel und webpack.React wird voraussichtlich global verfügbar sein
Ich habe eine Komponente, die wie folgt definiert ist:
import BaseComponent from './BaseComponent';
export default class SomeComponent extends BaseComponent {
render() {
return (
<div>
<img src="http://placekitten.com/g/900/600"/>
</div>
);
}
}
Aber ich erhalte den folgenden Fehler:
Uncaught ReferenceError: React is not defined
Ich verstehe den Fehler: die JSX Bit kompiliert wird in React.createElement(...)
aber React
isn‘ t im aktuellen Bereich, da es nicht importiert wird.
Meine Fragen ist: Was ist die saubere Möglichkeit, um dieses Problem zu umgehen? Muss ich irgendwie React
global mit webpack aussetzen?
Lösung verwendet:
Ich folgte @ salehen-Rahman Vorschlag.
In meinem webpack.config.js:
module: {
loaders: [{
test: /\.js$/,
exclude: /node_modules/,
loader: 'react-hot!babel?plugins[]=react-require'
}, {
test: /\.css$/,
loader: 'style!css!autoprefixer?browsers=last 2 versions'
}]
},
Ich musste auch meine Tests beheben, so fügte ich diese in die Datei helper.js:
require('babel-core/register')({
ignore: /node_modules/,
plugins: ['react-require'],
extensions: ['.js']
});
sind meine Tests dann gestartet mit dem folgenden Befehl:
mocha --require ./test/helper.js 'test/**/*.js'
Haben Sie versucht, 'Import Reagieren von‚reagieren‘ ; '? –
Import React sollte in der BaseComponent sein. –
@ JanakaStevens ist es egal.Der obige Code sollte immer noch nicht ausgeführt werden, wenn berücksichtigt wird, dass entweder React nicht manuell importiert wurde oder dass kein Transformer beteiligt ist, der React automatisch importiert. –