Using Templates
You can create your screens and components with your defined templates by following these steps:
First thing to do is to create a
.templatefolder at the root of your react project.Inside the
.templatefolder you can add your template, for examplecomponentWithUseEffect.tsx(the file extension doesn't matter so it could be*.jsx,*.jsor*.tsx):
import React, { useEffect } from "react";
import { View, Text } from "react-native";
export default function __COMPONENT__() {
useEffect(() => {}, []);
return (
<View>
<Text>Hello, World!</Text>
</View>
);
}
There is a restriction in naming these templates which is you should not put dots (
.) between the name, like this (component.WithUseEffect.jsx). It should only contain one dot that makes the extension file like we're doing above.You should type
__COMPONENT__in the template file and it will be replaced with the component name you want to create.
- After creating your template you can use them to create components or screens as the following:
rnhc create -c <component-name> -t <template-name>
rnhc create -s <screen-name> -t <template-name>
- And of course, you can create multiple components or screens with the same template.
Example
As for our example it can be used like this for the above template:
rnhc create -c comp -t componentWithUseEffect
This will create
compcomponent undersrc/components/folder and theindex.jsxfor this component will contain the same code written in the template.For the screen case, the
index.jsxfor that screen will contain the code written in the template.