0.1.1 • Published 1 year ago

@twoday/env-public-config-and-messages-scripts v0.1.1

Weekly downloads
-
License
ISC
Repository
github
Last release
1 year ago

@twoday/env-public-config-and-messages-scripts

Build environment specific messages and .env.json files.

Usage

  1. Set available locales
  2. Add .gitignore:

    # translations
    /.aggregated-lang
    
    # generated
    /src/.env-manifest.json
    /public/.env
  3. Add package.json "scripts":

    "predev": "npm run env-manifest",      // Vite
    "prestart": "npm run env-manifest",    // CRA
    "prebuild": "npm run env-manifest",
    "env-manifest": "env-public-config-and-messages-scripts",
  4. Add translations and ENV configs

    Based on message files in /.aggregated-lang it is possible to add specific messages for different environments. It is also possible to add .env.json files for different environments.

    ⚠️ The contents of the messages and .env.json files are public. Do not place any secrets in them.

    /environments
      /example.com
        /.env.json
        /en-US.json
        /en.json
        /favicon.png
        /fi-FI.json
      /test.example.com
        /.env.json
        /en.json
        /favicon.png
        /fi-FI.json
  5. Load correct .env.json for the environment

    // main.js
    
    import { getFilePath } from "@twoday/env-public-config-and-messages";
    import envManifest from "./.env-manifest.json";
    
    // ...
    
    const envPath = getFilePath(envManifest, [({ type }) => type === "env"]);
    
    if (envPath) {
      await loadRuntimeConfig(`${ENV.BASENAME ?? ""}/${envPath}`);
    }
    
    // console.log(ENV);
    
    // ...
  6. Use <IntlProvider> from @twoday/react-intl-bundled-messages