Configure Your LWR Project

LWR is built with customization and extensibility in mind.

You can customize both the server configuration and project setup for your LWR project. The LWR server is configured in lwr.config.json, at the root of the project. This page describes various lwr.config.json configuration options.

For other configuration options, such as adding dependencies to your project or customizing LWR’s module support, check out Configure Packages and Modules.

Understand lwr.config.json

The lwr.config.json file generated for your initial StaticSite project only has a few things happening:

This isn't all you can do with this file, however. You can also configure directory locations of templates, global context data, and static assets, as well as set the port, server type, and server mode.

Configure Routes

Page routing for LWR projects is controlled in the lwr.config.json configuration file. This topic is covered in detail on the Routing in LWR page.

Configure the Port and Server

You can use lwr.config.json to access some LWR port and server configurations:

  • port: The port from which to serve the LWR application. The default is process.env.PORT || 3000.
  • serverMode: The mode in which to run the server. Mode is typically set on the command line. The default is "dev". See available modes here.
  • serverType: The type of underlying web server that LWR uses. Currently supported values are "express" (default) or "koa".

For example:

Configure Directory Locations

You can configure a variety of directory locations in your lwr.config.json file:

  • rootDir: The root directory of the LWR project. The default is the current working directory (.).
  • contentDir: The content templates directory. The default is "$rootDir/src/content".
  • layoutsDir: The layout templates directory. The default is "$rootDir/src/layouts".
  • globalDataDir: The directory of global data for templating. The default is "$rootDir/src/data".
  • assets: You can configure one or more files or directories to serve static assets. For each file or directory, include these properties:
    • alias: A name for this path to use in content or layout templates.
    • dir or file: The file system path containing the asset.
    • urlPath: The URI path serving the asset.

For example:

For more on using static assets, see Configure Template and Asset References in LWR Content and Layout Templates.

Configure Bundles

Depending on your project setup, the same module dependency can get pulled into more than one bundle. This doesn't cause a problem for most modules, but some must be treated as singletons. Examples of such modules are lwc, lwr/navigation, and @lwc/synthetic-shadow. The solution is to put these modules in their own, shareable bundles. In the lwr.config.json file, bundleConfig.exclude excludes the module from bundling when modules are requested: