ReactComponent не работает в реакционных лесах с laravel - PullRequest
0 голосов
/ 07 марта 2020

Итак, у меня есть этот код

import React from 'react';
import ReactDOM from 'react-dom';
import './index.css';
import App from './App/index.js';
import 'bootstrap/dist/css/bootstrap.min.css';

import { ReactComponent as Logo } from './assets/logo.svg';

const Logoish = () => <Logo />

import * as serviceWorker from './serviceWorker';

ReactDOM.render(<Logoish />, document.getElementById('app'));

serviceWorker.unregister();

Это мой индекс. js, если хотите. Я пытался отреагировать, и laravel работали вместе в течение последних двух недель, и все ошибки, которые я получил, были очень расплывчатыми React.createElement: type is invalid, которые я просто не мог отследить (возможно, было что-то, что я пропустил в коде ошибки, который я надеваю не знаю).

Итак, я отследил его от laravel -> реагировать -> реагировать на маршрутизатор -> реагировать - bootstrap -> компоненты -> активы, и я понял, что мои активы не загружаются следовательно, все приложение не будет загружено. Я копнул глубже и обнаружил, что ReactComponent несет ответственность. Я прикреплю код ошибки, который я получу ниже. Если я импортирую так:

import logo from './assets/logo.svg';

const Logoish = <img src={logo} alt="Logo" />

Это работает. Но не в приведенном выше коде:

import { ReactComponent as Logo } from './assets/logo.svg';

const Logoish = () => <Logo />

Вот сообщение об ошибке:

Warning: React.createElement: type is invalid -- expected a string (for built-in components) or a class/function (for composite components) but got: undefined. You likely forgot to export your component from the file it's defined in, or you might have mixed up default and named imports.

Check the render method of `Logoish`.
    in Logoish app.js:91655:32
    warningWithoutStack http://localhost:8080/js/app.js:91655
    warning http://localhost:8080/js/app.js:92126
    createElementWithValidation http://localhost:8080/js/app.js:93523
    Logoish http://localhost:8080/js/app.js:96841
    renderWithHooks http://localhost:8080/js/app.js:74007
    mountIndeterminateComponent http://localhost:8080/js/app.js:76541
    beginWork$1 http://localhost:8080/js/app.js:77909
    beginWork$$1 http://localhost:8080/js/app.js:83503
    performUnitOfWork http://localhost:8080/js/app.js:82442
    workLoopSync http://localhost:8080/js/app.js:82418
    performSyncWorkOnRoot http://localhost:8080/js/app.js:82017
    scheduleUpdateOnFiber http://localhost:8080/js/app.js:81445
    updateContainer http://localhost:8080/js/app.js:84850
    legacyRenderSubtreeIntoContainer http://localhost:8080/js/app.js:85275
    unbatchedUpdates http://localhost:8080/js/app.js:82180
    legacyRenderSubtreeIntoContainer http://localhost:8080/js/app.js:85274
    render http://localhost:8080/js/app.js:85355
    js http://localhost:8080/js/app.js:96845
    __webpack_require__ http://localhost:8080/js/app.js:20
    js http://localhost:8080/js/app.js:96763
    __webpack_require__ http://localhost:8080/js/app.js:20
    0 http://localhost:8080/js/app.js:98534
    __webpack_require__ http://localhost:8080/js/app.js:20
    <anonymous> http://localhost:8080/js/app.js:84
    <anonymous> http://localhost:8080/js/app.js:87

Ссылаясь на этот поток StackOverflow Я думаю, это как-то связано с Webpack и требуют.

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...