title: How to import constants from another file on TypeScript?
body: <p>This is embarrassing to ask, but I'm trying to separate all constants into a new file and just import it, to keep things clean. However, nothing I've tried works, and all other questions here on SO seem to revolve around importing classes and functions. </p>
  
  <p>I have a file called <code>constants.tsx</code>, where all the constants are declared:</p>
  
  <pre><code>export const default_bg               = "#2456a5"
  export const default_light_font_color = "white"
  export const default_lg_font_size     = 11
  export const default_md_font_size     = 10
  export const default_sm_font_size     = 9
  export const default_dark_font_color  = "#000028"
  export const default_font             = "arial"
  </code></pre>
  
  <p>And a main file with all the functionality so far, <code>App.tsx</code>:</p>
  
  <pre><code>import * as React from 'react';
  import { Header } from './Header';
  import { Body } from './Body';
  
  import * as defaults from 'constants'
  
  ...
  </code></pre>
  
  <p>However, <code>defaults</code> (or any other name I give the import) doesn't seem to contain the constants. Writing <code>defaults.default_bg</code> gives me this error:</p>
  
  <blockquote>
    <p>TS2339: Property 'default_bg' does not exist on type 'typeof
    import("constants")'.</p>
  </blockquote>
  
  <p>And <code>console.log(defaults)</code> prints:</p>
  
  <p><a href="https://i.stack.imgur.com/CP0u5.png" rel="noreferrer"><img src="https://i.stack.imgur.com/CP0u5.png" alt="enter image description here"></a></p>
  
  <p>I know this is probably extremely simple, but I can't figure out how to do this. I'm new to Typescript and Javascript in general.</p>