Issue in building the open source chart widget i.e: cumulocity-device-chart-widget

Hi Team,

I have downloaded the open source custom widget from below URL:
GitHub - SoftwareAG/cumulocity-device-chart-widget: This is an Angular 8 widget, which is designed to display the chart based on the device-specific inventory data. Runtime installation available. Created by Global Presales..
Widget name is: cumulocity-device-chart-widget.
Below script its mention the file format but after build successfully i haven’t found any below format.

“scripts”: {
“ng”: “ng”,
“start”: “ng serve”,
“build”: “ng build”,
“test”: “ng test”,
“lint”: “ng lint”,
“e2e”: “ng e2e”,
“buildPatch”: “cd projects/gp-lib-device-chart && npm version patch && ng build gp-lib-device-chart && cd …/…/dist/gp-lib-device-chart && npm pack && move *.tgz …/”,
“buildMinor”: “cd projects/gp-lib-device-chart && npm version minor && ng build gp-lib-device-chart && cd …/…/dist/gp-lib-device-chart && npm pack && move *.tgz …/”,
“buildMajor”: “cd projects/gp-lib-device-chart && npm version major && ng build gp-lib-device-chart && cd …/…/dist/gp-lib-device-chart && npm pack && move *.tgz …/”,
“serve”: “ng build gp-lib-device-chart && npm i dist/gp-lib-device-chart && ng s”,
“runtime”: “gulp --gulpfile ./runtime/gulpfile.js”
}.

Please find below logs:
C:\Users\user\Downloads\cumulocity-device-chart-widget-master>npm run build

gp-device-chart@1.0.0 build
ng build

Generating ES5 bundles for differential loading…
ES5 bundle generation complete.

chunk {polyfills} polyfills-es2015.js, polyfills-es2015.js.map (polyfills) 269 kB [initial] [rendered]
chunk {polyfills-es5} polyfills-es5.js, polyfills-es5.js.map (polyfills-es5) 707 kB [initial] [rendered]
chunk {runtime} runtime-es2015.js, runtime-es2015.js.map (runtime) 6.16 kB [entry] [rendered]
chunk {runtime} runtime-es5.js, runtime-es5.js.map (runtime) 6.16 kB [entry] [rendered]
chunk {main} main-es2015.js, main-es2015.js.map (main) 124 kB [initial] [rendered]
chunk {main} main-es5.js, main-es5.js.map (main) 142 kB [initial] [rendered]
chunk {styles} styles-es2015.js, styles-es2015.js.map (styles) 9.75 kB [initial] [rendered]
chunk {styles} styles-es5.js, styles-es5.js.map (styles) 11 kB [initial] [rendered]
chunk {vendor} vendor-es2015.js, vendor-es2015.js.map (vendor) 12.1 MB [initial] [rendered]
chunk {vendor} vendor-es5.js, vendor-es5.js.map (vendor) 14.1 MB [initial] [rendered]
Date: 2021-03-09T09:40:21.064Z - Hash: ee61b3e2d54812acc6bc - Time: 25205ms

Thanks,
Thamizharasan

Could you confirm if you are trying to use this widget with Cockpit or application builder?

Application builder.

I assume you are trying to deploy this to the code rather than using the runtime installation option?

Not a runtime installation, i’m trying with build version installation.

We followed the same steps in the documentation but it would appear we need to make some corrections.

  • Step1 :npm i this will create node_modules

  • Step2: npm run build this will create distribution folder as shown below.

    C:\Users<usernane>\Downloads\cumulocity-device-chart-widget-master\cumulocity-device-chart-widget-master\dist\GpDeviceChart

  • Step 3: You can then execute one the following while in the folder C:\Users\user\Downloads\cumulocity-device-chart-widget-master. npm run buildMinor or npm run buildMajor or npm run buildPatch

  • Step 4: Follow the instructions under the section Installation Steps For App Builder: in the documentation.

We will update the docs to make it clearer…

I hope this helps.

PS I prefer to use the runtime installation unless you intend to make code changes. Much easier :slight_smile: