Search code examples
cumulocity

How to install the latest 1004.x cumulocity UI package [ng1]?

How can I update my custom app to the latest (current 1004.x) cumulocity UI package using the old ng1 command line tools?

Updating to a previous 9.x version works fine:

>c8y install 9.20.13
Installing 9.20.13 UI Package...
npm+ [email protected]
updated 1 package and audited 1 package in 30.478s
found 0 vulnerabilities
9.20.13 UI package installed

But trying to update to any version >= 1004.0 fails:

>c8y install 1004.0.6 
1004.0.6 UI not found

By the way, c8y install latest always installs version 9.20.8.

Solution

  • Cumulocity Web SDK got migrated to ngx (Angular 2+) which means you need to upgrade your application as the old SDK and build tooling is not supported anymore. The following table gives you an overview: enter image description here

    So basically you can just use the tooling until version 9.25.x, afterwards you need to use the new @c8y/cli tool. More information about the migration process can be found here.

    Migrating is quite easy as all ng1 plugins can be integrated into a ngx application:

    1. npm i -g @c8y/cli install the new tooling
    2. c8ycli new your-app-name cockpit Create a new app based on the cockpit app.
    3. cd your-app-name && npm install open the new created folder and install the dependencies
    4. Copy your custom plugins to the folder
    5. Open ng1.ts and replace the not needed plugin references. Reference your custom plugins to point to the cumulocity.json manifest (e.g. import './my-plugin/cumulocity.json')
    6. run your app locally npm start -- -u http://yourinstance.cumulocity.com
    7. Go to your browser and check if the application work (look out for errors in the console as well!): http://localhost:9000/apps/your-app-name/
    8. Deploy you application if everything is fine: npm run build && npm run deploy
    9. done

    Cumulocity applications after version 10.04.x.x are now running Angular (ngx) and angularjs (ngx) at the same time (so-called hybrid applications) which allows you to use the new Angular framework while you can still use your already developed plugins.