简体   繁体   English

Ionic 3 Prod Build版本号

[英]Ionic 3 Prod Build With Version Number

I use the following command when building an ionic project for desktop 在为桌面构建离子项目时,我使用以下命令

ionic cordova build browser --prod 离子cordova构建浏览器--prod

Which results in the following file being generated 这导致生成以下文件

build/main.js 建立/ main.js

However I would like to be able to add a version number to the generated file automatically as part of the build process. 但是,我希望能够在生成过程中自动为生成的文件添加版本号。 So would end up with something like 所以最终会有类似的东西

build/main.js?version=1.00 建/ main.js?版本= 1.00

as to avoid needing to clear the browser cache after every prod build. 为了避免在每次prod构建之后需要清除浏览器缓存。

Is there a flag for this, or is it something I must do manually? 是否有这样的标志,还是我必须手动做的事情?

Any advice would be great! 任何建议都会很棒!

EDIT: 编辑:

My solution is on GitHub for anyone interested! 对于任何有兴趣的人,我的解决方案都在GitHub上!

https://github.com/RichardM99/ionic-3-version-build-file-hook https://github.com/RichardM99/ionic-3-version-build-file-hook

Here's some advice - You can create a cordova hook. 这里有一些建议 - 你可以创建一个cordova钩子。

Hooks are scripts that you want to be executed at different stages of the build process. 挂钩是您希望在构建过程的不同阶段执行的脚本。 In your case, you are looking at a script which renames the main.js file after the build event is finished, or in other words a 'after_build' type hook. 在您的情况下,您正在查看在构建事件完成后重命名main.js文件的脚本,或者换句话说是'after_build'类型的钩子。

The script will usually be a Node.js file, although you can have other types of scripts executed as well. 该脚本通常是Node.js文件,但您也可以执行其他类型的脚本。

One more thing. 还有一件事。 Since you want to get around cache, you wont be renaming the file itself. 由于你想绕过缓存,你不会重命名文件本身。 What you will want to do is rather replace the reference to "main.js" in you "index.html" to include a random or maybe your actual version number. 您要做的是将“index.html”中的“main.js”引用替换为包含随机或可能的实际版本号。

I have pointed you in a direction, but won't spoonfeed. 我已指出你的方向,但不会舀勺。 Look up documentation on cordova hooks. 查看有关cordova挂钩的文档。 They are super simple if you understand Javascript/Node 如果您了解Javascript / Node,它们非常简单

Something like this should get the job done: 这样的事情应该完成工作:

var index_orig = fs.readFileSync(path-to-index.html, 'utf8');
var index_new = index_orig.replace("main.js", "main.js?version="+version_num);
fs.writeFileSync(path-to-index.html, index_new, 'utf8');

If you want the actual build number, you can read your config.xml and parse it to get it's value. 如果你想要实际的构建号,你可以读取你的config.xml并解析它以获得它的价值。

Hope it helps. 希望能帮助到你。

I wrote blog long time ago 我很久以前写过博客

In my build pipeline i have command to set version 在我的构建管道中,我有命令设置版本

version "$(app.versionPrefix)$(Build.BuildNumber)"

$(app.versionPrefix) - is a prefix version such as 0.1. $(app.versionPrefix) - 是一个前缀版本,如0.1。

$(Build.BuildNumber) - is build version $(Build.BuildNumber) - 是构建版本

Then I have environment file 然后我有环境文件

export const environment = {
    apiUrl: 'https://....',
    production: true,
    version: '0.0.57'                                     
}

Then i have js script to update version in environment and config.xml 然后我有js脚本来更新环境和config.xml中的版本

var replace = require('replace-in-file');
var package = require("./package.json");
var buildVersion = package.version;
const options = {
    files: ['config.xml'],
    from: /" version="([0-9]*.[0-9]*.[0-9]*)"/g,
    to: "\" version=\""+ buildVersion + "\"",
    allowEmptyPaths: false,
};

const optionsEnv = {
     files: ['src/environments/environment.prod.ts'],
    from: /version: '(.*)'/g,
    to: "version: '"+ buildVersion + "' ",
    allowEmptyPaths: false,
};

try {
    let changedFiles = replace.sync(options);
    if (changedFiles == 0) {
        throw "Please make sure that file '" + options.files + "' has \"version: ''\"";
    }
    changedFiles = replace.sync(optionsEnv);
    if (changedFiles == 0) {
        throw "Please make sure that file '" + optionsEnv.files + "' has \"version: ''\"";
    }
    console.log('Build version set: "' + options.to + '"');
}
catch (error) {
    console.error('Error occurred:', error);
    throw error
}

NOTE: you need to install plugin replace-in-file 注意:您需要安装插件替换文件

Then in build pipe line I am running this script 然后在构建管道中我运行这个脚本

node ./replace.build.js

In your case if you need only for browser you can tune script. 在您的情况下,如果您只需要浏览器,您可以调整脚本。

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM