V4 Configuration

BundleBD includes many different options for configuration. Its behavior and options are configured in two different files: the Bundler Configuration and the Plugin Configuration. Each configuration type has defaults, so neither type of file is required, but they are highly recommended.

Bundler Configuration

The Bundler Configuration configures the basic behavior of the bundler in a bundlebd.config.js file in the root directory. It must set module.exports to either a configuration object, or a function that takes one or two parameters and returns the configuration object. When bundling, the function will be passed the plugin and dev arguments from the command.

The configuration object can take the following properties:

input

See the input command option.

output

See the output command option.

bdPath

See the bd-path command option.

moduleComments

See the module-comments command option.

format

An object with options for the formatting of the bundled plugin. Contains the following properties:

• indent: The string to use for indentation. Defaults to "\t".

postcssPlugins

An array of PostCSS plugins to use when bundling the plugin. See here for more information on PostCSS.

importAliases

An object of import aliases to use when bundling the plugin.

The keys are the aliases, and the values are the relative paths to the files or folders that will replace the aliases.

You can also include /* at the end of alias and replacement paths to include every file and folder within the path. For example, "@components/*": "src/components/*" will replace all imports beginning with @components with imports of the files and folders within src/components.

(Note: Using the /* pattern will also allow you to import the index file within that directory. For example, "@components/*": "src/components/*" will allow you to import from @components, which will be replaced with src/components/index)

defineConfig Function (Optional)

BundleBD offers an optional defineConfig helper function for typings and autocomplete with bundler configuration files.

To use it, just import it from bundlebd and pass it the configuration object or function:

// bundlebd.config.js

const { defineConfig } = require("bundlebd");

module.exports = defineConfig({
	...
})

Object Example

// bundlebd.config.js

const { defineConfig } = require("bundlebd");

module.exports = defineConfig({
	input: "src",
	output: ".",
	postcssPlugins: [require("postcss-preset-env")],
	importAliases: {
		"@components/*": "src/components/*",
	},
});

Function Example

// bundlebd.config.js

const { defineConfig } = require("bundlebd");

module.exports = defineConfig((plugin, dev) => ({
	input: `${plugin}/src`,
	output: `${plugin}/dist`,
	format: {
		indent: "  ",
	},
}));

Plugin Configuration

The Plugin Configuration configures the plugin-specific information and options in a plugin.json file in your plugin's entry folder.

The configuration can contains all of the following properties for the plugin's meta, as well as additional options:

Meta Options

Properties for the plugin's metadata that will be used to generate the plugin's meta. They should be placed in the main object of the file. See here for more information on each possible property.

The name, author, description, and version properties are required.

entry

The relative path from the plugin's entry folder to the main file of the plugin.

Defaults to index.

installScript

A boolean that determines whether or not to include a script that will install the plugin if the file is executed.

defaults to true.

zlibrary

A boolean or object that determines whether or not to bundle the plugin with ZeresPluginLibrary support.

If it is a boolean with a value of true, the plugin will be bundled with ZeresPluginLibrary support, and the meta properties will be used to generate a ZLibrary config object.

For more in-depth configuration, you can set it to an object that will be used as the ZLibrary config object. If any required fields in the 'info' property are missing, they will be filled in using the other meta properties. The object can take the 'info' and 'changelog' properties, as well as others. For an example, see here.

Defaults to false.

Example

// MyAmazingPlugin/src/plugin.json (Using the entry folder from the Bundle Configuration example)

{
	"name": "MyAmazingPlugin",
	"author": "Neodymium",
	"description": "A plugin that does absolutely nothing",
	"version": "1.0.0",
	"entry": "index.js",
	"installScript": true,
	"zlibrary": true
}

Typescript Configuration

While by no means required, configuring Typescript can solve issues with Typescript not resolving typings, and can make development easier. Thus, it is recommended. To configure Typescript, just add a tsconfig.json file in your root folder. Here's an example of a simple TSConfig with some recommended settings for using the bundler:

// tsconfig.json

{
	"compilerOptions": {
		"resolveJsonModule": true,
		"esModuleInterop": true,
		"jsx": "react-jsx"
	}
}

For more information on TSConfig options and their purposes, see the TSConfig Reference.