Table of Contents

assets-core

Note: The options API is still evolving; expect tweaks as the project grows.

What it does

assets-core is Baseline's single assets plugin. It owns all the Eleventy wiring for JS and CSS: template formats, extensions, compile guards, inline filters, watch targets, and global data. Processing itself is delegated to assets-esbuild and assets-postcss — pure functions that know nothing about Eleventy.

Defaults

Assets directory: src/assets/ (fixed convention, mirrors dir.assets).
JS entries: any index.js under src/assets/js/ (including nested folders).
CSS entries: any index.css under src/assets/css/ (including nested folders).
esbuild: minify: true, target: 'es2020' (defaults live in assets-esbuild).
PostCSS: uses your project's postcss.config.js, or falls back to Baseline's bundled config.
Watch target: src/assets/**/*.{css,js,svg,png,jpeg,jpg,webp,gif,avif} — edits trigger reloads during --serve.
Output: under dist/assets/ (matching Eleventy's dir.output).

Options

Option	Type	Default	Description
`esbuild.minify`	boolean	`true`	Forward to esbuild's minify flag.
`esbuild.target`	string	`'es2020'`	Forward to esbuild's target.

Pass esbuild options via Baseline's assetsESBuild option in your Eleventy config:

eleventyConfig.addPlugin(
	baseline({
		assetsESBuild: {
			minify: process.env.ELEVENTY_ENV === 'production',
			target: 'es2017'
		}
	})
);

PostCSS has no plugin-level options — configure it through your postcss.config.js (see the custom PostCSS config guide).

How it works

Directory resolution.

On the eleventy.directories event, assets-core resolves input/output/assets paths and defines a virtual directories.assets property. Global data at _baseline.assets exposes input and output for use in templates.
Template formats and extensions.

Registers js and css as Eleventy template formats. Each gets an extension handler with read: false — the process functions own their I/O.
Compile guards.

Only index.js files under src/assets/js/ and index.css files under src/assets/css/ are compiled. Everything else (partials, 11tydata.js files, non-entry scripts) is skipped. An ignores.add rule also prevents 11tydata.js files from entering the template graph.
Inline filters.

inlineESbuild and inlinePostCSS are async filters that process a file and wrap the result in <script> or <style> tags. They call the same process functions as the compile step. See assets-esbuild and assets-postcss for usage.
Watch target.

Covers common asset formats under src/assets/ so edits trigger reloads during npm run dev.

Tips

Keep assets in src/assets/ — the directory convention is fixed by design.
Only index.js and index.css are compiled. Use them as entry points; import everything else from there.
The watch target covers images too, so editing an SVG or PNG triggers a reload without extra config.
See the Assets Pipeline Quickstart for a guided setup.

Peer deps

None — built-in. esbuild and PostCSS dependencies are managed by Baseline.

Previous: Modules

Next: assets-esbuild