title: TypeScript React Native String literal assignment error
body: <p>I have been getting a very strange error with regards to TypeScript telling me string literals do not match. (TypeScript v1.8)</p>
  
  <pre><code>import { Component } from "react";
  import {
    StyleSheet,
    Text,
    View
  } from "react-native";
  
  const styles = StyleSheet.create({
    container: {
      flex: 1,
      justifyContent: "center",
      alignItems: "center",
      backgroundColor: "#F5FCFF",
    },
    welcome: {
      fontSize: 20,
      textAlign: "center",
      margin: 10,
    }
  });
  
  export class App extends Component&lt;any, any&gt; {
    render() {
      return (
        &lt;View style={styles.container}&gt;
          &lt;Text style={styles.welcome}&gt;
            Welcome to React Native!
          &lt;/Text&gt;
        &lt;/View&gt;
      );
    }
  }
  </code></pre>
  
  <p><strong>Error:</strong></p>
  
  <pre><code>src\client\index.ios.tsx(19,15): error TS2322: Type '{ fontSize: number; textAlign: string; margin: number; }' is not assignable to type 'TextStyle'.
    Types of property 'textAlign' are incompatible.
      Type 'string' is not assignable to type '"auto" | "left" | "right" | "center"'.
        Type 'string' is not assignable to type '"center"'.
  </code></pre>
  
  <p>I installed the correct typings. It seems that the following does not work in TypeScript.</p>
  
  <pre><code>interface Test {
    a: "p" | "q"
  }
  
  let x : Test;
  let y = {
    a: "p"
  }
  
  x = y;
  </code></pre>
  
  <p>Source: <a href="https://blog.lopezjuri.com/2015/12/30/react-native--typescript/" rel="nofollow noreferrer">https://blog.lopezjuri.com/2015/12/30/react-native--typescript/</a></p>