npm package: @phaserquick/vite-plugins
Description: <h1>phaserquick vite plugins</h1>
Latest version: 1.0.21

<h1>phaserquick vite plugins</h1>

<img src="https://raw.githubusercontent.com/philipgriffin/url-demo/main/logo.png" width="600"/>

<h1>Overview</h1>

A collection of useful vite plugins for Phaser development. Checkout the main [phaserquick](https://github.com/philipgriffin/phaserquick) repo for more easy to use packages.

- [1. Build Information](#1-build-information)
  - [1.1. Usage](#11-usage)
    - [1.1.1. Installation](#111-installation)
    - [1.1.2. Example `vite.config.ts`](#112-example-viteconfigts)
    - [1.1.3. Example Application Usage](#113-example-application-usage)
    - [1.1.4. Version Schema](#114-version-schema)
    - [1.1.5. Typings](#115-typings)
  - [1.2. Options](#12-options)
    - [1.2.1. Dependencies](#121-dependencies)
      - [1.2.1.1. Example `vite.config.ts`](#1211-example-viteconfigts)
    - [1.2.2. Example Application Usage](#122-example-application-usage)

# 1. Build Information

This plugin provides additional build information an embeds this into the `index.html` making it available at `window.version`.

## 1.1. Usage

### 1.1.1. Installation

```bash
npm i @phaserquick/vite-plugins
```

### 1.1.2. Example `vite.config.ts`

```typescript
import { getBuildInfo } from '@phaserquick/vite-plugins';

export default {
  //...
  plugins: [getBuildInfo()]
};
```

### 1.1.3. Example Application Usage

```ts
const version = window.version;

console.log(version.buildTimestamp); // "2024-03-16T03:04:24.382Z"
console.log(version.commit); // "c986ef6f" or undefined if not using source control
```

### 1.1.4. Version Schema

```ts
{
  // Version related information for this game.
  version: {
    // Timestamp of the build for version tracking.
    buildTimestamp: string;
    // Optional commit hash associated with the build.
    commit?: string | null;
    // Dependencies used in the application, stored as key-value pairs.
    dependencies: {
      [key: string]: string;
    }
  }
}

```

### 1.1.5. Typings

If not using the [`phaserquick` boilerplate](https://phaserquick.philscode.com), you can configure the below typings for the window object to utilise autocomplete within TypeScript.

```ts
//global.d.ts
declare global {
  interface Window {
    // Version related information for this game.
    version: {
      // Timestamp of the build for version tracking.
      buildTimestamp: string;
      // Optional commit hash associated with the build.
      commit?: string | null;
      // Dependencies used in the application, stored as key-value pairs.
      dependencies: {
        [key: string]: string;
      };
    };
  }
}
```

## 1.2. Options

### 1.2.1. Dependencies

Passing dependencies to the build information options will include a list of dependencies on the version object. Useful to show you what dependencies are part of the build.

#### 1.2.1.1. Example `vite.config.ts`

```typescript
export default {
  //...
  plugins: [getBuildInfo({ dependencies: 'my-package' })]
};
```

### 1.2.2. Example Application Usage

```ts
const version = window.version;

console.log(version.dependencies); // {"my-package": "3.00.0"}
```