1"use strict";(self.webpackChunkfarm_docs=self.webpackChunkfarm_docs||[]).push([[6188],{94317:(e,n,i)=>{i.r(n),i.d(n,{assets:()=>l,contentTitle:()=>o,default:()=>h,frontMatter:()=>d,metadata:()=>c,toc:()=>t});var r=i(49214),s=i(36906);const d={},o="Environment Variables and Modes",c={id:"features/env",title:"Environment Variables and Modes",description:"Farm distinguishes between development and production environments through process.env.NODE_ENV.",source:"@site/docs/features/env.md",sourceDirName:"features",slug:"/features/env",permalink:"/docs/features/env",draft:!1,unlisted:!1,editUrl:"https://github.com/farm-fe/farm-fe.github.io/tree/main/docs/features/env.md",tags:[],version:"current",frontMatter:{},sidebar:"tutorialSidebar",previous:{title:"Static Assets",permalink:"/docs/features/static"},next:{title:"Lazy Compilation",permalink:"/docs/features/lazy-compilation"}},l={},t=[{value:"<code>.env</code> file",id:"env-file",level:2},{value:"envPrefix",id:"envprefix",level:2},{value:"envDir",id:"envdir",level:2}];function a(e){const n={a:"a",admonition:"admonition",code:"code",h1:"h1",h2:"h2",header:"header",li:"li",p:"p",pre:"pre",strong:"strong",ul:"ul",...(0,s.R)(),...e.components};return(0,r.jsxs)(r.Fragment,{children:[(0,r.jsx)(n.header,{children:(0,r.jsx)(n.h1,{id:"environment-variables-and-modes",children:"Environment Variables and Modes"})}),"\n",(0,r.jsxs)(n.p,{children:[(0,r.jsx)(n.code,{children:"Farm"})," distinguishes between ",(0,r.jsx)(n.code,{children:"development"})," and ",(0,r.jsx)(n.code,{children:"production"})," environments through ",(0,r.jsx)(n.code,{children:"process.env.NODE_ENV"}),"."]}),"\n",(0,r.jsx)(n.p,{children:"In different environments, environment variables are replaced statically, so use static constants to represent environment variables instead of dynamic expressions."}),"\n",(0,r.jsxs)(n.h2,{id:"env-file",children:[(0,r.jsx)(n.code,{children:".env"})," file"]}),"\n",(0,r.jsxs)(n.p,{children:[(0,r.jsx)(n.code,{children:"Farm"})," uses ",(0,r.jsx)(n.code,{children:"dotenv"})," to load your additional environment variables, such as ",(0,r.jsx)(n.code,{children:".env"})," files. By default ",(0,r.jsx)(n.code,{children:".env"})," file are loaded from ",(0,r.jsx)(n.a,{href:"/docs/config/shared#root",children:(0,r.jsx)(n.code,{children:"root"})}),", you can use ",(0,r.jsx)(n.a,{href:"#envdir",children:(0,r.jsx)(n.code,{children:"envDir"})})," to customize."]}),"\n",(0,r.jsx)(n.pre,{children:(0,r.jsx)(n.code,{className:"language-js",children:"// .env\nFARM_APP_SECRET=secret\nFarm_APP_PASSWORD=password\nAPP_VERSION=1.0.0\n"})}),"\n",(0,r.jsxs)(n.p,{children:[(0,r.jsx)(n.code,{children:"Farm"})," loads the file ",(0,r.jsx)(n.code,{children:".env"})," via dotenv, and loads it into ",(0,r.jsx)(n.code,{children:"process.env"})," and finally injects it into define."]}),"\n",(0,r.jsx)(n.admonition,{type:"danger",children:(0,r.jsxs)(n.p,{children:["In order to ensure the security of the client, preventing the environment variables in the current system from being exposed to the client ",(0,r.jsx)(n.code,{children:"Farm"})," will only identify some important environment variables that start with ",(0,r.jsx)(n.code,{children:"FARM_"}),"\u3001",(0,r.jsx)(n.code,{children:"VITE_"})," (In order to better compatible with vite and its ecological environment)."]})}),"\n",(0,r.jsxs)(n.p,{children:[(0,r.jsx)(n.code,{children:"Farm"})," expands environment variables through dotenv-expand. For development only envs use ",(0,r.jsx)(n.code,{children:".env.development"}),", for production only envs use ",(0,r.jsx)(n.code,{children:".env.production"}),", for custom mode passed by ",(0,r.jsx)(n.code,{children:"--mode <stage>"}),", load from ",(0,r.jsx)(n.code,{children:".env.<stage>"})," file."]}),"\n",(0,r.jsxs)(n.ul,{children:["\n",(0,r.jsxs)(n.li,{children:["If you want to customize the directory to load ",(0,r.jsx)(n.code,{children:".env"})," file, you can configure ",(0,r.jsx)(n.a,{href:"#envdir",children:(0,r.jsx)(n.code,{children:"envDir"})}),"."]}),"\n",(0,r.jsxs)(n.li,{children:["If you want to customize the prefix of env variables which are injected to ",(0,r.jsx)(n.a,{href:"/docs/config/compilation-options#define",children:(0,r.jsx)(n.code,{children:"define"})}),", you can configure ",(0,r.jsx)(n.a,{href:"#envprefix",children:(0,r.jsx)(n.code,{children:"envPrefix"})}),"."]}),"\n"]}),"\n",(0,r.jsx)(n.h2,{id:"envprefix",children:"envPrefix"}),"\n",(0,r.jsxs)(n.ul,{children:["\n",(0,r.jsxs)(n.li,{children:[(0,r.jsx)(n.strong,{children:"default value"}),": ",(0,r.jsx)(n.code,{children:"FARM_"}),"\u3001",(0,r.jsx)(n.code,{children:"VITE_"})]}),"\n"]}),"\n",(0,r.jsxs)(n.p,{children:["Customize the prefix of the ",(0,r.jsx)(n.code,{children:"env"})," variable by configuring ",(0,r.jsx)(n.code,{children:"envPrefix"}),". Env variables start with ",(0,r.jsx)(n.code,{children:"envPrefix"})," will be injected into define automatically. For example, in the ",(0,r.jsx)(n.code,{children:".env"})," file:"]}),"\n",(0,r.jsx)(n.pre,{children:(0,r.jsx)(n.code,{className:"language-js",children:"// .env\nFARM_CUSTOM_VERSION=1.0.0\nAPP_VERSION=0.1.0\n"})}),"\n",(0,r.jsxs)(n.p,{children:["Then ",(0,r.jsx)(n.code,{children:"FARM_CUSTOM_VERSION"})," will be injected, but not ",(0,r.jsx)(n.code,{children:"APP_VERSION"}),", in your business code:"]}),"\n",(0,r.jsx)(n.pre,{children:(0,r.jsx)(n.code,{className:"language-tsx",children:"export function MyComp() {\n const farmCustomVersion = FARM_CUSTOM_VERSION;\n return <div>Farm Custom Version: {farmCustomVersion}</div>\n}\n"})}),"\n",(0,r.jsxs)(n.p,{children:[(0,r.jsx)(n.code,{children:"FARM_CUSTOM_VERSION"})," will be replaced by ",(0,r.jsx)(n.code,{children:"'1.0.0'"})," automatically."]}),"\n",(0,r.jsx)(n.h2,{id:"envdir",children:"envDir"}),"\n",(0,r.jsxs)(n.ul,{children:["\n",(0,r.jsxs)(n.li,{children:[(0,r.jsx)(n.strong,{children:"default value"}),": ",(0,r.jsx)(n.code,{children:"<root>"})]}),"\n"]}),"\n",(0,r.jsxs)(n.p,{children:["The directory to load ",(0,r.jsx)(n.a,{href:"#env-file",children:(0,r.jsx)(n.code,{children:"env file"})}),". By default Farm load ",(0,r.jsx)(n.code,{children:"env file"})," from root."]}),"\n",(0,r.jsx)(n.pre,{children:(0,r.jsx)(n.code,{className:"language-ts",children:"export defineConfig({\n envDir: './env'\n})\n"})}),"\n",(0,r.jsxs)(n.p,{children:["For above config example, Farm will load ",(0,r.jsx)(n.code,{children:".env"}),", ",(0,r.jsx)(n.code,{children:".env.development"}),", etc from ",(0,r.jsx)(n.code,{children:"<root>/env"})," dir."]})]})}function h(e={}){const{wrapper:n}={...(0,s.R)(),...e.components};return n?(0,r.jsx)(n,{...e,children:(0,r.jsx)(a,{...e})}):a(e)}}}]);
Line numbers count LF bytes from the start of the resource, as the search results do. Vendor segments are library code the classifier recognised; they are stored but not indexed. Bytes are shown as Latin1 characters, one per byte.