时间戳

首页 > 解决方案 > JavaScript / Angular 中的属性文件

javascript - JavaScript / Angular 中的属性文件

问题描述

在 Java 中，我通常application.properties在我的资源文件夹中创建并将配置放在那里。

当我需要它时，我只是做Properties prop = new Properties(); prop.load(... my file)然后使用prop.getProperty("Something")

我想在 Javascript 中做类似的事情

在我的 js 代码中，我有这个：

// REST API Base URL
var baseUrl = "http://localhost:8083/api";

我希望它位于 application.properties 文件中，然后加载该值。

我怎样才能做到这一点？

谢谢

标签： javascript

解决方案

在 Angular 2+ 项目中，为了获得良好的实践，您应该创建环境文件夹，每个环境都有一个文件，例如：environment.js、environment.prod.js。

并进入文件，您可以导出一个常量或默认情况下这样

export const environment = {
  apiUrl: '',
  googleApiKey: '',
}

你可以在你需要的每个文件中导入这个环境，比如

import { environment } from '{relativePath}/environment/environment.js'

如果您为每个环境创建不同的文件，例如 prod. 您需要将 environment.js 替换为您将要构建的环境。你有很多关于 webpack 或其他编译器的信息。

我强烈建议你开发成一个 common.js 项目。它对您导入模块会更加友好，并且您将拥有可扩展应用程序的强大可能性。

但简单（丑陋）的解决方案是：

索引.html

<head>
  <script src="environment.js">
  <script src="app.js">
</head>

环境.js

// Declaring environment like that you will have window scoped the variable
// and you will have global access to environment with window.environment
var environment = {apiUrl: 'https://api.url:4100'}

应用程序.js

function example(){
  console.log(window.environment.apiUrl); // out https://api.url:4100
}

推荐阅读