angular: Unable to install @formio/angular 6.0.0-rc.3 version

I am using angular cli v16 and what to install @formio/angular but getting below mentioned error

  • Hosting type
    • Form.io
      • Version: 6.0.0-rc.3

Steps to Reproduce

  1. Run npm i @formio/angular@6.0.0-rc.3

Observed behavior

  npm ERR! code ETARGET
  npm ERR! notarget No matching version found for @formio/js@^5.0.0.
  npm ERR! notarget In most cases you or one of your dependencies are requesting
  npm ERR! notarget a package version that doesn't exist.

About this issue

  • Original URL
  • State: open
  • Created a year ago
  • Comments: 15 (2 by maintainers)

Most upvoted comments

Hello everyone. I am actively working to get these libraries released and synced. I appreciate your patience while I work on all the latest updates to our core renderer and this library. Hoping to have a new version out today with this fix in place.

Hey @Muntazir86 @fomin-grigorich

I was able to install Formio with Angular 16.1.8 with this minimal setup

{
  "dependencies": {
    "@angular-devkit/build-angular": "^16.1.8",
    "@angular/cli": "^16.1.8",
    "@angular/platform-browser-dynamic": "^16.1.8",
    "@angular/router": "^16.1.8",
    "@formio/angular": "^5.5.0-rc.11",
    "@formio/js": "^5.0.0-rc.18",
    "typescript": "4.9.3",
    "zone.js": "0.8.0"
  }
}

@dinbtechit Can you try with “@formio/angular”: “^5.5.0-rc.11” ?

Hello, everyone! Next command did a trick for me and now I have installed version of formio/angular npm i @formio/angular@6.0.0-rc.4 --save --legacy-peer-deps But unfortunately after ng serve the console is full of errors. Should I wait until stable release to try 6.0.0 version of formio/angular or it can be fixed somehow? Thanks!

Error: node_modules/@formio/angular/FormioBaseComponent.d.ts:86:88 - error TS2344: Type '{ form: { alias: "form"; required: false; }; submission: { alias: "submission"; required: false; }; src: { alias: "src"; required: false; }; url: { alias: "url"; required: false; }; service: { alias: "service"; required: false; }; ... 16 more ...; dataTableActions: { ...; }; }' does not satisfy the constraint '{ [key: string]: string; }'. Property '"form"' is incompatible with index signature. Type '{ alias: "form"; required: false; }' is not assignable to type 'string'. 86 static ɵcmp: i0.ɵɵComponentDeclaration<FormioBaseComponent, "ng-component", never, { "form": { "alias": "form"; "required": false; }; "submission": { "alias": "submission"; "required": false; }; "src": { "alias": "src"; "required": false; }; "url": { "alias": "u rl"; "required": false; }; "service": { "alias": "service"; "required": false; }; "options": { "alias": "options"; "required": false; }; "noeval": { "alias": "noeval"; "required": false; }; "formioOptions": { "alias": "formioOptions"; "required": false; }; "renderOptio ns": { "alias": "renderOptions"; "required": false; }; "readOnly": { "alias": "readOnly"; "required": false; }; "viewOnly": { "alias": "viewOnly"; "required": false; }; "hideLoading": { "alias": "hideLoading"; "required": false; }; "hideComponents": { "alias": "hideCom ponents"; "required": false; }; "refresh": { "alias": "refresh"; "required": false; }; "error": { "alias": "error"; "required": false; }; "success": { "alias": "success"; "required": false; }; "submitDone": { "alias": "submitDone"; "required": false; }; "language": { " alias": "language"; "required": false; }; "hooks": { "alias": "hooks"; "required": false; }; "renderer": { "alias": "renderer"; "required": false; }; "watchSubmissionErrors": { "alias": "watchSubmissionErrors"; "required": false; }; "dataTableActions": { "alias": "data TableActions"; "required": false; }; }, { "render": "render"; "customEvent": "customEvent"; "fileUploadingStatus": "fileUploadingStatus"; "submit": "submit"; "prevPage": "prevPage"; "nextPage": "nextPage"; "beforeSubmit": "beforeSubmit"; "rowAdd": "rowAdd"; "rowAdded": "rowAdded"; "rowEdit": "rowEdit"; "rowEdited": "rowEdited"; "rowDelete": "rowDelete"; "rowClick": "rowClick"; "rowSelectChange": "rowSelectChange"; "change": "change"; "invalid": "invalid"; "errorChange": "errorChange"; "formLoad": "formLoad"; "submissionLoad": "submissionLoad"; "ready": "ready"; }, never, never, false, never>;

Error: node_modules/@formio/angular/components/alerts/formio.alerts.component.d.ts:10:91 - error TS2344: Type '{ alerts: { alias: "alerts"; required: false; }; }' does not satisfy the constraint '{ [key: string]: string; }'.
  Property '"alerts"' is incompatible with index signature.
    Type '{ alias: "alerts"; required: false; }' is not assignable to type 'string'.
10     static ɵcmp: i0.ɵɵComponentDeclaration<FormioAlertsComponent, "formio-alerts", never, { "alerts": { "alias": "alerts"; "required": false; }; }, { "focusComponent": "focusComponent"; }, never, never, false, never>;
~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
Error: node_modules/@formio/angular/components/formbuilder/formbuilder.component.d.ts:35:89 - error TS2344: Type '{ form: { alias: "form"; required: false; }; options: { alias: "options"; required: false; }; formbuilder: { alias: "formbuilder"; required: false; }; noeval: { alias: "noeval"; required: false; }; refresh: { ...; }; rebuild: { ...; }; }' does not satisfy the constraint '{ [key: string]: string; }'.
  Property '"form"' is incompatible with index signature.
    Type '{ alias: "form"; required: false; }' is not assignable to type 'string'.
35     static ɵcmp: i0.ɵɵComponentDeclaration<FormBuilderComponent, "form-builder", never, { "form": { "alias": "form"; "required": false; }; "options": { "alias": "options"; "required": false; }; "formbuilder": { "alias": "formbuilder"; "required": false; }; "noeval": { "alias": "noeval"; "required": false; }; "refresh": { "alias": "refresh"; "required": false; }; "rebuild": { "alias": "rebuild"; "required": false; }; }, { "change": "change"; }, never, never, false, never>;                                                                        ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
Error: node_modules/@formio/angular/components/loader/formio.loader.component.d.ts:5:91 - error TS2344: Type '{ isLoading: { alias: "isLoading"; required: false; }; }' does not satisfy the constraint '{ [key: string]: string; }'.
  Property '"isLoading"' is incompatible with index signature.
    Type '{ alias: "isLoading"; required: false; }' is not assignable to type 'string'.
5     static ɵcmp: i0.ɵɵComponentDeclaration<FormioLoaderComponent, "formio-loader", never, { "isLoading": { "alias": "isLoading"; "required": false; }; }, {}, never, never, false, never>;
~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
Error: Can't resolve 'node_modules/formiojs/dist/formio.full.min.css' in 'E:\dev\ibricks-v2-front-end'
** Angular Live Development Server is listening on localhost:4200, open your browser on http://localhost:4200/ **
× Failed to compile.
`

Hey @Muntazir86 and @fomin-grigorich, I tried to reproduce the issue again and this time I encountered the above error. After deep digging I found that the error is caused by closed PR #970 commit 1b49037 in the /projects/angular-formio/package.json file line 31.

As a workaround you can try these steps in order to manually install the peerDependencies

npm i @formio/angular@6.0.0-rc.3 --save --legacy-peer-deps
npm i @formio/js --save --legacy-peer-deps
npm i @angular/elements

And this works for me. Let me know if it works for you guys too.

@fomin-grigorich this issue is not related to angular cli version. you can use npm i @formio/angular@5.5.0-rc.11 -f to install formio for angular 15 or 16.