ストーリーブックw / react-router - <link>外<router>を使用しないでください。

問題に解決策を投稿しています

React-Routerを使ったアプリケーションは問題のあるストーリーブックなしで機能しましたが、「不変に失敗しました：外部では使用しないでください」というエラーが発生しました。

Error: Invariant failed: You should not use <Link> outside a <Router>
    at invariant (tiny-invariant.esm.js:11)
    at react-router-dom.js:181
    at updateContextConsumer (react-dom.development.js:19747)
    at beginWork$1 (react-dom.development.js:20079)
    at HTMLUnknownElement.callCallback (react-dom.development.js:358)
    at Object.invokeGuardedCallbackDev (react-dom.development.js:410)
    at invokeGuardedCallback (react-dom.development.js:463)
    at beginWork$$1 (react-dom.development.js:25730)
    at performUnitOfWork (react-dom.development.js:24631)
    at workLoopSync (react-dom.development.js:24613)
 _

アプリが働いていたので、奇妙な（そして外部には使用されていなかった）。

javascriptreactjsreact-routerstorybook

2019/11/18Natan Williams

ストーリーブックワークションのバージョン6.1の場合 StoryBook-Router 新しいコード表記の場合。これが単一のコンポーネントの例です。

import React from 'react';
import StoryRouter from 'storybook-react-router';
import //your component// from //component location//

export default {
  title: '//your component//',
  component: //your component//,
  decorators: [StoryRouter()],
};

export const Name = () => <//your component// />;
 _

2021/01/21Web-ski