Typescript / React started getting a lot of "variableName undefined"

Question

I'm not sure what has changed, maybe this is even related to babel, but I started getting errors like UserControler_1is undefined when I use things like this

UserControler.ts

export function signOut() { console.log("Sign Out") }

Page.tsx

import * as React from "react;
import { signOut } from "./UserControler";
import { TouchableWithoutFeedback, Text } from "react-native";

class Page extends React.Component {
  _signOut = () => signOut()

  render() {
    return (
      <TouchableWithoutFeedback onPress={this._signOut}>
         <Text>Sign Out</Text>
      </TouchableWithoutFeedback>
    )
  }
}

The above errors, such as

UserControler_1 - undefined

Sometimes these are errors more specifically ie

Unable to find variable: signOut

The strangest thing is that if I changed the code to something like this, it works fine

import * as React from "react;
import { signOut } from "./UserControler";

class Page extends React.Component {    
  render() {
    return (
     <TouchableWithoutFeedback onPress={() => signOut}>
       <Text>Sign Out</Text>
     </TouchableWithoutFeedback>
    )
  }
}

Very confused here

My tsconfig

{
  "compilerOptions": {
    "moduleResolution": "node",
    "module": "es6",
    "target": "es6",
    "lib": ["es7"],
    "allowJs": true,
    "checkJs": true,
    "jsx": "react-native",
    "removeComments": true,
    "outDir": "./dist",
    "typeRoots": ["node_modules/@types", "./typings"],
    "noFallthroughCasesInSwitch": true,
    "noImplicitReturns": true,
    "noUnusedLocals": true,
    "noUnusedParameters": true,
    "allowSyntheticDefaultImports": true,
    "strict": true
  },
  "exclude": ["./node_modules", "./android", "./ios", "./__tests__", "./dist", "./__mocks__"],
  "include": ["./src"]
}

This happens in the dist folder, from where babel draws its files and therefore makes the application work, my babelrc

{
  "presets": ["react-native"]
}

Answer 1

, typescript ​​ 2.7.1 - , , 2.7.2 . ( , , ).

: https://github.com/Microsoft/TypeScript/issues/21478

Answer 2

<TouchableWithoutFeedback onPress={() => signOut}>

, signOut, , . , = > , .

 _signOut = () => signOut()

  render() {
    return (
      <TouchableWithoutFeedback onPress={this._signOut}>

, _signOut , signOut(), . , , , , , .

-

 _signOut = () => signOut

  render() {
    return (
      <TouchableWithoutFeedback onPress={this._signOut}>

, , , .

, fuctions : fooobar.com/questions/1693483/...

Answer 3

,

_signOut = () => signOut()

:

_signOut = () => signOut

...