title: How to Properly Export and Import Modules in TypeScript
body: <p><strong><em>Note:</em></strong> <em>I know there are many posts on this topic, and I've reviewed quite a few already without success (please see my references at the bottom of this post).</em></p>
  
  <p>I'm trying to run a very simple test in TypeScript, using Visual Studio Code, where I declare a class in one file and import it into another file. However, I continue to run into an issue where the file I am importing into is not recognizing the methods of the class that I exported from the other file.</p>
  
  <p>The exact error messages that I'm receiving at this point are:</p>
  
  <blockquote>
    <p>[ts] Property 'getFirstName' does not exist on type 'typeof "module-test/src/OtherClass"'.</p>
    
    <p>[ts] Property 'getLastName' does not exist on type 'typeof "module-test/src/OtherClass"'.</p>
  </blockquote>
  
  <p>I'm using Node 9.3.0 and TypeScript 2.6.2.</p>
  
  <p>Many thanks in advance for any guidance that anyone can offer me!</p>
  
  <p><strong>main.ts</strong>
  <div class="snippet" data-lang="js" data-hide="false" data-console="true" data-babel="true">
  <div class="snippet-code">
  <pre class="snippet-code-js lang-js prettyprint-override"><code>import * as Other from "./OtherClass";
  
  class myApp
  {
    public async start()
    {
      console.log("Starting application");
      
      try
      {
        let firstName = await Other.getFirstName();
        console.log("First Name: " + firstName);
        let lastName = await Other.getLastName();
        console.log("Last Name: " + lastName);
      }
      catch (error)
      {
        console.error("Unable to get name: " + error)
      }
      
      console.log("Ending application");
    }
  }
  
  const app = new myApp();
  app.start();</code></pre>
  </div>
  </div>
  </p>
  
  <p><strong>OtherClass.ts</strong></p>
  
  <p><div class="snippet" data-lang="js" data-hide="false" data-console="true" data-babel="false">
  <div class="snippet-code">
  <pre class="snippet-code-js lang-js prettyprint-override"><code>class Other
  {
    getFirstName(): string
    {
      return "John";
    }
  
    getLastName(): string
    {
      return "Doe";
    }
  }
  
  export { Other };</code></pre>
  </div>
  </div>
  </p>
  
  <p><strong>Things I've Tried</strong></p>
  
  <ol>
  <li>Exporting via the declaration</li>
  </ol>
  
  <p><div class="snippet" data-lang="js" data-hide="false" data-console="true" data-babel="true">
  <div class="snippet-code">
  <pre class="snippet-code-js lang-js prettyprint-override"><code>export class Other
  {
    getFirstName(): string
    {
      return "John";
    }
  
    getLastName(): string
    {
      return "Doe";
    }
  }</code></pre>
  </div>
  </div>
  </p>
  
  <ol start="2">
  <li>Exporting the individual functions</li>
  </ol>
  
  <p><div class="snippet" data-lang="js" data-hide="false" data-console="true" data-babel="true">
  <div class="snippet-code">
  <pre class="snippet-code-js lang-js prettyprint-override"><code>class Other
  {
    export function getFirstName(): string
    {
      return "John";
    }
  
    export function getLastName(): string
    {
      return "Doe";
    }
  }</code></pre>
  </div>
  </div>
  </p>
  
  <ol start="3">
  <li>Multiple export statements</li>
  </ol>
  
  <p><div class="snippet" data-lang="js" data-hide="false" data-console="true" data-babel="true">
  <div class="snippet-code">
  <pre class="snippet-code-js lang-js prettyprint-override"><code>module.exports = Other;
  export { Other };
  export * from "OtherClass";</code></pre>
  </div>
  </div>
  </p>
  
  <ol start="4">
  <li>Multiple import statements</li>
  </ol>
  
  <p><div class="snippet" data-lang="js" data-hide="false" data-console="true" data-babel="false">
  <div class="snippet-code">
  <pre class="snippet-code-js lang-js prettyprint-override"><code>import * as Other from "./OtherClass";
  import { Other } from "./OtherClass";</code></pre>
  </div>
  </div>
  </p>
  
  <p><strong>Configuration Files</strong>
  <strong>package.json</strong></p>
  
  <p><div class="snippet" data-lang="js" data-hide="false" data-console="true" data-babel="true">
  <div class="snippet-code">
  <pre class="snippet-code-js lang-js prettyprint-override"><code>{
    "name": "module-test",
    "version": "1.0.0",
    "description": "Simple test of exporting and importing modules",
    "main": "./lib/main.js",
    "scripts": {
      "test": "echo \"Error: no test specified\" &amp;&amp; exit 1"
    },
    "author": "John Doe",
    "license": "ISC",
    "dependencies": {
      "typescript": "^2.6.2"
    },
    "devDependencies": {
      "@types/node": "^8.5.2",
      "@types/typescript": "^2.0.0"
    }
  }</code></pre>
  </div>
  </div>
  </p>
  
  <p><strong>tsconfig.json</strong></p>
  
  <p><div class="snippet" data-lang="js" data-hide="false" data-console="true" data-babel="false">
  <div class="snippet-code">
  <pre class="snippet-code-js lang-js prettyprint-override"><code>{
    "compilerOptions": {
      /* Basic Options */
      "target": "es2016",                          /* Specify ECMAScript target version: 'ES3' (default), 'ES5', 'ES2015', 'ES2016', 'ES2017', or 'ESNEXT'. */
      "module": "commonjs",                     /* Specify module code generation: 'none', 'commonjs', 'amd', 'system', 'umd', 'es2015', or 'ESNext'. */
      "outDir": "./lib/",                        /* Redirect output structure to the directory. */
      "strict": true,                            /* Enable all strict type-checking options. */
      "inlineSourceMap": true,               /* Emit a single file with source maps instead of having a separate file. */
      "inlineSources": true                 /* Emit the source alongside the sourcemaps within a single file; requires '--inlineSourceMap' or '--sourceMap' to be set. */
    }
  }</code></pre>
  </div>
  </div>
  </p>
  
  <p><strong>Articles Referenced</strong></p>
  
  <ul>
  <li><a href="https://stackoverflow.com/questions/44377686/property-server-does-not-exist-on-type-typeof-http">Property &#39;Server&#39; does not exist on type &#39;typeof &quot;http&quot;&#39;</a></li>
  <li><a href="https://stackoverflow.com/questions/37395114/node-js-es6-how-to-export-class-from-module">Node.js ES6 how to export class from module?</a></li>
  <li><a href="https://stackoverflow.com/questions/16383795/difference-between-module-exports-and-exports-in-the-commonjs-module-system">Difference between &quot;module.exports&quot; and &quot;exports&quot; in the CommonJs Module System</a></li>
  <li><a href="https://stackoverflow.com/questions/27852111/how-to-properly-create-and-import-node-modules-in-typescript">how to properly create and import node modules in typescript</a></li>
  <li><a href="https://stackoverflow.com/questions/28914303/typescript-export-and-import-modules">TypeScript - Export and import modules</a></li>
  <li><a href="https://www.typescriptlang.org/docs/handbook/modules.html" rel="noreferrer">https://www.typescriptlang.org/docs/handbook/modules.html</a></li>
  </ul>