title: TypeScript: How to add an absolute path to the root directory to import files from there?
body: <p>I have my TS config:</p>
  <pre><code>{
    &quot;compilerOptions&quot;: {
      &quot;baseUrl&quot;: &quot;.&quot;,
      &quot;paths&quot;: {
      },
      &quot;target&quot;: &quot;es5&quot;,
      &quot;lib&quot;: [&quot;dom&quot;, &quot;dom.iterable&quot;, &quot;esnext&quot;],
      &quot;allowJs&quot;: true,
      &quot;skipLibCheck&quot;: true,
      &quot;strict&quot;: true,
      &quot;forceConsistentCasingInFileNames&quot;: true,
      &quot;noEmit&quot;: false,
      &quot;esModuleInterop&quot;: true,
      &quot;module&quot;: &quot;esnext&quot;,
      &quot;moduleResolution&quot;: &quot;node&quot;,
      &quot;resolveJsonModule&quot;: true,
      &quot;isolatedModules&quot;: true,
      &quot;jsx&quot;: &quot;preserve&quot;
    },
    &quot;include&quot;: [&quot;next-env.d.ts&quot;, &quot;**/*.ts&quot;, &quot;**/*.tsx&quot;, &quot;jest.config.js&quot;],
    &quot;exclude&quot;: [&quot;node_modules&quot;, &quot;.next&quot;, &quot;out&quot;, &quot;build&quot;, &quot;coverage&quot;]
  </code></pre>
  <p>And want to reference a TS file in the root directory for one of my components so it is cleaner:</p>
  <pre><code>import React from 'react';
  import { withTranslation, Link } from '../../../i18n';
  
  const Header = (): JSX.Element =&gt; {
    return (
      &lt;&gt;
        &lt;Flex&gt;
          &lt;Box&gt;
            &lt;Link href=&quot;/&quot;&gt;HOME&lt;/Link&gt;
          &lt;/Box&gt;
        &lt;/Flex&gt;
      &lt;/&gt;
    );
  };
  
  export default Header;
  </code></pre>
  <p>How do I update the <code>tsconfig</code> to reference the i18n absolutely?</p>