原理:.env文件是如何写入环境变量的

.env文件是如何写入环境变量的

我们在vue项目开发中,经常使用到环境变量去区分开发环境和生产环境,常见的

vue-cli下 :
process.env=='development'
vite中
import.mea.env.MODE=='development'

有时,我们也可以配置我们的环境变量,比如:在根路径下添加.env文件
或者.dev.env 或者pro.env 去区分开发环境和生产环境,我们配置的环境变量如何写入的呢?

思路整理

简单来讲,我们只需要将需要的环境变量写入process.env这个对象下面即可

  1. 读取根目录下的.env文件,解析成对象–parser
  2. 遍历对象,写入环境变量 --writeEnv

实现

在项目根目录新建.env文件

port=8080
url=10.10.0.0

读取文件

const path = require("path");
const fs = require("fs");
function readFile (){
    const  parserPath= path.resolve(process.env(),'/.env')
    return fs.readFileSync(parserPath, "utf-8");
};

解析文件

function parse = (str){
  const obj = {};
  // prot=8080 url=10.10.0.0
  str.split("\n").forEach((item) => {
    if (item) {
      const [key, value] = item.split("=");
      obj[key] = value;
    }
  });
  return obj;
};

写入环境变量

function writeEnv(obj) {
  Object.keys(obj).forEach(function (key) {
    if (!Object.prototype.hasOwnProperty.call(process.env, key)) {
      process.env[key] = obj[key];
    }
  });
}
writeEnv(parse(readFile())) //执行
console.log(process.env) 

结果展示

控制台展示如下:
在这里插入图片描述

你可能感兴趣的:(node,javascript,前端,vue.js)