4

So, I have a logic that sets different baseURLs depending on the NODE_ENV that I am in.

My problem is that process.env.NODE_ENV has only two types, development and production and I also want to have the option for staging.

So what I have tried to do is create a file called environment.d.ts at the root folder of my project, and inside I did:

declare namespace NodeJS {
  export interface ProcessEnv {
    NODE_ENV: "development" | "production" | "staging";
  }
}

However I am still getting the error when trying to use staging:

This condition will always return 'false' since the types '"production"' and '"staging"' have no overlap.ts(2367)

export const baseURL =
  process.env.NODE_ENV === "development"
    ? "http://localhost:3000"
    : process.env.NODE_ENV === "staging"
    ? `https://ego-stage.herokuapp.com/`
    : process.env.NODE_ENV === "production"
    ? "https://egolounge.com/"
    : "http://localhost:3000";

The line that's giving me the error is the line where I am comparing if NODE_ENV is equal to staging, since staging as a type is not present in the default interface for NODE_ENV, so I need to extend it with my own definition, however the definition that I created does not supersede for some reason the default one, and when I push to the server, its not building.

7
  • Does it really matter what they are in these case? Instead of saying string I am being explicit about the strings that I want as values, this is irrelevant to the problem... Commented Feb 23, 2022 at 15:43
  • You're asking a technical question: getting your terms right always matters. Commented Feb 23, 2022 at 15:44
  • @Mike'Pomax'Kamermans this is Typescript, not Javascript, and this is an interface not a class, or a function, there is no logical || operator here. Commented Feb 23, 2022 at 15:44
  • That is how the interface should be, the code is correct (in terms of that logic), the problem is that the definition I created does not get recognized and does not superseed the default type for process.env.NODE_ENV which is only "staging" | "production" and just to make my point about that even more clear, here is the default interface built into the node types: prnt.sc/4WWMhoIV4CIR if I add | "staging" here it works just fine, but thats located in node_modules so it does not get pushed to the server, thats why I need to extend it. Commented Feb 23, 2022 at 15:46
  • Fair enough, but: don't put pictures of code in your post, put the text in your code. Especially as the TS error is getting flagged for code you're not showing right now. Commented Feb 23, 2022 at 15:48

1 Answer 1

5

I managed to do exactly what you wanted using a different file name and dropping any exports.

// <project_root>/index.d.ts
declare namespace NodeJS {
  interface ProcessEnv {
     NODE_ENV: 'dev' | 'stg' | 'prod';
  }
}

I just shorthand the accepted values for NODE_ENV, since I just wanted to extend the interface with other values I have in my .env file.

I found the export interface did nothing extra to extend the ProcesEnv interface.

I think if you want to change the name of the file, you'll still have to include the index.d.ts and ref with an import (or that weired tripple slash).

Or you'll need to add it to the includes in your tsconfig.json file. Someone wanna fact check me on that?

Sign up to request clarification or add additional context in comments.

Comments

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Start asking to get answers

Find the answer to your question by asking.

Ask question

Explore related questions

See similar questions with these tags.