Loading [MathJax]/jax/output/CommonHTML/config.js
前往小程序,Get更优阅读体验!
立即前往
首页
学习
活动
专区
圈层
工具
发布
首页
学习
活动
专区
圈层
工具
MCP广场
社区首页 >专栏 >从.env文件中为NodeJS加载环境变量[每日前端夜话0xA9]

从.env文件中为NodeJS加载环境变量[每日前端夜话0xA9]

作者头像
疯狂的技术宅
发布于 2019-08-15 09:44:49
发布于 2019-08-15 09:44:49
4.1K00
代码可运行
举报
文章被收录于专栏:京程一灯京程一灯
运行总次数:0
代码可运行

每日前端夜话0xA9

每日前端夜话,陪你聊前端。

每天晚上18:00准时推送。

正文共:643 字

预计阅读时间:5 分钟

作者:Staff

翻译:疯狂的技术宅

来源:coderrocketfuel

使用环境变量是配置 Node.js 程序的好方法。而且许多包或模块可以基于不同的 NODE_ENV 变量的值表现出不同的行为。

存储环境变量的一种方法是将它们放在 .env 文件中。这些文件允许你指定各种环境变量及其相应的值。

在大多数情况下,你不希望将 .env 文件添加到源代码控制中(即Git)。因此,应该将它的文件名添加到 .gitignore 文件中,以确保在以后的提交中都被排除在外。

要达到这个目的,应该先在 Node.js 项目的根目录中创建一个 .env 文件:

代码语言:javascript
代码运行次数:0
运行
AI代码解释
复制
$ touch .env

并以 NAME = VALUE 的形式在添加特定于环境的变量。

代码语言:javascript
代码运行次数:0
运行
AI代码解释
复制
# .env
PASSWORD="12345"

太好了!现在有了一个带有我们想要使用的变量的 .env 文件。但是应该如何将该变量加载到我们的代码中呢?

最简单的方法是使用名为 dotenv 【https://github.com/motdotla/dotenv#readme】的 npm 模块。它将为我们完成所有繁重的工作。

你可以使用以下命令中的任何一个来安装它:

代码语言:javascript
代码运行次数:0
运行
AI代码解释
复制
# Npm
npm install dotenv --save

# Yarn
yarn add dotenv

成功安装 npm 软件包后,将以下两行添加到入口文件的顶部:

代码语言:javascript
代码运行次数:0
运行
AI代码解释
复制
//Node.js
const dotenv = require("dotenv")
dotenv.config()

在程序中尽早添加 dotenv.config() 这一行,以确保所有代码都可以访问你的变量。

process.env 现在具有在 .env 文件中定义的键和值。

你可以通过在 .env 文件中记录变量来测试它:

代码语言:javascript
代码运行次数:0
运行
AI代码解释
复制
// Node.js
console.log(process.env.PASSWORD) //"12345"

运行代码时,应该能够在命令行输出中看到变量的值。

查看 dotenv 文档获取更多信息。【https://github.com/motdotla/dotenv】

希望本文对你的编码工作很有帮助!感谢阅读,请在下面的评论中告诉我你的想法。

原文:https://coderrocketfuel.com/article/how-to-load-environment-variables-from-a-.env-file-in-nodejs

本文参与 腾讯云自媒体同步曝光计划,分享自微信公众号。
原始发表:2019-08-13,如有侵权请联系 cloudcommunity@tencent.com 删除

本文分享自 前端先锋 微信公众号,前往查看

如有侵权,请联系 cloudcommunity@tencent.com 删除。

本文参与 腾讯云自媒体同步曝光计划  ,欢迎热爱写作的你一起参与!

评论
登录后参与评论
暂无评论
推荐阅读
编辑精选文章
换一批
selenium的一些js操作
3.这里可以修改scrollTop 的值,来定位右侧滚动条的位置,0是最上面,10000是最底部。
周小董
2019/03/25
1.8K0
来实现一个js平滑滚动到顶部的小功能
更多内容请见原文,原文转载自:https://blog.csdn.net/weixin_44519496/article/details/120074347
马克社区
2022/07/18
1.2K0
js中的防抖和节流
原理:设置一个定时器,如果在设定的时间间隔内事件再次触发,就会清除上一次的定时器并重新设置和计时,直到指定时间间隔内没有再次触发,才会执行函数
前端小tips
2021/11/24
1.8K0
js中的防抖和节流
页面滚动事件
HTML DOM事件大全:https://www.runoob.com/jsref/dom-obj-event.html
阿超
2022/08/17
2.1K0
实现瀑布流布局
瀑布流,又称瀑布流式布局。是比较流行的一种网站页面布局,视觉表现为参差不齐的多栏布局,随着页面滚动条向下滚动,这种布局还会不断加载数据块并附加至当前尾部,瀑布流的主要特性便是错落有致,定宽而不定高的设计让页面区别于传统的矩阵式图片布局模式。
WindRunnerMax
2020/08/27
9110
纯滚动怎么理解_scrollview不滚动
  前面两篇博文分别介绍过偏移大小、客户区大小。本文介绍元素尺寸中内容最多的一部分——滚动scroll
全栈程序员站长
2022/09/20
2.2K0
iOS微信浏览器input聚焦导致页面上移,不能恢复的解决方法
H5页面在iOS系统微信浏览器中,input focus 聚焦时页面会被上推,导致页面整体上移。blur 失焦后不能恢复,再次点击 input 时没反应,不能聚焦,无法输入内容,这时候需要滑动一下页面才能恢复正常。
德顺
2020/03/05
3.4K0
iOS微信浏览器input聚焦导致页面上移,不能恢复的解决方法
vue css 滚动楼层导航定位
理解滚动图 左右结构 <template> <div> <div class="floor-nav"> <ul class="nav-list"> <li
solate
2021/03/05
3.2K0
vue css 滚动楼层导航定位
JS滑动滚动的n种方式
scrollIntoView对页面元素调用,会滚动元素的父容器,将该元素滚动到浏览器的可视区域
源心锁
2022/08/12
7K0
JS滑动滚动的n种方式
手把手教你实现在页面顶部实时反馈当前阅读的进度条
原文链接:https://blog.csdn.net/qq_43624878/article/details/109993036
winty
2021/03/09
5740
【前端词典】滚动穿透问题的解决方案
随着移动端市场的份额越大,需求就越多样化。我们今天讨论的是移动端的滚动穿透问题。上面这段调侃的话可以看出需求中弹窗浮层还是挺常见的,那这个和滚动穿透有什么联系呢?
小生方勤
2019/06/01
1K0
js滚动到页面顶部
js平滑滚动到顶部,底部,指定地方 采用锚点进行页面中的跳转的确很方便,但是要想增加网页的效果,可以使用jquery中的animate,实现滚动的一个动作,慢慢的滚动到你想跳转到的位置 滚动到顶部:
IT工作者
2022/01/15
14.3K0
javascript基础-3
window.resizeBy(XX[px],YY[px]);——窗口尺寸变化的单位为:±XX,±YY (单位/px); window.resizeTo(XX[px],YY[px]);——窗口尺寸变换为:XX,YY(单位/px); window.scrollBy(XX[px],YY[px]);——屏幕滚动的单位为:±XX,±YY (单位/px); window.scrollToo(XX[px],YY[px]);———屏幕滚动到数据位置:XX,YY(单位/px); object.onscroll();onscroll事件:元素滚动时执行..; document.Element.scrollTop||document.body.scrollTop;回顶;
py3study
2020/01/13
1.1K0
vue3实现元素监听滚动事件
使用的时候,通过监听到达底部的变量改变,可以做想做的事情,比如加载更多,或跳转页面等。
蓓蕾心晴
2023/06/10
2.6K0
vue 环境下,封装一个滚动模块曝光事件
vue 环境下,封装一个滚动模块曝光事件 背景 写业务代码的时候,可能经常遇到滚动,然后,具体曝光某个模块的情况 下面是封装的函数,还有具体的使用 code import { jsBridge } from 'xxx-xx'; export default { data () { return { viewHeight: null, scrollEventFun: null } }, mounted ()
玖柒的小窝
2021/11/06
6330
详情页返回到列表页定位处理
在H5页面的电商系统中往往会有以下需求: 点击分类等跳转到商品列表页,点击某个商品之后再返回到列表页,返回列表页面的时候能记住之前浏览的位置:
日薪月亿
2019/05/14
1.5K0
蒙层禁止页面滚动的方案
弹窗是一种常见的交互方式,而蒙层是弹窗必不可少的元素,用于隔断页面与弹窗区块,暂时阻断页面的交互。但是在蒙层出现的时候滚动页面,如果不加处理,蒙层底部的页面会开始滚动,实际上我们是不希望他进行滚动的,因此需要阻止这种行为。当弹出蒙层时禁止蒙层下的页面滚动,也可以称为滚动穿透的问题,文中介绍了一些常用的解决方案。
WindRunnerMax
2022/05/06
6.5K0
vue中返回顶部封装的组件 滚动一定位置显示隐藏
用两个不同方式写的返回顶部 返回顶部子组件1 <template> <div> <div @click="backtop" class="fh" v-show="isShow">顶部1</div> </div> </template> <script> export default { data() { return { isShow: false, }; }, mounted() { this.listenerFunction();
江一铭
2022/06/16
1.9K0
vue中返回顶部封装的组件 滚动一定位置显示隐藏
【前端词典】4 种滚动吸顶实现方式的比较
我入职第二家公司接到的第一个需求就是修复之前外包做的滚动吸顶效果。我当时很纳闷为何一个滚动吸顶会有 bug,后来我查看代码才发现直接用的是 offsetTop 这个属性,而且并没有做兼容性处理。
小生方勤
2019/06/01
2.6K0
native 嵌套H5弹出虚拟键盘遮挡界面及其input 文本框上提及其置顶显示
      在于你的布局,可以用定位position:fixed;来做处理,因为他相对于页面来说,定位于屏幕一定的位置。
White feathe
2021/12/08
1.2K0
相关推荐
selenium的一些js操作
更多 >
领券
问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档
本文部分代码块支持一键运行,欢迎体验
本文部分代码块支持一键运行,欢迎体验