title: React Router Dom is not working only the route path is changing on the url but the components are not rendering and also i am using saleor framework
body: <p>here is the route page named as <strong>Approutes.tsx</strong></p>
  <pre><code>import { BrowserRouter as Router,Route, Switch } from &quot;react-router-dom&quot;;
  import  Test1 from &quot;../../components/Test/Test1&quot;;
  import About from &quot;../../components/About/About&quot;;
  
  
  export const Routes: React.FC = () =&gt; (
  &lt;Router&gt;
    &lt;Switch&gt;
    &lt;Route exact path='/test' component={Test}/&gt;
    &lt;Route exact path='/aboutus' component={About}/&gt;
    &lt;/Switch&gt;
  &lt;/Router&gt;
  )
  </code></pre>
  <p>the <strong>About.tsx</strong> file</p>
  <pre><code>import * as React from 'react'
  
  
  const About: React.FC=()=&gt;{
      return(
          &lt;div&gt;&lt;h2&gt;About US PAGE&lt;/h2&gt;&lt;/div&gt;
      )
  }
  export default About;
  </code></pre>
  <p>the <strong>Test.tsx file</strong></p>
  <pre><code>const Test: React.FC=()=&gt;{
      return(
          &lt;div&gt;&lt;h2&gt;Test PAGE&lt;/h2&gt;&lt;/div&gt;
      )
  }
  export default Test;
  </code></pre>
  <p><em>there is no error but still the components are not rendering also i am editing on the saleor-storefront framework with ts</em></p>
  <p><em>i think there is some problem with the tsconfig.json for the paths</em>
  the components are in the
  <strong>src/components/Test/Test1</strong>
  <strong>src/components/About/About</strong></p>
  <pre><code>{
    &quot;compilerOptions&quot;: {
      &quot;baseUrl&quot;: &quot;.&quot;,
      &quot;esModuleInterop&quot;: true,
      &quot;module&quot;: &quot;commonjs&quot;,
      &quot;jsx&quot;: &quot;react&quot;,
      &quot;lib&quot;: [&quot;es2017&quot;, &quot;dom&quot;, &quot;esnext&quot;],
      &quot;sourceMap&quot;: true,
      &quot;target&quot;: &quot;es6&quot;,
      &quot;noUnusedLocals&quot;: true,
      &quot;paths&quot;: {
        &quot;@components/*&quot;: [&quot;./src/@next/components/*&quot;],
        &quot;@components/atoms&quot;: [&quot;./src/@next/components/atoms/index.ts&quot;],
        &quot;@components/molecules&quot;: [&quot;./src/@next/components/molecules/index.ts&quot;],
        &quot;@components/organisms&quot;: [&quot;./src/@next/components/organisms/index.ts&quot;],
        &quot;@components/templates&quot;: [&quot;./src/@next/components/templates/index.ts&quot;],
        &quot;@components/containers&quot;: [&quot;./src/@next/components/containers/index.ts&quot;],
        &quot;@pages&quot;: [&quot;./src/@next/pages/index.ts&quot;],
        &quot;@styles&quot;: [&quot;./src/@next/globalStyles/index.ts&quot;],
        &quot;@styles/*&quot;: [&quot;./src/@next/globalStyles/*&quot;],
        &quot;images/*&quot;: [&quot;./src/images/*&quot;],
        &quot;@utils/*&quot;: [&quot;./src/@next/utils/*&quot;],
        &quot;@hooks&quot;: [&quot;./src/@next/hooks/index.ts&quot;],
        &quot;@hooks/*&quot;: [&quot;./src/@next/hooks/*&quot;],
        &quot;@types&quot;: [&quot;./src/@next/types/index.ts&quot;],
        &quot;@types/*&quot;: [&quot;./src/@next/types/*&quot;],
        &quot;@app/*&quot;: [&quot;./src/@next/*&quot;],
        &quot;@locale/*&quot;: [&quot;./locale/*&quot;],
        &quot;@temp/*&quot;: [&quot;./src/*&quot;]
      },
      &quot;resolveJsonModule&quot;: true,
      &quot;skipLibCheck&quot;: true
    },
    &quot;exclude&quot;: [&quot;node_modules&quot;]
  }
  </code></pre>