https://github.com/5t3ph/eleventy-plugin-template
A starter environment for creating plugins for Eleventy (11ty).
https://github.com/5t3ph/eleventy-plugin-template
11ty 11ty-plugin eleventy eleventy-plugin
Last synced: 9 months ago
JSON representation
A starter environment for creating plugins for Eleventy (11ty).
- Host: GitHub
- URL: https://github.com/5t3ph/eleventy-plugin-template
- Owner: 5t3ph
- Created: 2020-10-31T19:35:55.000Z (over 5 years ago)
- Default Branch: main
- Last Pushed: 2023-02-11T01:48:36.000Z (over 3 years ago)
- Last Synced: 2025-03-26T04:34:55.233Z (over 1 year ago)
- Topics: 11ty, 11ty-plugin, eleventy, eleventy-plugin
- Language: JavaScript
- Homepage:
- Size: 25.4 KB
- Stars: 52
- Watchers: 3
- Forks: 8
- Open Issues: 3
-
Metadata Files:
- Readme: README.md
Awesome Lists containing this project
README
## Eleventy Plugin Template
> A starter environment for creating plugins for Eleventy (11ty).
Fork this repo, or select "Use this template" to get started.
### Using this template
This template is setup to run a single page 11ty site for testing your plugin functionality. The build files are excluded from the final plugin package via `.npmignore`.
Your plugin functionality should live in/be exported from `.eleventy.js`. You will find a sample of creating a filter plugin in this template, including setting up a default config and merging user options.
**Be sure to update the `package.json` with your own details!**
### Testing your plugin
You can test your functionality within this project's local 11ty build by running `npm start`, but you'll also want to test it _as a plugin_.
From another local 11ty project, you can set the `require()` path relatively to your plugin's project directory, and then use it just as you would for a plugin coming from a package.
Example, assuming you place all your repositories within the same parent directory:
```js
const pluginName = require("../plugin-directory");
module.exports = (eleventyConfig) => {
eleventyConfig.addPlugin(pluginName, { optionName: 'if needed' );
};
```
Then, run the project to test the plugin's functionality.
Note that making changes in the plugin source will likely require restarting the test project.
### Resources for creating an 11ty plugin
- Bryan Robinson's ["Create a Plugin with 11ty"](https://www.youtube.com/watch?v=aO-NFFKjnnE) demonstration on "Learn With Jason"
---
**The following is a boilerplate for your final plugin README**.
## Usage
Describe how to install your plugin, such as:
```bash
npm install @scope/plugin-name
```
Then, include it in your `.eleventy.js` config file:
```js
const pluginName = require("@scope/plugin-name");
module.exports = (eleventyConfig) => {
eleventyConfig.addPlugin(pluginName);
};
```
## Config Options
| Option | Type | Default |
| ----------- | ---- | ------------- |
| option name | type | default value |
## Config Examples
Show examples of likely configurations.
## Credits
Add credits if needed.