Step 1: Given that you have not cloned the existing repository yet.

git clone [email protected]:agentimage-clients/sc-semicustom-demo.com.git

Step 2: Create a Branch

git checkout -b 'Branch_Name'

(Optional). How to Upgrade Nodejs to version 22.

Add to Laragon Quick Add

    *node-22=https://nodejs.org/dist/v22.11.0/node-v22.11.0-x64.msi

For people who are not using Laraging Terminal just download and install https://nodejs.org/en/download 

• Video link here 

Select Nodejs version on laragon and restart laragon

Step 3: Start Building Theme With Vite.

Watch video below

Open vite.config.js, find the following line:

const themeName = process.env.THEME_NAME;
 

and replace it with:

const themeName = 'theme-folder-name';

Run npm Command

With vite it leverage the uses of node packages.

If first Time to use node on site npm install is required for necessary packages for node.

npm install
 

Watch file changes and output unminified version of your assets if you are developing a theme this is useful so you will not need to run build everytime you make file changes

npm run dev
 

Minified and build all assets needed. this is being use once you are done on everything

npm run build

Video link here 

To enqueue

In this example you created new file called newFile.css and newFile.js scss will automatically build an css file for you to enqueue under assets/css for css and assets/js for js. Below is the sample code.

wp_enqueue_style( 'new theme file', get_template_directory_uri().'/assets/css/newFile.scss' );
wp_enqueue_script('aios-starter-theme-script', get_template_directory_uri() . '/assets/js/scripts.js');
 

Step 5: Once you are done editing the files, add or stage your changes.

git add .

Step 6: Commit the changes you’ve made.

git commit -m '<commit_message>'

Step 7: Push your changes.

git push origin 'Branch_Name'

Step 8: Create Merge Request.

https://gitlab.forge99.com/your_project_group/your_project_url