Angular 18 Compatibility (#1976)

* feat: angular 17 and 18 compatibility

* feat: converted repo to yarn v4

* fix: alignment issues when charts are server-side rendered

* fix: misc angular upgrade issues

* fix: deprecate rfdc

* fix: normalized eslint configuration

* fix: update karma configs

---------

Co-authored-by: sreyaswimlane <[email protected]>

.eslintrc.json

@@ -0,0 +1,33 @@
+{
+  "root": true,
+  "extends": ["@swimlane", "prettier"],
+  "overrides": [
+    {
+      "files": ["*.ts"],
+      "parser": "@typescript-eslint/parser",
+      "parserOptions": {
+        "project": ["./tsconfig.json"]
+      },
+      "extends": [
+        "@swimlane/eslint-config/typescript",
+        "plugin:@angular-eslint/recommended",
+        "plugin:@angular-eslint/template/process-inline-templates",
+        "prettier"
+      ],
+      "rules": {
+        "@typescript-eslint/no-empty-object-type": "off",
+        "@typescript-eslint/no-explicit-any": "off",
+        "@typescript-eslint/no-unused-vars": "off",
+        "@angular-eslint/directive-class-suffix": "off",
+        "@angular-eslint/component-class-suffix": "off",
+        "@typescript-eslint/no-inferrable-types": "off",
+        "@angular-eslint/no-input-rename": "off",
+        "@angular-eslint/no-output-native": "off",
+        "@angular-eslint/use-lifecycle-interface": "off",
+        "@angular-eslint/no-output-on-prefix": "off",
+        "@typescript-eslint/consistent-type-imports": "off",
+        "@typescript-eslint/no-duplicate-enum-values": "off"
+      }
+    }
+  ]
+}

.github/workflows/test_and_deploy.yml

@@ -6,30 +6,39 @@ jobs:
     runs-on: ubuntu-latest
 
     steps:
-    - name: Checkout
-      uses: actions/checkout@v2
-      with:
-        node-version: 12.x
-
-    - name: Install
-      uses: bahmutov/npm-install@v1
-
-    - name: Build
-      run: |
-        npm run build
-      env:
-        CI: true
-
-    - name: Test
-      run: |
-        npm run ci --if-present
-      env:
-        CI: true
-
-    - name: Prepare and deploy
-      run: |
-        npm run deploy -- --name="Swimlane" --email="[email protected]"
-      if: ${{ github.ref == 'refs/heads/master' }}
-      env:
-        CI: true
-        GH_TOKEN: ${{ secrets.GH_TOKEN }}
+      - name: Checkout
+        uses: actions/checkout@v4
+
+      - name: Setup Node.js
+        uses: actions/setup-node@v3
+        with:
+          node-version: 20.17.0
+
+      - name: Enable Corepack
+        run: corepack enable
+
+      - name: Install Yarn
+        run: corepack prepare [email protected] --activate
+
+      - name: Install dependencies
+        run: yarn install --immutable
+
+      - name: Build
+        run: |
+          yarn build
+        env:
+          CI: true
+
+      - name: Test
+        run: |
+          yarn ci
+        env:
+          CI: true
+
+      - name: Prepare and deploy
+        run: |
+          yarn deploy -- --name="Swimlane" --email="[email protected]"
+        if: ${{ github.ref == 'refs/heads/master' }}
+        env:
+          CI: true
+          GH_TOKEN: ${{ secrets.GH_TOKEN }}

.gitignore

@@ -7,10 +7,11 @@ dist/
 build/
 coverage/
 .idea
-yarn.lock
 /ngx-charts.iml
 ngx-charts.iml
 release/src/
 release/demo/
 .vscode/
-/*.tgz
+/*.tgz
+.yarn
+.yarn/install-state.gz

.prettierignore

@@ -0,0 +1,4 @@
+documentation.json
+.vscode/
+.angular/
+dist/

.yarnrc.yml

@@ -0,0 +1 @@
+nodeLinker: node-modules

angular.json

@@ -28,16 +28,8 @@
             "assets": ["src/favicon.ico", "src/assets"],
             "styles": ["src/styles.scss"],
             "scripts": [],
-            "allowedCommonJsDependencies": [
-              "emoji-flags",
-              "codemirror",
-              "ajv",
-              "mousetrap",
-              "moment-timezone"
-            ],
-            "vendorChunk": true,
+            "allowedCommonJsDependencies": ["emoji-flags", "codemirror", "ajv", "mousetrap", "moment-timezone"],
             "extractLicenses": false,
-            "buildOptimizer": false,
             "sourceMap": true,
             "optimization": false,
             "namedChunks": true
@@ -55,8 +47,6 @@
               "sourceMap": false,
               "namedChunks": false,
               "extractLicenses": true,
-              "vendorChunk": false,
-              "buildOptimizer": true,
               "budgets": [
                 {
                   "type": "initial",
@@ -75,25 +65,24 @@
         "serve": {
           "builder": "@angular-devkit/build-angular:dev-server",
           "options": {
-            "browserTarget": "ngx-charts:build"
+            "buildTarget": "ngx-charts:build"
           },
           "configurations": {
             "production": {
-              "browserTarget": "ngx-charts:build:production"
+              "buildTarget": "ngx-charts:build:production"
             }
           }
         },
         "extract-i18n": {
           "builder": "@angular-devkit/build-angular:extract-i18n",
           "options": {
-            "browserTarget": "ngx-charts:build"
+            "buildTarget": "ngx-charts:build"
           }
         },
         "test": {
           "builder": "@angular-devkit/build-angular:karma",
           "options": {
             "main": "src/test.ts",
-            "polyfills": "src/polyfills.ts",
             "tsConfig": "tsconfig.spec.json",
             "karmaConfig": "karma.conf.js",
             "assets": ["src/favicon.ico", "src/assets"],
@@ -156,5 +145,12 @@
       }
     }
   },
-  "defaultProject": "ngx-charts"
+  "schematics": {
+    "@angular-eslint/schematics:application": {
+      "setParserOptionsProject": true
+    },
+    "@angular-eslint/schematics:library": {
+      "setParserOptionsProject": true
+    }
+  }
 }