Update dependencies to support Angular 13

I’m submitting a … (check one with “x”)

[X ] bug report => search github for a similar issue or PR before submitting
[ ] feature request
[ ] support request => Please do not submit support request here, post on Stackoverflow or Gitter

Current behavior

Create an Angular 13 project with the Angular CLI, then run

npm install @swimlane/ngx-datatable

I see something like this:

C:\Projects\lw\task-manager>npm install --save-dev @swimlane/ngx-datatable
npm ERR! code ERESOLVE
npm ERR! ERESOLVE unable to resolve dependency tree
npm ERR!
npm ERR! While resolving: task-manager@0.0.0
npm ERR! Found: rxjs@7.4.0
npm ERR! node_modules/rxjs
npm ERR!   rxjs@"~7.4.0" from the root project
npm ERR!   peer rxjs@"^6.5.3 || ^7.4.0" from @angular/common@13.0.0
npm ERR!   node_modules/@angular/common
npm ERR!     @angular/common@"~13.0.0" from the root project
npm ERR!     peer @angular/common@">=11.0.2" from @swimlane/ngx-datatable@20.0.0
npm ERR!     node_modules/@swimlane/ngx-datatable
npm ERR!       dev @swimlane/ngx-datatable@"*" from the root project
npm ERR!     1 more (@angular/platform-browser)
npm ERR!   1 more (@angular/core)
npm ERR!
npm ERR! Could not resolve dependency:
npm ERR! peer rxjs@"^6.6.3" from @swimlane/ngx-datatable@20.0.0
npm ERR! node_modules/@swimlane/ngx-datatable
npm ERR!   dev @swimlane/ngx-datatable@"*" from the root project
npm ERR!
npm ERR! Fix the upstream dependency conflict, or retry
npm ERR! this command with --force, or --legacy-peer-deps
npm ERR! to accept an incorrect (and potentially broken) dependency resolution.
npm ERR!
npm ERR! See C:\Users\jhouser\AppData\Local\npm-cache\eresolve-report.txt for a full report.

npm ERR! A complete log of this run can be found in:
npm ERR!     C:\Users\jhouser\AppData\Local\npm-cache\_logs\2021-11-08T00_20_48_320Z-debug.log

Expected behavior

Library should install into an Angular 13 project without issue.

Reproduction of the problem

Get this directory: https://github.com/Reboog711/LearnWith/tree/master/chapter2/angular13App_Bootstrap

Run

npm install

And then run

npm install @swimlane/ngx-datatable

What is the motivation / use case for changing the behavior?

Support the latest version

Please tell us about your environment:

If I run ng --version I get this:

Angular CLI: 13.0.1 Node: 16.13.0 Package Manager: npm 8.1.3 OS: win32 x64

Angular: 13.0.0 … animations, common, compiler, compiler-cli, core, forms … platform-browser, platform-browser-dynamic, router

Package Version

@angular-devkit/architect 0.1300.1 @angular-devkit/build-angular 13.0.1 @angular-devkit/core 13.0.1 @angular-devkit/schematics 13.0.1 @angular/cli 13.0.1 @schematics/angular 13.0.1 rxjs 7.4.0 typescript 4.4.4

• Table version:

I am trying to install the latest

• Angular version:

13.0.1

• Browser:

N/A since this is a npm install issue.

• Language: [all | TypeScript X.X | ES6/7 | ES5]

N/A since this is a npm install issue.

[Reboog711]

The solution to my problem above was to set preserveSymLinks to true in the project’s Angular.json [not the lib]:

https://stackoverflow.com/a/54647323/133840

project.projectName.architect.build.options:

          "options": {
            "outputPath": "dist/task-manager",
            "index": "src/index.html",
            "main": "src/main.ts",
            "polyfills": "src/polyfills.ts",
            "tsConfig": "tsconfig.app.json",
            "assets": [
              "src/favicon.ico",
              "src/assets"
            ],
            "styles": [
              "src/styles.css",
              "node_modules/bootstrap/dist/css/bootstrap.css",
              "node_modules/@swimlane/ngx-datatable/themes/bootstrap.css"
            ],
            "scripts": [],
            "preserveSymlinks": true  // <--- this is what I had to add
          },

[ricardochl]

@Reboog711 I have same problem, only in a new project. When I updated another project it’s work.

I yesterday send a PR #2045