您好,欢迎访问一九零五行业门户网

Node项目如何配置环境,让其支持可扩展?

本篇文章给大家介绍一下配置环境让node项目支持可扩展的方法,希望对大家有所帮助!
因node项目开发的较少没涉及到环境变量切换,但是经常做前端项目开发总是会遇到,比如在vue的项目可以配置.env.xxx.xxx并要求环境变量的配置要以vue_app_开头,why?,我们就一起来探索一下vue项目的环境变量是怎么加载并解析的,我们再移植到node项目中。【推荐学习:《nodejs 教程》】
探索vue中环境配置的加载:先来看看vue cli关于模式和环境变量的说明,我们看到有这么一段话:想要了解解析环境文件规则的细节,请参考 dotenv。我们也使用 dotenv-expand 来实现变量扩展 (vue cli 3.5+ 支持)。我们先用vue cli来创建一个vue项目。
探索第一步:
在package.json中通过执行scripts的命令都使用到了@vue/cli-service包
探索第二步:
@vue/cli-service包确实安装了官网提示的两个依赖包,并在bin目录下的vue-cli-service.js文件中找到了关键类service。
探索第三步:
在service中我们找到了加载环境配置的关键函数,其中的两个path分别指:.env.mode和.env.mode.local,也就是我们的环境变量文件可以支持带.local也可以不带。
思考load两次的作用?
探索第三步:
指定的前缀是怎么回事?我们在util目录下找到了答案:resolveclientenv.js,最终是由defineplugin插件加载到了全局的配置中。
思考base_url的设置?
为携带webpack的node项目中增加环境配置准备webpack项目环境
准备webpack.config.js
新增env-helper.js,我们一起来实现一下:
必备依赖装一下
npm install dotenv --savenpm install dotenv-expand --save
解析环境变量文件
/** * 解析环境变量文件 * @param {*} mode */const loadenv = (mode) => { const basepath = path.resolve(__dirname, `.env${mode ? `.${mode}` : ``}`); const localpath = `${basepath}.local`; const load = (envpath) => { try { const env = dotenv.config({ path: envpath, debug: process.env.debug }); dotenvexpand(env); } catch (err) { if (err.tostring().indexof("enoent") < 0) { console.error(err); } } }; load(localpath); load(basepath);};
符合前缀的环境变量对象
将符合正则条件的和特殊的进行整合后返回,通过注入到defineplugin插件中。
/** * 获取符合前缀规则的环境变量对象 */const prefixre = /^xxtx_app_/;const resolveclientenv = () => { const env = {}; object.keys(process.env).foreach((key) => { if (prefixre.test(key) || key === "node_env") { env[key] = process.env[key]; } }); return env;};
升级webpack.config.js来演示环境变量读取
增加演示插件和node_env配置
const webpack = require("webpack");const { loadenv, resolveclientenv } = require("./env-helper");// 解析环境配置文件// 通过cross-env 再scripts中配置node_env=developmentloadenv(process.env.node_env);// 获取符合规则的环境配置对象const env = resolveclientenv();const helloworldplugin = require("./hello-world");module.exports = { mode: "development", plugins: [ new webpack.defineplugin(env), new helloworldplugin({ options: true }), ],};
在我们的webpack插件中使用环境变量
class helloworldplugin { apply(compiler) { compiler.hooks.done.tap("helloworldplugin", () => { console.log("hello world!"); console.log("[ xxtx_app_name ] >", process.env.xxtx_app_name); console.log("[ xxtx_app_base_url ] >", process.env.xxtx_app_base_url); }); }}module.exports = helloworldplugin;
查看输出结果
结尾说明:我们可以将env-helper.js移植到其他的node项目中只是挂载配置的方式更改即可。
此次的代码全靠cv大法,你学到了吗?
更多编程相关知识,请访问:编程教学!!
以上就是node项目如何配置环境,让其支持可扩展?的详细内容。
其它类似信息

推荐信息