Configuration

Ecopages can be customized to fit your project's needs through a configuration file. Create a file named eco.config.ts in your project's root directory to get started.

Here's a basic example of an Ecopages configuration:

import { ConfigBuilder } from '@ecopages/core';
import { kitajsPlugin } from '@ecopages/kitajs';
import { mdxPlugin } from '@ecopages/mdx';

const config = await new ConfigBuilder()
    .setRootDir(import.meta.dir)
    .setBaseUrl(import.meta.env.ECOPAGES_BASE_URL)
    .setIntegrations([kitajsPlugin(), mdxPlugin()])
    .setDefaultMetadata({
      title: 'Your Site Title',
      description: 'Your site description',
      image: 'https://your-domain.com/og-image.png',
    })
    .build();

export default config;

Configuration API

rootDir*string

setRootDir@default: .

The root directory of your project, used to resolve paths to your project files.

baseUrl*string

setBaseUrl

The base URL of your project, used for generating absolute URLs for your pages.

defaultMetadataPageMetadataProps

setDefaultMetadata@default: { title: 'Ecopages', description: 'This is a static site generated with Ecopages' }

Default metadata for your pages. This is merged with page-specific metadata when provided.

srcDirstring

setSrcDir@default: src

The directory containing your source files, relative to the root project directory.

publicDirstring

setPublicDir@default: public

The directory for static assets, relative to the src directory.

pagesDirstring

setPagesDir@default: pages

The directory containing your page files, relative to the src directory.

includesDirstring

setIncludesDir@default: includes

The directory for include templates, relative to the src directory.

layoutsDirstring

setLayoutsDir@default: layouts

The directory for layout components, relative to the src directory.

includesTemplatesIncludesTemplates

setIncludesTemplates@default: {head: 'head.ghtml.ts', html: 'html.ghtml.ts', seo: 'seo.ghtml.ts'}

Specifies the templates used for different parts of your pages.

error404Templatestring

setError404Template@default: 404.ghtml.ts

The template for the 404 error page, located in the pages directory.

distDirstring

setDistDir@default: .eco

The output directory for the built files.

componentsDirstring

setComponentsDir@default: components

The directory containing your reusable components.

additionalWatchPathsstring[]

setAdditionalWatchPaths@default: []

Add additional files to monitor for changes. This is useful for tracking files that are not included in the Ecopages build process.

robotsTxtRobotsPreferences

setRobotsTxt@default: { preferences: { "*": [], Googlebot: ["/public/"] } }

Configuration for the robots.txt file.

integrationsIntegrationPlugin[]

setIntegrations@default: []

An array of integration plugins to enhance Ecopages functionality.

Integrations

Ecopages supports various integrations to extend its capabilities. Here are some commonly used integrations:

KitaJS: For JSX templating
Lit: For web components
MDX: For Markdown with JSX

To use an integration, install it and add it to your configuration. For example:

import { ConfigBuilder } from '@ecopages/core';
import { kitajsPlugin } from '@ecopages/kitajs';
import { mdxPlugin } from '@ecopages/mdx';

const config = await new ConfigBuilder()
    .setRootDir(import.meta.dir)
    .setBaseUrl(import.meta.env.ECOPAGES_BASE_URL)
    .setIntegrations([kitajsPlugin(), mdxPlugin()])
    .build();

export default config;

For more details on specific integrations, refer to their respective documentation pages: