JSON Configuration
Configuration for Peanut for Wordpress is handled by creating a "peanut.config.json" in root directory of your "elements" source directory.
This file will allow you to update any of the environment variables that are used to set custom values used within the application.
An example of how to setup the directory structure of your "elements" source folder can be found by visiting our examples GitHub repo.
Sample configuration JSON
To create a custom 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 setupConfigurable Environment Variables
All environment variables are set as strings.
ENVIRONMENT
Sets the compilation environment settings.
Values: "local", "prod"
Default: "local"
PFWP_SSE_HOST
Defines the hostname used for the HMR and SSE server. Used for send HMR updates.
Default: "http://localhost/"
PFWP_SSE_PORT
Defines the port used when running the HMR and SSE server.
Default: "5050"
NODE_ENV
Sets the Node environment.
Values: "development", "production"
Default: "development"
PFWP_DEBUG
Turns on debug mode for more information in logging.
Values: "false", "true"
Default: "false"
PFWP_WP_HOST
Defines the hostname used to view your Wordpress site.
Default: "http://localhost/"
PFWP_WP_PUBLIC_PATH
Defines the root of public path used to view static assets on your Wordpress site.
Default: "/"
PFWP_CSS_IN_JS
Controls whether to extract CSS that's included in javascript entries or to use style-loader to load them dynamically.
Values: "false", "true"
Default: "false"
PFWP_WP_ROOT
Absolute path to your local environment Wordpress root directory.
Example: "/var/www/html"
PFWP_THEME_PATH
Path relative to your Wordpress root directory where your active theme directory lives.
Example: "/wp-content/themes/example-theme"
PFWP_WB_PORT
Defines the port used when running the Whiteboard application.
Default: "5000"
PFWP_WB_HEAD_COMPONENTS
PFWP_WB_FOOTER_COMPONENTS
PFWP_DATA_MODE
Controls how base64 encoded data is passed to the components REST API. Either as a path value in URL structure or as a query string.
Values: "path", "query"
Default: "path"
PFWP_CONFIG_HOOKS
PFWP_CONFIG_ESLINT
Enable ESLint configuration customization. Value should be the name of the file that will be used to modify the configuration.
Example: "eslint.js"
PFWP_CONFIG_WEBPACK
Enable webpack configuration customization. Value should be the name of the file that will be used to modify the configuration.
Example: "custom.webpack.js"
PFWP_ENABLE_HMR
Enables Hot Module Reloading for React driven elements during "develop" compilation mode.
Values: "false", "true"
Default: "true"
PFWP_ENABLE_WB
Enables Whiteboard tool during "develop" compilation mode.
Values: "false", "true"
Default: "false"
PFWP_PRIMARY
PFWP_SECONDARY
Last updated