Extend Safḥa from git repository

Extending Safḥa from a git repository is another viable option. It, however, requires a bit more setup than using Safḥa as a module dependency.

Steps

Fork the Safḥa repository on GitHub. You can do this by clicking the "Fork" button on the top right corner of the repository page.

WARNING

Make sure you mark the repository as private.

Create a new Nuxt project if you don't have one already. You can create a new Nuxt project using the following command:

pnpx create-nuxt-app my-nuxt-app
cd my-nuxt-app

Add the following code to your nuxt.config.js file:

export default defineNuxtConfig({
	extends: ['github:<username>/<reponame>'],
	/// ... other nuxt config
});

Modify app.vue and replace it with the following code:

<template>
	<SafhaApp>
		<SafhaLoadingIndicator />
		<SafhaToaster />
		<SafhaLayout />
	</SafhaApp>
</template>

Run the following command to start the development server:

pnpm dev

Caveats

Dependencies

One of the issues using this method is that you have to manage the underlying dependencies of Safḥa yourself. This can be a bit cumbersome, since your need to keep track of the dependencies and update them manually. To circumvent this issue, you can install safha as a module dependency from the git repository. So in addition to the steps above, you need to add the following code to your package.json file:

"devDependencies": {
	// ... other packages
	"@kalimah-apps/safha": "github:<username>/<reponame>"
}

Then run the following command to install the dependencies:

pnpm install

This will install the dependencies of Safḥa in your project, so you don't have to manage them yourself.

Permissions

This method requires you to have the necessary setup and permissions to access the repository. You need to create Personal Access Token (PAT) with the necessary permissions to access the repository. You can create a PAT by following the instructions here.

TIP

You need to give PAT Contents and Metadata repository permissions.

Once you have created the PAT, create a .env file in the root of your project and add the following code:

GIGET_AUTH=your_personal_access_token

---

Another solution to extend Safḥa by adding {install: true} options.

export default defineNuxtConfig({
	extends: ['github:<username>/<reponame>', {install: true}],
	/// ... other nuxt config
});

However this method to seems to be not working as expected. It does not import esm version of the package and causes error in the build process.