web-dev-qa-db-fra.com

React Fichier JSX donnant l'erreur "Impossible de lire la propriété 'createElement' of indéfinie"

J'ai un fichier test_stuff.js que je lance avec npm test

Cela ressemble à peu près à ceci:

import { assert } from 'assert';
import { MyProvider } from '../src/index';
import { React } from 'react';

const myProvider = (
  <MyProvider>
  </MyProvider>
);

describe('Array', function() {
  describe('#indexOf()', function() {
    it('should return -1 when the value is not present', function() {
      assert.equal(-1, [1,2,3].indexOf(4));
    });
  });
});

Malheureusement, j'ai l'erreur

/Users/me/projects/myproj/test/test_stuff.js:11
var myProvider = _react.React.createElement(_index.MyProvider, null);
                             ^

TypeError: Cannot read property 'createElement' of undefined
    at Object.<anonymous> (/Users/me/projects/myproj/test/test_stuff.js:7:7)

Qu'est-ce que ça veut dire? J'importe React de 'réagir' avec succès, alors pourquoi React serait-il indéfini? C'est _react.React, quoi que cela veuille dire ...

javascriptreactjsnpmreact-jsx
69
Some Guy

Pour importer React do import React from 'react' Vous ajoutez des crochets lorsque l'élément que vous importez n'est pas l'exportation par défaut dans ce module ou ce fichier. En cas de réaction, c'est l'exportation par défaut.

Cela peut s’appliquer à vos autres importations en fonction de la façon dont vous les avez définies.

127
Kafo
import React, { Component } from 'react'

Cela a fonctionné pour moi. Je ne suis pas sûr de savoir pourquoi cela a résolu ma version de ce problème. Donc, si vous êtes tombé sur ce problème et que vous utilisez create-react-app comme référence, cette méthode d'importation React fera l'affaire. (à partir d'octobre 18, lol)

17
TJ Allen

Pour ceux qui travaillent avec ReactJS avec TypeScript.

import * as React from 'react';
7
Khuong