boilerplate-sankhya-react-vite

---

Highlights

• React 19 + Vite 7 with TypeScript
• Stable asset names for Sankhya (e.g. assets/app.js, assets/index.css)
• Alias @ → src for clean imports (Vite + TS configured)
• JSP scaffold that loads the built app inside Sankhya as HTML5 component
• Relative assets (base: "./") to support ${BASE_FOLDER} paths
• Optional Tailwind via @tailwindcss/vite
• Auto ZIP after build (dist/sankhya-component.zip) using vite-plugin-zip-pack

Getting Started

pnpm install
pnpm dev

Open http://localhost:5173.

Main entry points:

• src/main.tsx — mounts the app
• src/app/app.tsx — demo UI
• index.html — html demo view

Build for Sankhya

pnpm build

This produces:

• dist/index.jsp — page to be served by Sankhya
• dist/assets/app.js — bundled JS (ESM)
• dist/assets/index.css — styles
• dist/assets/*.svg — logos and images (not inlined)
• dist/sankhya-component.zip — ready to import in Sankhya

Copy the entire dist/ (or only the ZIP) to your HTML5 component folder in Sankhya.

Project Structure

src/
  app/app.tsx        # Demo component
  assets/*           # Logos and images
  global.css         # Global styles (Tailwind ready)
  main.tsx           # App entry
  services/sankhya/  # Sankhya service layer (API, Database, Page utils)
public/
  index.jsp          # JSP scaffold used in Sankhya
vite.config.ts       # Build config (stable outputs, base "./", zip pack)

Documentation

• Sankhya Service Layer Documentation — Complete guide to the service layer, including API reference, usage examples, and React Context integration.

NPM Scripts

• pnpm dev — start Vite dev server
• pnpm build — typecheck + production build + ZIP
• pnpm preview — preview production build

Sankhya Notes

• public/index.jsp calls <snk:load/>, which injects Sankhya's native runtime (window.executeQuery, openApp, openLevel, refreshDetails, openPage). The service layer prefers these native helpers and only falls back to direct service.sbr calls when they are absent (e.g. localhost dev).
• Assets use relative URLs (base: "./") so ${BASE_FOLDER} works in JSP.
• Small images are not inlined (assetsInlineLimit: 0) so they exist as physical files in dist/assets.
• If your Sankhya environment doesn’t support <script type="module">, add @vitejs/plugin-legacy and load the legacy bundle in index.jsp.

FAQ

Logos aren’t loading inside Sankhya

• Ensure you’re using the built files from dist/ (not the dev server URLs).
• Check that your component path resolves ${BASE_FOLDER}/assets/* correctly.

How do I change the output names?

• See vite.config.ts → build.rollupOptions.output.

Contributing

PRs are welcome! Please lint and keep changes focused.

License

MIT © 2025

---

Built with ☕ by M.S.