@moxy/next-runtime-env

next-runtime-env

NextJS plugin to pass environment variables to NextJS's runtime configuration.

By default, NextJS does not make available process.env to the client side. The available solution for this problem is to set a runtime config in next.config.js to pass values which will be available in either server and client or just server.

The way to do it is by passing values to the publicRuntimeConfig and serverRuntimeConfig properties of the NextJS' config.

This plugin does that automatically for all environment variables starting with a certain prefix.

Installation

$ npm i --save-dev @moxy/next-runtime-env

Usage

// next.config.js
const withRuntimeEnv = require('@moxy/next-runtime-env');

module.exports = withRuntimeEnv({ ...options })({ ...nextConfig });

Multiple configurations can be combined together with function composition. For example:

// next.config.js
const withCSS = require('@zeit/next-css');
const withRuntimeEnv = require('@moxy/next-runtime-env');

module.exports = withCSS(
    withRuntimeEnv({
        removePrefixes: true,
    })({
        cssModules: true, // this options will be passed to withCSS plugin through nextConfig
    }),
);

API

Option	Description	Type	Default
publicPrefix	Prefix of variables to lookup and then pass to publicRuntimeConfig	String	PUBLIC_
serverPrefix	Prefix of variables to lookup and then pass to serverRuntimeConfig	String	SERVER_
removePrefixes	Option to remove prefix when passing variables to runtime config	Boolean	false

Tests

Any parameter passed to the test command, is passed down to Jest.

$ npm t
$ npm t -- --coverage # to generate coverage report
$ npm t -- --watch # during development

License

Released under the MIT License.