title: required url param on React router v5 with typescript, can be undefined
body: <p>I am using react-router v5.1 with TypeScript and have this route configurations: </p>
  
  <pre class="lang-js prettyprint-override"><code>&lt;Router basename="/" hashType="slash"&gt;
      &lt;Switch&gt;
          &lt;Route path="/token/:tokenName"&gt;
              &lt;TokenPage /&gt;
          &lt;/Route&gt;
      &lt;/Switch&gt;
  &lt;/Router&gt;
  
  </code></pre>
  
  <p>and I try to access the url param (tokenName) in the component, with useParams hook like so:</p>
  
  <pre class="lang-js prettyprint-override"><code>const TokenPage: FC&lt;TokenPageProps&gt; = props =&gt; {
      const { tokenName } = useParams()
      ...
  }
  
  </code></pre>
  
  <p>However, typescript thinks that <code>tokenName</code> param can be undefined:</p>
  
  <p><a href="https://i.stack.imgur.com/7Dh7Q.png" rel="noreferrer"><img src="https://i.stack.imgur.com/7Dh7Q.png" alt="wrong tokenName typing"></a></p>
  
  <p>which does not make sense since react router won't match this route if the param is missing in the URL.</p>
  
  <p>How can I fix the typing in that situation?</p>