Scaffolding components in JSS apps

Creating new components is a common task while developing JSS applications.

To make it easy to create components, JSS Next.js sample applications provide a scaffolding script that you can invoke with the JSS CLI. Running the following command in the root of your JSS head app will create a new component file named ComponentName.tsx:

jss scaffold ComponentName

By default, the command creates the component file in the folder src/components/ within your app. If you want to create a new component in a subfolder of this location instead, you can specify that subfolder as part of the command. The following example creates a file named SecondComponentName.tsx in the folder src/components/seo/:

jss scaffold seo/SecondComponentName

When you build your application with jss build, the Component Builder located at src/temp/componentBuilder.ts is updated to import and map any new components within the src/components/ folder.