1
我是比較新的reactjs和測試基本的服務器端渲染與反應路由器v4但我無法越過這個錯誤，一直試圖從幾個小時。我已經嘗試了我在谷歌上找到的每個解決方案，但都沒有人似乎在工作。不可違反：元素類型無效：期望一個字符串（對於內置組件）或類/函數。反應路由器v4
這裏是server.js代碼：
import Express from 'express';
import React from 'react';
import { renderToString } from 'react-dom/server';
import { StaticRouter } from 'react-router'
import MyRoutes from './routes/routes.js';
...
app.get('*', (req, res) => {
let markup = `<!DOCTYPE html>
<html lang="en">
<body>
${renderToString(<StaticRouter location={req.url} context={{}}><MyRoutes/></StaticRouter>)}
</body>
</html>`;
res.write(markup);
res.end();
});
問題似乎是用下面的代碼：
./routes/routes.js代碼：
import React from 'react';
import { Match, Miss } from 'react-router';
const componentTest =() =>
(
<div>
Testing a component
</div>
);
export default() => (
<div>
<Match exactly={true} pattern="/" component={componentTest} />
</div>
);
現在如果我刪除匹配標記線，我得到沒有錯誤的空白頁。 但是，如果那場比賽的口號是那裏我得到以下錯誤：
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.
in Unknown
in Router (created by StaticRouter)
in StaticRouter
Invariant Violation: Element 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. Check the render method of `StatelessComponent`.
at invariant (/home/ubuntu/workspace/node_modules/react-dom/node_modules/fbjs/lib/invariant.js:44:15)
at instantiateReactComponent (/home/ubuntu/workspace/node_modules/react-dom/lib/instantiateReactComponent.js:74:56)
at instantiateChild (/home/ubuntu/workspace/node_modules/react-dom/lib/ReactChildReconciler.js:44:28)
at /home/ubuntu/workspace/node_modules/react-dom/lib/ReactChildReconciler.js:71:16
at traverseAllChildrenImpl (/home/ubuntu/workspace/node_modules/react-dom/lib/traverseAllChildren.js:77:5)
at traverseAllChildren (/home/ubuntu/workspace/node_modules/react-dom/lib/traverseAllChildren.js:172:10)
at Object.ReactChildReconciler.instantiateChildren (/home/ubuntu/workspace/node_modules/react-dom/lib/ReactChildReconciler.js:70:7)
at ReactDOMComponent.ReactMultiChild.Mixin._reconcilerInstantiateChildren (/home/ubuntu/workspace/node_modules/react-dom/lib/ReactMultiChild.js:187:41)
at ReactDOMComponent.ReactMultiChild.Mixin.mountChildren (/home/ubuntu/workspace/node_modules/react-dom/lib/ReactMultiChild.js:226:27)
at ReactDOMComponent.Mixin._createContentMarkup (/home/ubuntu/workspace/node_modules/react-dom/lib/ReactDOMComponent.js:653:32)
任何幫助將非常感激。
在反應路由器V4的最新版本，'Match'已被替換'Route'。 https://reacttraining.com/react-router/web/api/Route 嘗試使用'路線'而不是匹配' –
@TharakaWijebandara工作，非常感謝！ – Zeus