Plugin frontend နှင့် backend assets

Static ဖိုင်များကို plugin နှင့်အတူ ပို့ဆောင်ရပါသည် — backend သည် backend/assets/ နှင့် AppFolder ကို အသုံးပြုပြီး၊ frontend URL သည် PluginAssets.network ဖြင့် ရရှိပါသည်။ APP_DATA_FOLDER ကို hardcode မလုပ်ရပါ။ Runtime တွင် asset folder ထဲသို့ မရေးရပါ။

ပန်းတိုင်နှင့် မည်သည့်အခါ အသုံးပြုမည်နည်း

Template၊ seed JSON၊ logo နှင့် plugin package နှင့်အတူ သွားသော read-only ဖိုင်များအတွက် bundled asset ကို အသုံးပြုပါ။ App လည်ပတ်နေစဉ် ဖန်တီး/ပြင်ဆင်သော အရာများအတွက် plugin data folder ကို အသုံးပြုရပါမည်။

Backend read-only — plugins/<name>/backend/assets/
Frontend URL — PluginAssets.network(metadata, relativePath)
Runtime write — AppFolder.getPluginDataFolder; asset folder မဟုတ်ပါ

1. လိုအပ်ချက်များ

metadata.name / pluginVersion ကိုက်ညီသော plugin နှင့် AppFolder / PluginAssets helper များ လိုအပ်ပါသည်။

module.metadata.json — name နှင့် pluginVersion သည် installed bundle နှင့် ကိုက်ညီရပါမည်
Backend — @quan-erp/shared-backend-core (AppFolder)
Frontend — @quan-erp/shared-frontend-core (PluginAssets)
Packed asset ပြောင်းလဲပြီးနောက် rebuild + reinstall (သို့မဟုတ် watch refresh)

Plugin app data →PluginAssets →

2. Backend assets

Read-only ဖိုင်များကို plugins/<name>/backend/assets/ တွင် ထားရှိရပါသည်။ CLI က available/installed plugin များသို့ pack လုပ်ပါသည်။ AppFolder ဖြင့် path ကို resolve လုပ်ရပါမည် — APP_DATA_FOLDER ကို hardcode မလုပ်ရပါ။

Source — plugins/<name>/backend/assets/…
Runtime path — getPluginAssetFolder(name, version)
Writable runtime — getPluginDataFolder(name)
Install ပြီးနောက် asset folder မရေးရပါ — versioned ဖြစ်ပြီး upgrade တွင် အစားထိုးနိုင်ပါသည်

SHsource layout

plugins/<plugin-name>/
└── backend/
    ├── assets/
    │   ├── invoice-template.html
    │   └── seed/
    │       └── defaults.json
    └── src/

TSXread bundled file

import { AppFolder } from "@quan-erp/shared-backend-core";
import metadata from "../../module.metadata.json" with { type: "json" };
import fs from "node:fs/promises";
import path from "node:path";

const assetDir = AppFolder.getPluginAssetFolder(
  metadata.name,
  metadata.pluginVersion,
);
const template = await fs.readFile(
  path.join(assetDir, "invoice-template.html"),
  "utf8",
);

TSXwrite runtime data

const dataDir = AppFolder.getPluginDataFolder(metadata.name);
await fs.mkdir(dataDir, { recursive: true });
await fs.writeFile(path.join(dataDir, "export.csv"), csv, "utf8");

3. Frontend assets

@quan-erp/shared-frontend-core မှ PluginAssets.network(metadata, path) ဖြင့် UI အတွက် absolute URL ကို တည်ဆောက်ရပါသည်။ Relative path ကို တည်ငြိမ်အောင် ထားရှိပြီး package နှင့် ကိုက်ညီအောင် ထားရပါမည်။

PluginAssets ကို @quan-erp/shared-frontend-core မှ import လုပ်ပါ
အခြားနေရာတွင် သုံးသော module.metadata.json ကို ပေးရပါမည်
path သည် stack က expose လုပ်သော packed asset tree နှင့် relative ဖြစ်ရပါမည်

TSXPluginAssets

import { PluginAssets } from "@quan-erp/shared-frontend-core";
import metadata from "../module.metadata.json" with { type: "json" };

export function PluginLogo() {
  const src = PluginAssets.network(metadata, "images/logo.png");
  return <img src={src} alt={metadata.name} />;
}

4. စစ်ဆေးခြင်းနှင့် စည်းမျဉ်းများ

watch / build ပြီးနောက် available-plugins (နှင့် Install ပြီး installed-plugins) တွင် assets ရှိရပါမည်
getPluginAssetFolder resolve ပြီး သိသော relative path ကို readFile အောင်မြင်ရပါမည်
PluginAssets.network က browser တွင် load နိုင်သော URL ပြန်ပေးရပါမည်
Asset များသည် plugin package နှင့် versioned ဖြစ်ပါသည် — ပြောင်းလဲပါက rebuild + reinstall လုပ်ရပါမည်
Durable generated files — getPluginDataFolder; assets မဟုတ်ပါ
Relative path တည်ငြိမ်ရပါမည် — backend AppFolder နှင့် frontend PluginAssets ကိုက်ညီရပါမည်
Isolation — getPluginDataFolder(yourPluginName) အောက်တွင်သာ ရေးရပါမည်; /app-data/… hardcode မလုပ်ရပါ

အဖြစ်များသော အမှားများ

APP_DATA_FOLDER သို့မဟုတ် /app-data/... hardcode လုပ်ခြင်း — AppFolder မသုံးခြင်း
Runtime တွင် export / report ကို asset folder သို့ ရေးခြင်း
Upgrade ပြီးနောက် getPluginAssetFolder သို့ pluginVersion မှားယွင်းပေးခြင်း
Asset ဖိုင် ပြောင်းလဲပြီး rebuild / reinstall (သို့မဟုတ် watch) မလုပ်ခြင်း
Frontend path သည် packed asset relative path နှင့် မကိုက်ညီခြင်း
Durable data ကို app temp folder တွင် သိမ်းခြင်း

Plugin app data →PluginAssets →