Ошибка: не удалось экспортировать HTML для URL. О файле (src\pages\About.js): Инвариант не выполнен

Я добавить Switch компонент роутера в мой проект, чтобы установить страницу по умолчанию. Когда я строю это дает следующую ошибку:

  Error: Failed exporting HTML for URL About (src\pages\About.js): Invariant failed

  - tiny-invariant.cjs.js:11 invariant
    [byte-artisan]/[tiny-invariant]/dist/tiny-invariant.cjs.js:11:11

  - history.min.js:1 Object.createBrowserHistory
    [byte-artisan]/[history]/cjs/history.min.js:1:3626

  - react-router-dom.min.js:1 new t
    [byte-artisan]/[react-router-dom]/cjs/react-router-dom.min.js:1:1036

  - react-dom-server.node.production.min.js:33 c
    [byte-artisan]/[react-dom]/cjs/react-dom-server.node.production.min.js:33:323

  - react-dom-server.node.production.min.js:36 Sa
    [byte-artisan]/[react-dom]/cjs/react-dom-server.node.production.min.js:36:1

  - react-dom-server.node.production.min.js:41 a.render
    [byte-artisan]/[react-dom]/cjs/react-dom-server.node.production.min.js:41:467

  - react-dom-server.node.production.min.js:41 a.read
    [byte-artisan]/[react-dom]/cjs/react-dom-server.node.production.min.js:41:58

  - react-dom-server.node.production.min.js:53 renderToString
    [byte-artisan]/[react-dom]/cjs/react-dom-server.node.production.min.js:53:83

  - exportRoute.js:127 renderToStringAndExtract
    [byte-artisan]/[react-static]/src/static/exportRoute.js:127:21

  - exportRoute.js:191 renderToStringAndExtract
    [byte-artisan]/[react-static]/src/static/exportRoute.js:191:15

  - runtime.js:62 tryCatch
    [byte-artisan]/[regenerator-runtime]/runtime.js:62:40

  - runtime.js:288 Generator.invoke [as _invoke]
    [byte-artisan]/[regenerator-runtime]/runtime.js:288:22

  - runtime.js:114 Generator.prototype.(anonymous function) [as next]
    [byte-artisan]/[regenerator-runtime]/runtime.js:114:21

  - exportRoute.js:52 asyncGeneratorStep
    [byte-artisan]/[react-static]/lib/static/exportRoute.js:52:103

  - exportRoute.js:54 _next
    [byte-artisan]/[react-static]/lib/static/exportRoute.js:54:194

  - next_tick.js:68 process._tickCallback
    internal/process/next_tick.js:68:7

Этого не происходит при запуске сайта (запуск npm).

Более странно, случается только при сборке сайта, для некоторых страниц. Измененные страницы меняются при каждой сборке, даже если я ничего не меняю между сборками.

Вот объявление роутера:App.js

import React from 'react'
import {
    BrowserRouter as Router,
    Route,
    Link,
    Switch,
    Redirect
} from 'react-router-dom'

//pages
import './app.css'
import About from './pages/About'

function page404() {
    return (
        <div>
            <h2>page404</h2>
        </div>
    );
}

function App() {
    return (
        <Router>
            <div>
                <ul className="menu-bar">
                    <li>
                        <Link to="/about">About</Link>
                    </li>
                </ul>
                <Switch>
                    <Route path="/About" component={About} />
                    <Route component={page404} />
                </Switch>
            </div>
        </Router>    
    )
}
export default App

Окружающая среда: response-static v6.3.6

1 ответ

Решение

Удалить роутер вот так

function App() {
    return (
            <div>
                <ul className="menu-bar">
                    <li>
                        <Link to="/about">About</Link>
                    </li>
                </ul>
                <Switch>
                    <Route path="/About" component={About} />
                    <Route component={page404} />
                </Switch>
            </div> 
    )
}
export default App

потому что response-static-plugin-реагирующий маршрутизатор уже обернул его с маршрутизатором

Другие вопросы по тегам