Cordova config.xml 环境变量 [英] Cordova config.xml environment variables
问题描述
我正在构建一个 Ionic3
应用程序,并且我的 config.xml
有一些我希望能够根据我的环境更改的数据(例如,我希望我的 Facebook 应用程序 ID 在开发、登台和生产方面具有不同的价值).
I'm building an Ionic3
application, and my config.xml
have some data that I want to be able to change according to my environment (for example, I want that my facebook app id have different values for development, staging and production).
我通过创建模板 config.xml
(文件为 config.tpl.xml
)和 before_prepare
cordova 实现了这一点
钩子将模板中的变量替换为正确的值,并将生成的内容保存在 config.xml
中.
I achieved this creating a template config.xml
(the file is config.tpl.xml
) and a before_prepare
cordova
hook to replace the variables in the template with the correct values and save the generated content in config.xml
.
cordova
钩子使用 npm
包 es6-template-strings
:
The cordova
hook uses the npm
package es6-template-strings
:
npm install es6-template-strings --save-dev
钩子是:
#!/usr/bin/env node
var fs = require('fs');
var path = require('path');
var compile = require('es6-template-strings/compile');
var resolveToString = require('es6-template-strings/resolve-to-string');
var ROOT_DIR = process.argv[2];
var FILES = {
SRC: "config.tpl.xml",
DEST: "config.xml"
};
var env = process.env.NODE_ENV || 'dev';
var envFile = 'src/environments/environment.' + env + '.json';
var srcFileFull = path.join(ROOT_DIR, FILES.SRC);
var destFileFull = path.join(ROOT_DIR, FILES.DEST);
var configFileFull = path.join(ROOT_DIR, envFile);
var templateData = fs.readFileSync(srcFileFull, 'utf8');
var configData = fs.readFileSync(configFileFull, 'utf8');
var config = JSON.parse(configData);
var compiled = compile(templateData);
var content = resolveToString(compiled, config);
fs.writeFileSync(destFileFull, content);
我在 src/environments/
目录中有不同环境的文件,这些文件是根据我构建 cordova<时定义的
NODE_ENV
值选择的/代码>.例如,如果 NODE_ENV=prod
(生产),那么它将使用文件 environment.prod.json
:
I have files in the src/environments/
directory for different environments, that are chosen based on the NODE_ENV
value that is defined when I build cordova
. For example, if NODE_ENV=prod
(production), then it would use the file environment.prod.json
:
{
...
"FACEBOOK_APP_ID": "11111111",
"FACEBOOK_APP_NAME": "My Facebook App Name",
...
"PUSH_SENDER_ID": "22222222",
...
}
钩子执行时,cordova.tpl.xml
中的这部分:
When the hook is executed, this part in the cordova.tpl.xml
:
<plugin name="cordova-plugin-facebook4" spec="~1.7.4">
<variable name="APP_ID" value="${FACEBOOK_APP_ID}" />
<variable name="APP_NAME" value="${FACEBOOK_APP_NAME}" />
</plugin>
<plugin name="phonegap-plugin-push" spec="~1.9.2">
<variable name="SENDER_ID" value="${PUSH_SENDER_ID}" />
</plugin>
变成:
<plugin name="cordova-plugin-facebook4" spec="~1.7.4">
<variable name="APP_ID" value="11111111" />
<variable name="APP_NAME" value="My Facebook App Name" />
</plugin>
<plugin name="phonegap-plugin-push" spec="~1.9.2">
<variable name="SENDER_ID" value="22222222" />
</plugin>
问题:
到目前为止一切顺利.问题是当对 config.xml
进行一些自动更改(比如添加插件)时,它并没有反映在 cordova.tpl.xml
中,所以我必须记住手动进行更改.
The problem:
So far so good. The problem is that when some automatic changes are done to config.xml
(like adding plugins), it is not reflected in cordova.tpl.xml
, so I have to remember to make the changes manually.
虽然现在完成的方式仍然比以前必须添加每个环境变量要好得多(这是维护的噩梦并且容易出错),但我仍然必须在每次添加/更改/删除时更改模板一个插件(不是那么频繁,忘记了也容易发现问题,但离理想还差得很远).
Although the way it is done now is still much better than having to add each environment variable like before (it was a maintenance nightmare and error prone), I still have to change the template every-time a add/change/remove a plugin (not so frequent, and easy to discover the problem when I forget it, but still far from the ideal).
我想知道是否有办法避免这些手动更改,但要像现在一样继续使用环境变量.
I would like to know if there is a way avoid these manual changes, but keep using the environment variables like I'm doing now.
可以实现对 config.xml
的自动更改以对 config.tpl.xml
进行(例如添加带有 的插件时--save
),如果可能的话,但我没有找到任何关于此的 cordova
选项.
It could be achieved making the automatic changes to config.xml
to be done to config.tpl.xml
instead (like when adding a plugin with --save
), if possible, but I haven't found any cordova
option about this.
或者使用 config.xml
作为模板并将其发送到另一个定义了变量的地方(例如到 www/config.xml
),并使用 config.xml
在用于构建应用程序的其他位置(不是根中的 config.xml
,即模板).我只会更改我的钩子中的 src
和 dest
文件(更改为 config.xml
和 www/config.xml
,分别).但我也没有找到实现这一点的方法.
Or using the config.xml
as the template and send it to another place with the variables defined (e.g. to www/config.xml
), and use the config.xml
in the other location to be used to build the app (not the config.xml
in the root, i.e., the template). I would only change the src
and dest
files in my hook (to config.xml
and www/config.xml
, respectively). But I also haven't found a way to achieve this.
对此有什么想法吗?
(它不需要是特定于 Ionic 的解决方案.)
根据 Bobby 的回答,我在安装和卸载插件时都实现了我想要的.我创建了 4 个钩子:after_plugin_add
、after_plugin_rm
、before_plugin_add
、before_plugin_rm
.
Based on Bobby's answer, I achieved what I wanted both when installing and uninstalling a plugin. I've created 4 hooks: after_plugin_add
, after_plugin_rm
, before_plugin_add
, before_plugin_rm
.
before
挂钩将模板 (config.tpl.xml
) 复制到 config.xml
文件和 after
钩子正好相反.
The before
hooks copy the template (config.tpl.xml
) into the config.xml
file and the after
hooks do the inverse.
before_plugin_add
和 before_plugin_rm
钩子如下:
#!/usr/bin/env node
var fs = require('fs');
var path = require('path');
var ROOT_DIR = process.argv[2];
var FILES = {
SRC: 'config.tpl.xml',
DEST: 'config.xml'
};
var srcFileFull = path.join(ROOT_DIR, FILES.SRC);
var destFileFull = path.join(ROOT_DIR, FILES.DEST);
var templateData = fs.readFileSync(srcFileFull, 'utf8');
fs.writeFileSync(destFileFull, templateData);
after_plugin_add
和 after_plugin_rm
钩子几乎相同,只是交换了 FILES.SRC
和 FILES.DEST
值.
The after_plugin_add
and after_plugin_rm
hooks are almost identical, just swapping FILES.SRC
and FILES.DEST
values.
推荐答案
一种解决方案是为 before_plugin_install 和 after_plugin_install 创建挂钩.
One solution could be to create hooks for before_plugin_install and after_plugin_install.
On before_plugin_install copy the cordova.tpl.xml to cordova.xml.
... Plugin is installed ...
On after_plugin_install copy cordova.xml to cordova.tpl.xml
这篇关于Cordova config.xml 环境变量的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!