路由，通用应用程序(Nodejs，React)，错误(0，_reactRouter.match)不是函数 [英] Routing, Universal apps (Nodejs, React), Error (0 , _reactRouter.match) is not a function

问题描述

我无法修复此错误...我启动服务器，一切正常，因为我刷新了 localhost:3000然后它告诉我一个错误:

I can't fix this error... I start server, everything is ok, since I refresh localhost:3000 Then it show me an error:

TypeError: (0 , _reactRouter.match) 不是函数

TypeError: (0 , _reactRouter.match) is not a function

我已经安装了react-router":^4.0.0"

I have installed "react-router": "^4.0.0"

import Express from 'express';
import {RouterContext, match} from 'react-router';
import {renderToString } from 'react-dom/server';
import React from 'react';
import routes from './routes.js'



var app = new Express();
app.set('view engine', 'ejs');
app.set('views',__dirname);


//////////////////////////////////////////////////////////////////////
app.get('*', (req, res) => {
    match(
        { routes, location: req.url },
        (err, redirectLocation, renderProps) => {

            if (err) {
                return res.status(500).send(err.message);
            }

            if (redirectLocation) {
                return res.redirect(302, redirectLocation.pathname + redirectLocation.search);
            }

            var markup;
            if (renderProps) {
                // if the current route matched we have renderProps
                markup = renderToString(<RouterContext {...renderProps}/>);
            } else {
                // otherwise we can render a 404 page
                markup = renderToString(<NotFoundPage/>);
                res.status(404);
            }

            // render the index template with the embedded React markup
            return res.render('index', { markup });
        }
    );
});
//////////////////////////////////////////////////////////////////////////////////


var port = process.env.PORT || 3000;
app.listen(port, ()=>{
    console.log('Server is listening on port ' + port );
});

推荐答案

如果您在 v4 之前使用 react router，您的代码看起来是正确的，但是 react-router v4 在整个代码库中发生了重大变化，包括服务器渲染的方法.在 v4 中，有一个专门用于服务器渲染的新组件 - StaticRouter.

Your code looks correct if you used react router prior to v4, but react-router v4 has breaking changes throughout the codebase, including the method for server rendering. In v4, there is a new component specifically for server rendering - StaticRouter.

在此处查看服务器渲染的文档:https://reacttraining.com/react-router/web/guides/server-渲染

Take a look at the documentation here for Server rendering: https://reacttraining.com/react-router/web/guides/server-rendering

如果您仍然想使用 match 功能，您可以使用低于版本 4 的 react-router 版本.看看我在 昨天非常相似的问题，您可能使用相同的样板/以另一个 OP 为例.

If you would still like to use the match function as you have it, you could use a version of react-router below version 4. Take a look at my answer on a very similar question from yesterday, you might be using the same boilerplate/example as the other OP.

这篇关于路由，通用应用程序(Nodejs，React)，错误(0，_reactRouter.match)不是函数的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！