Local Development

To develop your WPNuxt project locally, you need a WordPress installation with WPGraphQL. Here are your options.

Quick Comparison

Option 1: LocalWP (Recommended)

LocalWP is a free, user-friendly app for running WordPress locally.

Setup

1. Download and install LocalWP
2. Click Create a new site
3. Choose a site name (e.g., "my-wpnuxt-site")
4. Use the default PHP/MySQL settings
5. Set your admin credentials

Install Required Plugins

In your LocalWP site's WordPress admin:

1. Go to Plugins → Add New
2. Search for and install WPGraphQL
3. Activate the plugin

For Gutenberg blocks support, also install:

• WPGraphQL Content Blocks (download from GitHub)

For authentication (@wpnuxt/auth):

• Headless Login for WPGraphQL (download from GitHub)

Connect to Nuxt

Find your site URL in LocalWP (e.g., http://my-wpnuxt-site.local) and add it to your .env:

WPNUXT_WORDPRESS_URL=http://my-wpnuxt-site.local

Option 2: wp-env (Docker)

wp-env is WordPress's official Docker-based local environment.

Requirements

• Docker Desktop
• Node.js 20+

Setup

1. Install wp-env globally:

   npm install -g @wordpress/env
   

2. Create .wp-env.json in your project root:

   {
     "plugins": [
       "https://downloads.wordpress.org/plugin/wp-graphql.zip",
       "https://github.com/wpengine/wp-graphql-content-blocks/releases/latest/download/wp-graphql-content-blocks.zip"
     ],
     "port": 8080
   }
   

3. Start WordPress:

   wp-env start
   

4. Access WordPress admin at http://localhost:8080/wp-admin
   • Username: admin
   • Password: password
5. Add to your .env:

   WPNUXT_WORDPRESS_URL=http://localhost:8080
   

wp-env Commands

wp-env start      # Start WordPress
wp-env stop       # Stop WordPress
wp-env destroy    # Remove environment (start fresh)

Option 3: Existing WordPress

You can also use any existing WordPress installation (local or remote).

Requirements

1. Install and activate WPGraphQL
2. Enable introspection in GraphQL → Settings
3. Ensure the GraphQL endpoint is accessible from your dev machine

Connect

WPNUXT_WORDPRESS_URL=https://your-wordpress-site.com

Testing Your Setup

After configuring WordPress, verify it works:

1. Visit {your-wordpress-url}/graphql - you should see the GraphQL IDE
2. Run this query:

   {
     posts {
       nodes {
         title
       }
     }
   }
   

3. Start your Nuxt dev server:

   pnpm dev
   

Demo WordPress

Don't have WordPress set up yet? Use our demo instance to get started:

WPNUXT_WORDPRESS_URL=https://wordpress.wpnuxt.com

This is a read-only demo with sample content, perfect for trying out WPNuxt.

Related Pages

• Installation — Install and configure WPNuxt
• WordPress Setup — Configure WordPress for WPNuxt
• Quick Start — Build a blog from scratch in 15 minutes