title: Unable to set up the new Faker library
body: <p>I am trying to set up the new <a href="https://github.com/faker-js/faker" rel="nofollow noreferrer">@faker-js/faker</a> library. So far, I did this:</p>
  <pre><code>npm i @faker-js/faker -D
  </code></pre>
  <p>Added <code>faker.d.ts</code> at the top level. So the tree is like this:</p>
  <p><a href="https://i.stack.imgur.com/Hkzh8.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/Hkzh8.png" alt="enter image description here" /></a></p>
  <p><code>faker.d.ts</code> contents is this:</p>
  <pre><code>// faker.d.ts
  declare module '@faker-js/faker' {
    import faker from 'faker';
    export default faker;
  }
  </code></pre>
  <p>I am trying to use the mock like this:</p>
  <pre><code>import faker from 'faker';
  
  import { ParameterMessage } from 'packages/ts/container/Parameter';
  
  export const Parameter: ParameterMessage = { id: faker.dataType.uuid };
  </code></pre>
  <p>But am keep getting an error, saying</p>
  <blockquote>
  <p>Cannot find module 'faker' or its corresponding type declarations.ts(2307)</p>
  <p>Unable to resolve path to module 'faker'.</p>
  </blockquote>
  <p>I am also getting this in <code>faker.d.ts</code></p>
  <blockquote>
  <p>File '/home/aironside@ant.local/Documents/microfrontends/telegram-manager/src/faker.d.ts' is not a module.</p>
  </blockquote>
  <p>When hovering over <b>'faker'</b> in <code>import faker from 'faker';</code></p>
  <p>What am I missing?</p>
  <p><a href="https://codesandbox.io/s/amazing-smoke-qx63t?file=/src/App.tsx" rel="nofollow noreferrer">Here</a> is a reproduced sandbox</p>