PHPackages                             mindplay/php-vite - PHPackages - PHPackages  [Skip to content](#main-content)[PHPackages](/)[Directory](/)[Categories](/categories)[Trending](/trending)[Leaderboard](/leaderboard)[Changelog](/changelog)[Analyze](/analyze)[Collections](/collections)[Log in](/login)[Sign up](/register)

1. [Directory](/)
2. /
3. [Utility & Helpers](/categories/utility)
4. /
5. mindplay/php-vite

ActiveLibrary[Utility & Helpers](/categories/utility)

mindplay/php-vite
=================

a lightweight PHP-backend integration for the Vite frontend build tool

1.1.0(7mo ago)6690.5k—2.1%8[1 issues](https://github.com/mindplay-dk/php-vite/issues)2MPL-2.0PHPPHP >=8.1CI passing

Since May 7Pushed 7mo ago2 watchersCompare

[ Source](https://github.com/mindplay-dk/php-vite)[ Packagist](https://packagist.org/packages/mindplay/php-vite)[ RSS](/packages/mindplay-php-vite/feed)WikiDiscussions master Synced 1mo ago

READMEChangelog (1)Dependencies (2)Versions (4)Used By (2)

`mindplay\php-vite`
===================

[](#mindplayphp-vite)

[![PHP Version](https://camo.githubusercontent.com/f870cee2a2e2a442c6b62c8bf79f45ec0ce794dc5af13834902518c9107230f9/68747470733a2f2f696d672e736869656c64732e696f2f62616467652f7068702d382e312532422d626c75652e737667)](https://packagist.org/packages/mindplay/php-vite)[![Build Status](https://github.com/mindplay-dk/php-vite/actions/workflows/ci.yml/badge.svg)](https://github.com/mindplay-dk/php-vite/actions/workflows/ci.yml)[![License](https://camo.githubusercontent.com/0a34271b130f15aa109c3625a51302a3c6b584e3e1df0d19cd53b9741ac02dd5/68747470733a2f2f696d672e736869656c64732e696f2f62616467652f6c6963656e73652d4d504c2d2d322e302d677265656e)](https://opensource.org/license/mpl-2-0)

This library provides a lightweight [backend integration](https://vitejs.dev/guide/backend-integration.html)for your PHP-based MPA, SPA, or PWA based on [Vite](https://vitejs.dev/).

It parses the [build manifest](https://vitejs.dev/config/build-options#build-manifest) (the `.vite/manifest.json` file) and produces the required `` and `` tags to load (and preload) scripts, CSS files, and other assets.

Basic Usage
-----------

[](#basic-usage)

A commented MPA example is available [here](https://github.com/mindplay-dk/php-vite-mpa) - please refer to this for examples of configuring Vite, NPM, TypeScript, and Composer.

In the following steps, we'll cover usage of the library API only.

#### 1. Load the `manifest.json` file created by Vite:

[](#1-load-the-manifestjson-file-created-by-vite)

```
use mindplay\vite\Manifest;

$vite = new Manifest(
    manifest_path: $your_root_dir . '/public/dist/.vite/manifest.json',
    base_path: '/dist/',
    dev: false
);
```

The `manifest_path` points to the Vite `manifest.json` file created for the production build.

In this example, `dev` is `false`, so we'll be creating tags for the production assets.

The `base_path` is relative to your public web root - it is the root folder from which Vite's production assets are served, and/or the root folder from which Vite serves assets dynamically in development mode.

Note that, in development mode (when `dev` is set to `true`) the `manifest.json` file is unused, and not required.

> 💡 *For a detailed description of the constructor arguments, please refer to the `Manifest` constructor argument doc-blocks.*

#### 2. Create the `Tags` for an entry point script:

[](#2-create-the-tags-for-an-entry-point-script)

```
$tags = $vite->createTags("index.ts");
```

Your entry point scripts are defined in Vite's [`build.rollupOptions`](https://vitejs.dev/config/build-options#build-rollupoptions) using RollUp's [`input`](https://rollupjs.org/configuration-options/#input) setting.

Note that, if you have **multiple entry point scripts** on **the same page**, you should pass them in a *single* call - for example:

```
$tags = $vite->createTags("index.ts", "consent-banner.ts");
```

Making multiple calls for different entry points *may* result in duplicate tags for any shared static imports - you will most likely need just *one* instance of `Tags` on a single page.

#### 3. Emit from `Tags` in your HTML template:

[](#3-emit-from-tags-in-your-html-template)

Your `Tags` instance contains the preload and CSS tags, which should be emitted in your `` tag, as well as the `js` tags, which should be emitted immediately before the `` end tag.

For example:

```
>

    Vite App