Installation

This guide covers installing PrintChecks packages for different use cases.

Package Overview

PrintChecks is distributed as three packages:

Package	Description	Use Case
@printchecks/core	Framework-agnostic core library	Node.js, custom frameworks, or when you need full control
@printchecks/vue	Vue 3 composables and integrations	Vue 3 applications
@printchecks/web-components	Framework-agnostic Web Components	Any framework (React, Angular, etc.) or vanilla JS

Prerequisites

• Node.js 18+ (recommended) or 16+
• npm, pnpm, or yarn package manager

Installing @printchecks/vue

For Vue 3 applications, install the Vue package which includes the core library:

npm

npm install @printchecks/vue

pnpm

pnpm add @printchecks/vue

yarn

yarn add @printchecks/vue

Vue Usage

<script setup>
import { usePrintChecks } from '@printchecks/vue'

const { checks, createCheck } = usePrintChecks()
</script>

Installing @printchecks/core

For framework-agnostic usage or when building custom integrations:

npm

npm install @printchecks/core

pnpm

pnpm add @printchecks/core

yarn

yarn add @printchecks/core

Core Usage

import { PrintChecksCore } from '@printchecks/core'

const printChecks = new PrintChecksCore()
const checks = await printChecks.checks.list()

Installing @printchecks/web-components

For framework-agnostic Web Components that work with any framework:

npm

npm install @printchecks/web-components

pnpm

pnpm add @printchecks/web-components

yarn

yarn add @printchecks/web-components

Web Components Usage

<script type="module">
  import '@printchecks/web-components'
</script>

<check-form></check-form>

CDN Usage

For quick prototyping or static sites, use the CDN:

<!-- Via unpkg -->
<script type="module">
  import '@printchecks/web-components' from 'https://unpkg.com/@printchecks/web-components'
</script>

<!-- Via jsDelivr -->
<script type="module">
  import '@printchecks/web-components' from 'https://cdn.jsdelivr.net/npm/@printchecks/web-components'
</script>

TypeScript Support

All packages include TypeScript definitions out of the box. No additional @types packages needed.

import type { Check, BankAccount, Vendor } from '@printchecks/core'

Build Tool Configuration

Vite

No additional configuration needed. PrintChecks works with Vite out of the box.

Webpack

If using webpack, ensure you have the appropriate loaders for TypeScript:

npm install --save-dev ts-loader

Next.js

For Next.js applications, use the core library or web components:

// pages/_app.tsx
import '@printchecks/web-components'

Nuxt 3

For Nuxt 3, install the Vue package:

pnpm add @printchecks/vue

<script setup>
import { usePrintChecks } from '@printchecks/vue'
</script>

Verifying Installation

After installation, verify it works:

import { PrintChecksCore } from '@printchecks/core'

const printChecks = new PrintChecksCore()
console.log('PrintChecks initialized:', printChecks)

If you see no errors, you're ready to go!

Next Steps

• Basic Usage - Learn the fundamentals
• Bank Accounts - Set up your first bank account
• Checks - Create and manage checks
• API Reference - Detailed API documentation