title: react-native - *.js importing *.ts file
body: <p>How to allow <code>*.js</code> files to import <code>*.ts</code> files in <code>react-native</code> but <strong>without rename of any of two files</strong>?</p>
  
  <p>we want to import below <code>src/lib/setGlobalStyle</code><strong>.ts</strong> file from the <code>src/App</code><strong>.js</strong></p>
  
  <pre><code>//MIT LICENSE from: https://github.com/Ajackster/react-native-global-props
  
  import React from 'react'
  import { StyleProp, ViewStyle } from 'react-native'
  
  
  export function setGlobalStyle(obj, customProps) {
   const oldRender = obj.prototype.render;
    const initialDefaultProps = obj.prototype.constructor.defaultProps;
    obj.prototype.constructor.defaultProps = {
      ...initialDefaultProps,
      ...customProps,
    }
    obj.prototype.render = function render() {
      let oldProps = this.props;
      this.props = { ...this.props, style: [customProps.style, this.props.style] };
      try {
        return oldRender.apply(this, arguments);
      } finally {
        this.props = oldProps;
      }
    };
  }
  </code></pre>
  
  <p>but below import which is inside <code>App</code><strong>.js</strong> only works when we rename the <code>setGlobalStyle</code><strong>.ts</strong> file to <code>setGlobalStyle</code><strong>.js</strong>:</p>
  
  <pre><code>import * as Utils from './lib/setGlobalStyle'
  </code></pre>
  
  <p>and of course the <code>setGlobalStyle</code><strong>.ts</strong> currently does not contain any <code>TypeScript</code> types, that is because we had to remove all and rename it to <strong>.js</strong> so we can continue on the project until this gets an answer.</p>
  
  <p><strong>note</strong>: the reason why we need <code>TypeScript</code> is to allow <code>IDE</code> autocomplete of the parameters (i.e. the <code>customProps</code> argument).</p>