logo

该视频仅会员有权观看

立即开通课程「Nuxt.js 前端应用开发实践」权限。

¥
199
/ 年

Nuxt 项目中的运行时配置(runtimeConfig)

In the Max project, to use application configurations, one needs to utilize the configurations defined in the app config which are publicly available. Similarly, one can add configurations to the nx project, which can be used server-side or as public configurations. These configurations can be overridden by environment variables. Inside the project's nx config, a runtime config object can be added, where private configurations are directly inserted, and public configurations can be placed under the public attribute. For example, one can add an API base URL as a public configuration.

To use this runtime config in the project, one can employ the use runtime config utility, which provides the project's configurations. To access the API base URL, first destructure the public object, and then destructure the API base URL from it. The value of the API base URL will appear in the browser's console if observed.

Environment variables can overwrite the runtime config settings. To test this, create a .env file in the project root and define an environment variable starting with nx followed by public and then the API base key. Set its value, remove the API base URL from the runtime config, and leave it blank. After restarting the project's development service, the output of the API base URL in the browser console should still display the value defined in the .env file, demonstrating that environment variables can override runtime configurations.