I have used frappe-js-sdk to create the following page in Nuxt 3.
<template>
<div>
{{ notes }}
</div>
</template>
<script setup>
import { FrappeApp } from "frappe-js-sdk"
const runTimeConfig = useRuntimeConfig()
const frappe = new FrappeApp(runTimeConfig.apiBase, {
useToken: true,
token: () => runTimeConfig.apiSecret,
type: "token",
});
const db = frappe.db();
const notes = await db.getDocList("Note", {
fields: ["name", "content"]
});
</script>
<script>
definePageMeta({layout: "default"});
</script>
This works perfectly fine. But how do I convert this section to either a plugin or composable so that I do not have to repeat it on every component or page I create?
import { FrappeApp } from "frappe-js-sdk"
const runTimeConfig = useRuntimeConfig()
const frappe = new FrappeApp(runTimeConfig.apiBase, {
useToken: true,
token: () => runTimeConfig.apiSecret,
type: "token",
});
const db = frappe.db();
Can someone guide me in the right direction.
Even though I am new to programming and JS, I have managed to make reusable composables. But unable to figure this out.