どのように原子の反応ネイティブのコードを書式設定

Question

私はreact-nativeアプリで取り組んでいます。私はreact-nativeアプリの開発のために​​テキストエディタを使用しています。

react-nativeのコードをアトミ​​ックにフォーマットするためのショートカットが見つかりませんでした。私はパッケージhttps://atom.io/packages/atom-beautifyを美化しようとしましたが、動作しません。

import React, { 
    Component 
} from 'react'; 
import { 
    AppRegistry, 
    Image, 
    View, 
    Text, 
    Button, 
    StyleSheet 
} from 'react-native'; 

class SplashScreen extends Component { 
    render() { 
     return (< 
      View style = { 
       styles.container 
      } > 
      < 
      Image source = { 
       require('./img/talk_people.png') 
      } 
      style = { 
       { 
        width: 300, 
        height: 300 
       } 
      } 
      /> < 
      Text style = { 
       { 
        fontSize: 22, 
        textAlign: 'center', 
        marginTop: 30 
       } 
      } > Never forget to stay in touch with the people that matter to you. < /Text> < 
      View style = { 
       { 
        marginTop: 30 
       } 
      } > < Button title = "CONTINUE" 
      color = "#FE434C"/> < /View> < 
      /View> 
     ); 
    } 
} 

const styles = StyleSheet.create({ 
    container: { 
     backgroundColor: '#FFFFFF', 
     margin: 50, 
     alignItems: 'center', 
     flex: 1, 
     flexDirection: 'column' 
    } 
}) 

AppRegistry.registerComponent('Scheduled',() => SplashScreen); 

Answer 1

非常にお勧めしますprettier-atom。

Prettier最近、多くの注目を集めており、正当な理由があります。

これはあなたのスタイルに合うように限られたオプションセットを持つ非常にストレートな、意見のついたJavaScriptフォーマッタです。さらに制御が必要な場合は、オプションのESLintインテグレーションも付属しています。