title: Replace vanilla js with typescript in React
body: <p>Currently, I'm using vaniall js with react. For the type checks, i'm defining the types in a separate folder called <strong>types</strong>. With this i can get code suggestion in vs code. However there are 2 problem i'm still facing with it:</p>
  <ol>
  <li>Auto Import does not work with this.</li>
  <li>If I use non-existence property on an json, it wont throw error. Due to this, sometimes we may end up deploying the code without realizing the issue. Is there a way to fail the build if the json structure does not match with the type defined ?</li>
  </ol>
  <pre class="lang-js prettyprint-override"><code>/**
   * @typedef {Object} ListState
   * @property {Boolean} loading
   * @property {string} error
   * @property {FetchResponse} data
   */
  
  /**
   * @typedef {Object} CreateFirmState
   * @property {Boolean} loading
   * @property {string} error
   * @property {*} data
   */
  
  /**
   * @typedef {Object} UpdateFirmState
   * @property {Boolean} loading
   * @property {string} error
   * @property {*} data
   */
  
  /*
  * @type {UpdateFirmState}
  */
  const myObject = 'hello'
  
  // This above line should throw error because I'm defined myObject to be a string
  
  </code></pre>
  <ol start="3">
  <li>I want to replace the existing vanilla js with the typescript, but not all the files completely. IS there a way to replce file one by one as we move forward or do we have to replace all the files?</li>
  </ol>