Build Awesome Kit

All you need to quickly plug-and-play with 11ty / Build Awesome.

Utility plugin|Managed config|Micro-starters🌱

---

Core package

Plugin

npm install @anyblades/buildawesome-kit

Then addPlugin() to your config:

importkitPluginfrom"@anyblades/buildawesome-kit";exportdefaultfunction($config){$config.addPlugin(kitPlugin);}

Live example: https://github.com/anyblades/buildawesome-micro-starters/blob/main/bare-plugin/

Features

All https://build.blades.ninja/plugin/features/ except mdAutoRawTags are enabled by default.

You can toggle them like this:

$config.addPlugin(kitPlugin,{autoLinkFavicons: false,mdAutoRawTags: true,});

Filters

All https://build.blades.ninja/plugin/filters/ are enabled by default.

You can toggle them like this:

$config.addPlugin(kitPlugin,{filters: {attr_set: false},});

---

Scripts

Ready-to-use npm scripts are included within the same core package:

npm install @anyblades/buildawesome-kit

To reuse in your project, link them under scripts/ subfolder like this:

mkdir scripts
cd scripts/
ln -s ../node_modules/@anyblades/buildawesome-kit/packages/scripts/package.json
cd ..

Finally, register scripts as a "virtual" npm workspace:

"workspaces": ["scripts"],
"scripts": {
"scripts": "npm -w scripts run",
"start": "npm run scripts -- start",
"stage": "npm run scripts -- stage",
"build": "npm run scripts -- build"
},

Done! 🥷 : Build Awesome Kit's npm run start / stage / build are ready to use in your project, AND automatically updated via @anyblades/buildawesome-kit package.

Live example: https://github.com/anyblades/buildawesome-micro-starters/tree/main/bare-scripts

---

Pre-configured

All-in-one package

npm install @awesome.me/buildawesome @anyblades/buildawesome-kit-config

Everything is installed automatically; the only manual step is to create a default layout.

For example, using the built-in base https://blades.ninja/html/ templates:

mkdir _includes
cd _includes/
ln -s ../node_modules/@anyblades/blades/_includes/blades
echo"{% extends 'blades/html.njk' %}{% set site = { styles: ['https://cdn.jsdelivr.net/npm/@anyblades/blades@2/css/blades.min.css'] } %}"> default.njk
cd ..
echo"Hello, world! 🎈"> index.md

Done! 🥷 : Now you can see the Build Awesome Kit in action by using its built-in config file:

npx @awesome.me/buildawesome --serve --config=node_modules/@anyblades/buildawesome-kit-config/buildawesome.config.js

Live examples:

• https://github.com/anyblades/buildawesome-micro-starters/tree/main/micro
• https://github.com/anyblades/buildawesome-content-first/tree/main/.build

---

If you don't want to type --config=... every time, save it to your package.json:

"scripts": {
"build": "buildawesome --config=node_modules/@anyblades/buildawesome-kit-config/buildawesome.config.js",
"start": "npm run build -- --serve"
}

Now you can simply npm run start / build! 🥷

Live examples:

• https://github.com/anyblades/buildawesome-micro-starters/blob/main/micro/package.json
• https://github.com/anyblades/buildawesome-content-first/blob/main/.build/package.json

---

You can also import and use it as a "base" config:

importkitConfigfrom"@anyblades/buildawesome-kit-config";exportdefaultasyncfunction($config){awaitkitConfig($config);// Customize $config further as you like:$config.addPlugin(...);}

Live example: https://github.com/anyblades/buildawesome-micro-starters/blob/main/shotpipe-og-images/buildawesome.config.js

---

Micro-starters

https://build.blades.ninja/starters/

---

Documentation

• Core package
  • Plugin
  • Scripts
• Features
  • Features overview
  • Automatic link favicons
  • Markdown auto-raw tags
  • Markdown hidden attrs
  • Markdown newlines
  • Site globals
  • Virtual pages NEW
• Filters
  • Filters overview
  • attr_concat
  • attr_includes
  • attr_set
  • date
  • fetch
  • if
  • markdownify
  • merge
  • remove_tag
  • section
  • split NEW
  • strip_tag
  • unindent
• Pre-configured
  • All-in-one package
  • Starters
  • HTML templates
• Awesome

---

^{Featured by}

• 11tybundle.dev
• sveltiacms.app
• @hamatti