{"id":20931569,"url":"https://github.com/johnwargo/ionic-build-info","last_synced_at":"2025-10-29T01:09:58.266Z","repository":{"id":57275934,"uuid":"333068192","full_name":"johnwargo/ionic-build-info","owner":"johnwargo","description":"Updates a build info module in an Ionic project","archived":false,"fork":false,"pushed_at":"2022-04-03T19:58:39.000Z","size":26,"stargazers_count":4,"open_issues_count":0,"forks_count":1,"subscribers_count":3,"default_branch":"main","last_synced_at":"2024-11-13T18:18:07.821Z","etag":null,"topics":["ionic","npm","typescript"],"latest_commit_sha":null,"homepage":"","language":"JavaScript","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":null,"status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/johnwargo.png","metadata":{"files":{"readme":"readme.md","changelog":null,"contributing":null,"funding":null,"license":null,"code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null}},"created_at":"2021-01-26T11:48:14.000Z","updated_at":"2023-01-11T13:46:50.000Z","dependencies_parsed_at":"2022-09-15T19:12:58.668Z","dependency_job_id":null,"html_url":"https://github.com/johnwargo/ionic-build-info","commit_stats":null,"previous_names":[],"tags_count":0,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/johnwargo%2Fionic-build-info","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/johnwargo%2Fionic-build-info/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/johnwargo%2Fionic-build-info/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/johnwargo%2Fionic-build-info/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/johnwargo","download_url":"https://codeload.github.com/johnwargo/ionic-build-info/tar.gz/refs/heads/main","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":225255842,"owners_count":17445418,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2022-07-04T15:15:14.044Z","host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"keywords":["ionic","npm","typescript"],"created_at":"2024-11-18T21:44:12.634Z","updated_at":"2025-10-29T01:09:53.241Z","avatar_url":"https://github.com/johnwargo.png","language":"JavaScript","funding_links":["https://www.buymeacoffee.com/johnwargo"],"categories":[],"sub_categories":[],"readme":"# Ionic Build Info\n\nWhile building a desktop web application using the [Ionic Framework](https://ionicframework.com/), I realized that for support purposes I wanted the ability to display the app's build number (or even build date) in the application somewhere. I started looking for a solution and didn't find one, so I built this module.\n\n## Installation\n\nInstall the module by opening a terminal window and executing the following command:\n\n```shell\nnpm install --save-dev ionic-build-info\n```\n\n## Operation\n\nWhen you execute the module, it reads the local Ionic project's `package.json` file, and, using the file's `version` property and the current date/time, creates a new file in the project at `src/app/buildinfo.ts` containing the following information:\n\n```typescript\nexport const buildInfo = {\n  buildVersion: \"0.0.4\",\n  buildDate: 1611670976033\n}\n```\n\nTo import the generated module in a page script, use the following:\n\n```typescript\nimport { buildInfo } from '../buildinfo';\n```\n\nWhen you import this file into your Ionic project, the app has access to the project's build details. Here's an example of how to use the generated module in your app, the following code is from a simple page that outputs the build information to the browser's console:\n\n```typescript\nexport class HomePage {\n\n  appBuildNumber: string = '';\n  appBuildDate: Date;\n\n  constructor() {\n    this.appBuildNumber = buildInfo.buildVersion;\n    this.appBuildDate = new Date(buildInfo.buildDate);\n\n    console.log(`Build Number: ${this.appBuildNumber}`);\n    console.log(`Build Date: ${this.appBuildDate}`);\n  }\n \n}\n```\n\nTo use the values in a page's content, use something like the following:\n\n```html\n\u003cp\u003eBuild: {{this.appBuildNumber}} [{{this.appBuildDate}}]\u003c/p\u003e\n```\n\n## Usage\n\nOpen the project's `package.json` file and add this process to the existing `build` script entry, changing:\n\n```text\n\"build\": \"ng build \",\n```\n\nto:\n\n```text\n\"build\": \"npm version patch \u0026\u0026 ionic-build-info \u0026\u0026 ng build \",\n```\n\nThe `npm version patch` part of the build step increments the patch version in the `package.json` file before calling `ionic-build-info`.\n\nWith this in place, when you execute `ionic build` to build a production version of the app, `npm` will update the version number in the project's `package.json` file, build an updated version of the buildinfo.js file, then generate the production build of the app.\n\n***\n\nYou can find information on many different topics on my [personal blog](http://www.johnwargo.com). Learn about all of my publications at [John Wargo Books](http://www.johnwargobooks.com).\n\nIf you find this code useful and feel like thanking me for providing it, please consider \u003ca href=\"https://www.buymeacoffee.com/johnwargo\" target=\"_blank\"\u003eBuying Me a Coffee\u003c/a\u003e, or making a purchase from [my Amazon Wish List](https://amzn.com/w/1WI6AAUKPT5P9).\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fjohnwargo%2Fionic-build-info","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fjohnwargo%2Fionic-build-info","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fjohnwargo%2Fionic-build-info/lists"}