Quickstart

Installation

NPM Install

To install in your node project, you can run:

npm i @swplabs/peanutforwp --save-dev

After installation, you can run the following cli command to list all commands and options:

npx peanut help

Alternatively, you can install globally using the following command:

npm i @swplabs/peanutforwp -g

Note: Installing globally will allow you to run the "peanut" cli command anywhere. This is helpful when you have multiple projects with different source directories.

Clone the GitHub Repo

You can download the full source from our public GitHub repo using this link or go to our GitHub repo homepage for cloning instructions similiar to this:

git clone [email protected]:swplabs/peanut.git

Setup

Wordpress Environment Settings

Enable Permalinks

Permalinks are the permanent URLs of your Wordpress content. At the moment, Peanut For Wordpress requires that Permalinks to set to something other than the default "Plain". See "Choosing your permalink structure" for instructions on how to change your permalink settings.

Enable Debugging

Script Debugging must be set to true when in development mode for Peanut editor scripts to function. See Wordpress debugging mode for instructions on how to turn on in your Wordpress development environment.

Set Wordpress Environment

In order to use our Whiteboard component prototyping application, you'll need to set your local Wordpress environment type to either 'local' or 'development'.

Download and Activate the Peanut WordPress Plugin

The Peanut for Wordpress application requires the Peanut Wordpress plugin which enables the framework for loading components and blocks built with the app.

You can obtain the plugin via the GitHub repo:

git clone [email protected]:swplabs/peanut-plugin.git

Once cloned, you can copy it to your local Wordpress content directory (wp-content/plugins/). You'll need to then go into your Wordpress Admin and enable the plugin.

Using the Peanut Setup Command

To create a configuration file (peanut.config.json) and element subfolders for your project within your current working directory, you can use the setup CLI command:

npx peanut setup

Starting the application

Ensure you have the minimum required version of Node.js

To run the application, you'll need to have the following minimum version of Node.js required installed:

For installation, we recommend using NVM or Volta to manage your Node.js versions. If you are not using a package manager, see the Node.js download page for installers and binaries.

Running the CLI

To start building your blocks, plugins, components, and themes, you can run the cli:

npx peanut [develop|build|lint|format|help] [options]

You can get a list of CLI commands and options by running the help command:

npx peanut help

For more examples, see "Using the CLI".

Building for Production

To trigger a production-ready compilation of your work (ie. minification of code, etc), you can add the following environment vars to your commands:

ENVIRONMENT="prod" NODE_ENV="production" npx peanut [develop|build]