polymer - 在 Polymer 应用程序中设置阶段特定环境的首选方法是什么？

Question

我正在通过 polymer init starter-kit 使用来自应用程序模板的 Polymer 构建网络应用程序.

我有一些特定于阶段的环境变量，例如后端 API 入口点。这些环境变量有一个行为:

<script>
  EnvBehavior = {
    properties: {
      apiBaseUrl: {
        type: String,
        // value: '//some-url.com'     // production
        value: 'http://localhost:8000' // development
      }
    }
  };
</script>

和 apiBaseUrl用于其他元素:

<dom-module id="my-element">
  <template>
    <iron-ajax url="{{apiBaseUrl}}/foo" method="POST" 
           content-type="application/x-www-form-urlencoded" 
           body="{{requestBody}}" handle-as="json" 
           on-response="onResponse" on-error="onError"></iron-ajax>
  </template>
  <script>
    Polymer({
      is: 'my-element',
      properties: {
        requestBody: {foo: 'bar'}
      },
      behaviors: [EnvBehavior],
      onResponse: function(e) {
        console.log(e.detail.response);
      },
      onError: function(e) {
        console.log(e.detail.request.xhr.response);
      }
    });
  </script>
</dom-module>

这有效。但我想用 apiBaseUrl 构建一个用于生产的应用程序的默认值 //some-url.com ，这在代码中被注释掉了。如何在构建时有效地设置阶段特定变量？我使用 polymer cli 进行构建；运行 polymer build .

Answer 1

因为看起来您已经在使用单独的 JS 文件来实现 EnvBehavior ，您可以执行以下操作。创建此文件的多个版本，例如:

env-behavior.js (本地),

env-behavior.js.stage (用于舞台)和

env-behavior.js.production (用于生产)。

显然，在每个文件中放置适当的配置值。

有了这个，你什么时候会使用 polymer serve一切都应该适用于本地版本(因为它在没有文件交换完成时默认包含在内)。但是当您为特定环境构建时，您只需覆盖 env-behavior.js比如说， env-behavior.js.production部署到生产时。

对于交换文件，您可以创建手动构建后吞咽任务，甚至可以自定义 polymer build命令通过改变 polymer-build代码。

此外，我强烈建议再次使用客户端检查来选择适当的配置值，因为:

代码比较复杂

它引入了不必要的开销

每个人都可以看到其他配置值(例如其他环境的位置，然后可以成为恶意用户的目标)

看起来不对。