Réagissez l'erreur 0.14.2 - L'expression super doit être nulle ou une fonction
Après la mise à jour de 0.13.2 à 0.14.2 j'obtiens cette erreur:
Uncaught TypeError: Super expression must either be null or a function, not object
Il y a plusieurs questions à propos de cette déjà.
L'erreur la plus commune est la faute d'orthographe Réagir.composant (sans un C majuscule).
L'autre est d'essayer d'utiliser ES6 classes avec les versions < de 0,13.
Mais j'étais déjà avec succès en utilisant ES6 classes à Réagir de 0,13.x, et j'ai utiliser le capital C partout, et la journalisation de Réagir.Composant semble donner un résultat approprié (fonction ReactComponent(...))
Après quelques recherches, j'ai fait ces 3 cas de test, dont 2 lancer la excact même erreur (sans pour autant me comprendre pourquoi) et on n'a pas. Apparemment ce qui suggère l'ordre dans lequel les classes de se produire est un problème?
TEST 1 (déclenche une erreur)
//Test.jsx
var React = require('react');
var ReactDOM = require('react-dom');
var BaseComponent = require('./BaseComponent');
class Test extends BaseComponent {
render() { return <div>Test worked</div>; }
}
ReactDOM.render(<Test />, document.getElementById('test'));
//BaseComponent.jsx
var React = require('react');
console.log(React.Component); //<--- logs "function ReactComponent(...)" !!
export default class BaseComponent extends React.Component { }
TEST 2 (mis BaseComponent sous Test.jsx, toujours erreur)
//Test.jsx
var React = require('react');
var ReactDOM = require('react-dom');
class Test extends BaseComponent { render() { return <div>Test worked</div>; } }
class BaseComponent extends React.Component { }
ReactDOM.render(<Test />, document.getElementById('test'));
TEST 3 (mis BaseComponent Test ci-dessus, la définition de la classe, pas d'erreur!?)
//Test.jsx
var React = require('react');
var ReactDOM = require('react-dom');
class BaseComponent extends React.Component { }
class Test extends BaseComponent { render() { return <div>Test worked</div>; } }
ReactDOM.render(<Test />, document.getElementById('test'));
Je ne suis même pas sûr que plus cela va résoudre mon problème. Mais pour comprendre ce qui se passe dans ces cas de test peut m'aider à arriver à la solution.
Je suis en utilisant webpack avec babel à compiler dans un bundle.
mise à jour
Changer
export default class BaseComponent extends React.Component { }
À
class BaseComponent extends React.Component { }
module.exports = BaseComponent;
également supprimé l'erreur!
Ce qui signifie que je vais refactoriser que maintenant, mais ça ne résout pas le problème, parce que export default class
devrait fonctionner
source d'informationauteur Flion
Vous devez vous connecter pour publier un commentaire.
J'ai trouvé la solution. C'est à cause d'un changement de babel, que j'ai également mis à jour.
Si vous utilisez:
Vous devez également utiliser
import
au lieu derequire
donc:au lieu de
Utilisé cette expression pour remplacer partout:
remplacer:
var ([\w-_]+?) = require\('([\w-_.\/]+?)'\);
avec:
import $1 from '$2';
J'ai eu un problème similaire il y a un moment, la suppression du dossier node_modules et la réinstallation de tout ce qui a fonctionné pour moi, peut-être que vous pourriez essayer cela?