TypeScriptがネイティブ文字列リテラル割り当てエラーに反応する

Question

文字列リテラルが一致しないことを示すTypeScriptに関して非常に奇妙なエラーが発生しています。 （活字体v1.8デベロッパー）

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<any, any> { 
    render() { 
    return (
     <View style={styles.container}> 
     <Text style={styles.welcome}> 
      Welcome to React Native! 
     </Text> 
     </View> 
    ); 
    } 
} 

エラー： のsrc \クライアント\のindex.ios.tsx（19,15）：エラーTS2322：型「{のfontSize：数; textAlign：文字列;マージン：数; } 'は' TextStyle '型に割り当てられません。 プロパティ 'textAlign'の型は互換性がありません。 タイプ 'string'はタイプ 'auto'に割り当てられません。 "left" | "右" | "センター"'。 タイプ 'string'はタイプ '' center ''に割り当てられません。

正しいタイピングがインストールされています。 TypeScriptでは、以下は動作しないようです。

interface Test { 
    a: "p" | "q" 
} 

let x : Test; 
let y = { 
    a: "p" 
} 

x = y; 

出典：

<Text style={styles.welcome as any}> 

理由：：タイプはdeclaraitonに基づくと推定される

https://blog.lopezjuri.com/2015/12/30/react-native--typescript/

Answer 1

悲しいことに、あなたはタイプをアサートする必要があります。私は（それ以来、「任意の」を使用して嫌いゲーム後半だけど、ちょうど同じ問題に出くわした、この溶液を好む知っ

let foo = "asdf"; // foo: string 

// Its a string becuase: 
foo = "something else"; // Would be strange if this would error 

Answer 2

ので、文字列リテラルは、（代わりに文字列リテラルの）stringと推測されます時にはそれが唯一の選択肢だが、一種の）、活字体の目的に反し：

import { Component } from "react"; 
import { 
    StyleSheet, 
    Text, 
    View 
} from "react-native"; 

interface Props { 
} 

interface State { 
} 

interface Style { 
    container: React.ViewStyle, 
    welcome: React.TextStyle 
} 

const styles = StyleSheet.create<Style>({ 
    container: { 
    flex: 1, 
    justifyContent: "center", 
    alignItems: "center", 
    backgroundColor: "#F5FCFF", 
    }, 
    welcome: { 
    fontSize: 20, 
    textAlign: "center", 
    margin: 10, 
    } 
}); 

export class App extends Component<Props, State> { 
    render() { 
    return (
     <View style={styles.container}> 
     <Text style={styles.welcome}> 
      Welcome to React Native! 
     </Text> 
     </View> 
    ); 
    } 
} 

我々はビルドエラーを作成するためのスタイルのタイプが解決されているものStyleSheet.createを教えてください。