Configuration

To configure the behavior of the framework, you need to create a react-server.config.* or +*.config.* file in the root of your project. This file is used to configure the server and the build process. The file type could be .js, .mjs, .ts, .mts or .json.

You can use the +*.config.* file to extend the configuration of the framework. The +*.config.* file is merged with the react-server.config.* file.

The +*.config.* file is useful when you want to extend the configuration of the framework. You can use as many +*.config.* files as you want. All the configuration files are merged together in the order they are loaded.

If you want to only add configuration to use when running the framework in production mode, then use the .production.config.* extension. These configuration files only loaded in production mode.

In a similar way, you can create configuration files with the .development.config.* extension to use a different configuration for development mode.

To add configuration to the build process, you can create .build.config.* files and these configuration files will only be used during a production build.

Configuration files with the .runtime.config.* or .server.config.* extensions are not used during the build process.

The configuration object you need to export as default is an extension of the Vite config object. You can find the full list of options here.

To provide full control over the Vite configuration, you can use the vite option to configure the Vite server and the build process. The vite option is an object that extends the Vite config object or a function that returns a new Vite config object. As a function you can discover and mutate the default configuration for Vite.

You can also use a vite.config.* file to configure Vite as you would do in a Vite project. The vite.config.* file is merged with the react-server.config.* file.

Best practice is to use a vite.config.* file to configure Vite as you would do in a Vite project and use the react-server.config.* file to configure the framework specific options.

The following options are specific to the @lazarv/react-server framework.

Add new entries to the runtime context. The runtime context is a singleton store and can be used to share state in your application.

{
  "runtime": {
    "myEntry": "myValue"
  }
}

The runtime option can also be a function that returns the runtime context object. This is useful when you want to mutate the runtime context.

export default {
  runtime: (runtime) => {
    return {
      ...runtime,
      myEntry: "myValue",
    };
  },
};

Provide cookies configuration, see available options here.

export default {
  cookies: {
    path: "/",
    maxAge: 60 * 60 * 24 * 30,
    secure: true,
    httpOnly: true,
    sameSite: "lax",
  },
};

You can add pre and post handlers to the Hattip middleware stack. You can define the async handler functions in an array for both pre and post options. See more details about Hattip handlers here.

export default {
  handlers: {
    pre: [async () { ... }],
    post: [async () { ... }]
  }
}

The handlers option can also be a function that returns the handlers array. This is useful when you want to mutate the middlewares used.

export default {
  handlers: (handlers) => {
    return [...handlers, async () { ... }];
  }
}

Or the handlers option can be an array, where the array of handlers will be used as post handlers.

The public directory is the directory where the static assets are served from. The default value is public.