https://github.com/apenab/zebra-print-suite
Suite of utilities to work with Zebra printers
https://github.com/apenab/zebra-print-suite
react typescript vite zebra zebra-label-printers zebra-printer zebratechnologies
Last synced: 22 days ago
JSON representation
Suite of utilities to work with Zebra printers
- Host: GitHub
- URL: https://github.com/apenab/zebra-print-suite
- Owner: apenab
- Created: 2025-10-23T15:20:16.000Z (4 months ago)
- Default Branch: main
- Last Pushed: 2026-01-21T18:55:57.000Z (23 days ago)
- Last Synced: 2026-01-22T07:12:02.190Z (22 days ago)
- Topics: react, typescript, vite, zebra, zebra-label-printers, zebra-printer, zebratechnologies
- Language: TypeScript
- Homepage:
- Size: 240 KB
- Stars: 5
- Watchers: 0
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
Awesome Lists containing this project
README
# zebra-print-suite monorepo
pnpm workspace that hosts two reusable packages and a demo app that consumes them as if they were external dependencies.
## Packages and apps
- [`packages/zebra-web-bridge`](packages/zebra-web-bridge/README.md) – TypeScript SDK that wraps the local Zebra BrowserPrint service. It exposes `getLocalDevices` (with timeout handling, data normalization, and typed errors) and will be the entry point for future methods (`getDefaultDevice`, `send`, etc.). Tested with Vitest.
- [`packages/react-zebra-print`](packages/react-zebra-print/README.md) – React library built on top of the bridge and exposing the `useZebraPrinters` hook. Produces ESM/CJS bundles plus `.d.ts` declarations; depends on the bridge via `workspace:*`.
- `apps/demo` – Vite app that installs `react-zebra-print` as a dependency and showcases the hook.
## Development workflow
**Recommended mode (real package build)**
```bash
pnpm run dev:watch
```
Runs `vite build --watch` in the library and `pnpm --filter demo dev` in parallel. The demo therefore consumes the exact output that would ship to npm, including the `.d.ts` files generated by `vite-plugin-dts`.
**Fast mode (temporary alias)**
You can map `react-zebra-print` to the source code in `apps/demo/vite.config.ts` when you need ultra-fast iterations:
```ts
resolve: {
alias: {
'react-zebra-print': fileURLToPath(new URL('../../packages/react-zebra-print/src', import.meta.url)),
},
}
```
Remove the alias before publishing or validating: this shortcut can duplicate React and hides issues that might appear in the real build.
## Key commands
```bash
pnpm install # install dependencies
pnpm run dev:watch # watch build + demo
pnpm run dev # alias, same behavior
pnpm run build # build the react-zebra-print package
pnpm --filter zebra-web-bridge test
pnpm --filter react-zebra-print test
```
The scripts run from the workspace root thanks to pnpm filters.
## Publishing
1. Make sure both packages compile and emit types:
```bash
pnpm --filter zebra-web-bridge build # add a build script if needed
pnpm --filter react-zebra-print build
```
2. Run the test suites (`pnpm --filter ... test`).
3. Publish each package from the root or per directory (`pnpm publish --filter react-zebra-print --access public`, etc.).
4. Confirm that `packages/react-zebra-print/dist/` contains `index.mjs`, `index.cjs`, and `index.d.ts`; and that `packages/zebra-web-bridge` exposes the expected entry points (currently `src/index.ts`).
## Notes
- `tsconfig.base.json` defines the strict mode that every package inherits.
- Both packages include tests; the demo app acts only as a manual consumer.
- The bridge normalizes the BrowserPrint payload (currently `{ deviceList: [...] }`) while remaining compatible with the legacy type-keyed format.