PHPackages                             nabasa/vp-wp - 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. nabasa/vp-wp

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

nabasa/vp-wp
============

WordPress integration for Vite+.

v0.3.1(3mo ago)135↓91.7%MITPHPPHP >=7.4CI passing

Since Mar 23Pushed 3mo agoCompare

[ Source](https://github.com/nabasa-dev/vp-wp)[ Packagist](https://packagist.org/packages/nabasa/vp-wp)[ Docs](https://github.com/nabasa-dev/vp-wp)[ RSS](/packages/nabasa-vp-wp/feed)WikiDiscussions main Synced 3w ago

READMEChangelog (5)DependenciesVersions (7)Used By (0)

vp-wp
=====

[](#vp-wp)

[![build status](https://github.com/nabasa-dev/vp-wp/actions/workflows/ci.yml/badge.svg)](https://github.com/nabasa-dev/vp-wp/actions/workflows/ci.yml)[![npm version](https://camo.githubusercontent.com/e5e64b9de07db1a0699335dcd91b6fd1c82da2194691d0389b318be48eb216ea/68747470733a2f2f696d672e736869656c64732e696f2f6e706d2f762f2534306e616261736125324676702d77703f6c6f676f3d6e706d)](https://www.npmjs.com/package/@nabasa/vp-wp)[![npm downloads](https://camo.githubusercontent.com/2110f0fd4eb90912e4d26790dab41ea6441109c34a3d76b2092b08511b228ddb/68747470733a2f2f696d672e736869656c64732e696f2f6e706d2f646d2f2534306e616261736125324676702d77703f6c6f676f3d6e706d)](https://www.npmjs.com/package/@nabasa/vp-wp)[![composer version](https://camo.githubusercontent.com/d81610c4efb0c743e4097f47f0941924af0bf9483b7a547313aabc7dff65b225/68747470733a2f2f696d672e736869656c64732e696f2f7061636b61676973742f762f6e61626173612f76702d77703f6c6f676f3d7061636b6167697374)](https://packagist.org/packages/nabasa/vp-wp)[![composer downloads](https://camo.githubusercontent.com/2e5c52e2d069411c2ad6a6dd997b86ca754ba08de6d19dc1d34c6f65332f6421/68747470733a2f2f696d672e736869656c64732e696f2f7061636b61676973742f64742f6e61626173612f76702d77703f6c6f676f3d7061636b6167697374)](https://packagist.org/packages/nabasa/vp-wp)[![pkg.pr.new](https://camo.githubusercontent.com/34b046478b3b72433e836ca4772edab60327c4d639d0b10d890f274f8d4931ee/68747470733a2f2f706b672e70722e6e65772f62616467652f6e61626173612d6465762f76702d7770)](https://pkg.pr.new/~/nabasa-dev/vp-wp)[![license](https://camo.githubusercontent.com/0c167f856e6c338169554be385674c9d6048fa9d96200ccd99273d409bc4272d/68747470733a2f2f696d672e736869656c64732e696f2f6769746875622f6c6963656e73652f6e61626173612d6465762f76702d7770)](https://github.com/nabasa-dev/vp-wp/blob/main/LICENSE)

`vp-wp` brings a modern Vite+ workflow to WordPress plugins and themes.

Use it to build and serve frontend assets with WordPress-friendly defaults, a compact TypeScript API, and a lightweight PHP runtime.

Install
-------

[](#install)

Install the JavaScript package with Vite+:

```
vp add -D vite-plus @nabasa/vp-wp
```

If you also want the PHP runtime helpers through Composer:

```
composer require nabasa/vp-wp
```

If you are not using Composer, copy `vp-wp.php` into your plugin or theme and require it manually.

Migration
---------

[](#migration)

Moving from `@kucrut/vite-for-wp`? See [`docs/migrating-from-vite-for-wp.md`](docs/migrating-from-vite-for-wp.md).

Vite+ config
------------

[](#vite-config)

A minimal Vite+ config looks like this:

```
import { defineConfig } from "vite-plus";
import { wordpress, wordpressExternals } from "@nabasa/vp-wp";

export default defineConfig({
  plugins: [
    wordpress({
      entry: {
        app: "resources/app.ts",
      },
      outDir: "assets/dist",
    }),
    wordpressExternals(),
  ],
});
```

Then run the usual Vite+ commands:

```
vp dev
vp build
```

`wordpress()` applies WordPress-friendly defaults:

- `base: './'`
- `build.manifest: 'manifest.json'`
- `build.modulePreload: false`
- `css.devSourcemap: true`
- a development manifest at `vite-dev-server.json`

These defaults keep asset URLs, manifests, and CSS handling aligned with WordPress expectations.

`wordpressExternals()` keeps common WordPress globals out of your bundle and treats React as external by default.

PHP runtime
-----------

[](#php-runtime)

A typical enqueue setup looks like this:

```