컴퍼넌트의 병아리를 VS Code의 스니펫에 등록해 두면 되겠습니다♪

스니펫 설정 절차

VS Code Code > Preferences > User Snippets

tsx 파일 스 니펫을 만들 때 typescriptreactVS Code는 스니펫을 파일 유형별로 json 파일로 관리합니다.

다음을 copipe
다음은 React Native의 구성 요소의 예입니다. 원하는대로 변경하십시오.

{
    "React Native Component": {
        "prefix": "react-native-component",
        "body": [
            "import React from \"react\";",
            "import { View, StyleSheet } from \"react-native\";",
            "",
            "type Props = {};",
            "",
            "export const ${TM_FILENAME_BASE}: React.FC<Props> = ({}) => {",
            "\treturn (",
            "\t\t<View style={styles.container}>",
            "\t\t\t<View />",
            "\t\t</View>",
            "\t)",
            "};",
            "",
            "const styles = StyleSheet.create({",
            "\tcontainer: {}",
            "});"
        ],
        "description": "React Native component"
    }
}

스니펫 사용

에디터로 react-native-component 라고 박아 Tab 키.

스니펫이 삽입됩니다!
구성 요소 이름은 파일 이름이 자동으로 반영됩니다.