build(angular): Use the Angular compiler to compile the @sentry/angul…

…ar SDK (WEB-622) Switch to the Angular compiler (via Angular CLI) to ensure that all Angular 1st-class support items of the SDK are compiled in a way that the library are compatible with Angular. This fixes the compilation errors when using `TraceDirective` and `TraceModule` that are currently thrown on application compilation. Uses the Angular 10 compiler which ensures compatibility with Angular 10-13 apps. FIXES GH-3282 FIXES WEB-622
getsentry · Apr 20, 2022 · 383509b · 383509b
1 parent 5d74974
commit 383509b
Show file tree

Hide file tree

Showing 20 changed files with 223 additions and 50 deletions.
diff --git a/package.json b/package.json
@@ -31,6 +31,8 @@
   },
   "workspaces": [
     "packages/angular",
+    "packages/angularNew",
+    "packages/angularNew10",
     "packages/browser",
     "packages/core",
     "packages/ember",
@@ -75,7 +77,7 @@
     "jsdom": "^19.0.0",
     "karma-browserstack-launcher": "^1.5.1",
     "karma-firefox-launcher": "^1.1.0",
-    "lerna": "3.13.4",
+    "lerna": "^3.13.4",
     "madge": "4.0.2",
     "mocha": "^6.1.4",
     "npm-run-all": "^4.1.5",

diff --git a/packages/angular/LICENSE b/packages/angular/LICENSE
diff --git a/packages/angular/angular.json b/packages/angular/angular.json
@@ -0,0 +1,27 @@
+{
+  "$schema": "../.././node_modules/@angular/cli/lib/config/schema.json",
+  "version": 1,
+  "newProjectRoot": "projects",
+  "projects": {
+    "sentry-angular": {
+      "projectType": "library",
+      "root": "lib",
+      "sourceRoot": "lib/src",
+      "prefix": "lib",
+      "architect": {
+        "build": {
+          "builder": "@angular-devkit/build-angular:ng-packagr",
+          "options": {
+            "tsConfig": "lib/tsconfig.lib.json",
+            "project": "lib/ng-package.json"
+          },
+          "configurations": {
+            "production": {
+              "tsConfig": "lib/tsconfig.lib.prod.json"
+            }
+          }
+        }
+      }
+    }},
+  "defaultProject": "sentry-angular"
+}
diff --git a/packages/angular/lib/ng-package.json b/packages/angular/lib/ng-package.json
@@ -0,0 +1,18 @@
+{
+  "$schema": "../node_modules/ng-packagr/ng-package.schema.json",
+  "dest": "../dist",
+  "lib": {
+    "entryFile": "src/index.ts",
+    "umdModuleIds": {
+      "@sentry/browser": "Sentry",
+      "@sentry/utils": "utils"
+    }
+  },
+  "whitelistedNonPeerDependencies": [
+    "@sentry/browser",
+    "@sentry/utils",
+    "@sentry/types",
+    "tslib"
+  ],
+  "assets": ["README.md"]
+}
diff --git a/packages/angular/lib/package.json b/packages/angular/lib/package.json
@@ -0,0 +1,29 @@
+{
+  "name": "@sentry/angular",
+  "version": "6.18.0",
+  "description": "Official Sentry SDK for Angular",
+  "repository": "git://github.com/getsentry/sentry-javascript.git",
+  "homepage": "https://github.com/getsentry/sentry-javascript/tree/master/packages/angular",
+  "author": "Sentry",
+  "license": "MIT",
+  "engines": {
+    "node": ">=6"
+  },
+  "main": "dist/index.js",
+  "module": "esm/index.js",
+  "types": "dist/index.d.ts",
+  "publishConfig": {
+    "access": "public"
+  },
+  "peerDependencies": {
+    "@angular/common": "10.x || 11.x || 12.x || 13.x",
+    "@angular/core": "10.x || 11.x || 12.x || 13.x",
+    "@angular/router": "10.x || 11.x || 12.x || 13.x"
+  },
+  "dependencies": {
+    "@sentry/browser": "6.18.0",
+    "@sentry/types": "6.18.0",
+    "@sentry/utils": "6.18.0",
+    "tslib": "^2.0.0"
+  }
+}
diff --git a/packages/angular/src/constants.ts → packages/angular/lib/src/constants.ts b/packages/angular/src/constants.ts → packages/angular/lib/src/constants.ts
diff --git a/packages/angular/src/errorhandler.ts → packages/angular/lib/src/errorhandler.ts b/packages/angular/src/errorhandler.ts → packages/angular/lib/src/errorhandler.ts
@@ -1,5 +1,5 @@
 import { HttpErrorResponse } from '@angular/common/http';
-import { ErrorHandler as AngularErrorHandler, Injectable } from '@angular/core';
+import { ErrorHandler as AngularErrorHandler, Inject, Injectable } from '@angular/core';
 import * as Sentry from '@sentry/browser';
 
 import { runOutsideAngular } from './zone';
@@ -26,7 +26,7 @@ export interface ErrorHandlerOptions {
 class SentryErrorHandler implements AngularErrorHandler {
   protected readonly _options: ErrorHandlerOptions;
 
-  public constructor(options?: ErrorHandlerOptions) {
+  public constructor(@Inject('errorHandlerOptions') options?: ErrorHandlerOptions) {
     this._options = {
       logErrors: true,
       ...options,

diff --git a/packages/angular/src/index.ts → packages/angular/lib/src/index.ts b/packages/angular/src/index.ts → packages/angular/lib/src/index.ts
diff --git a/packages/angular/lib/src/public-api copy.ts b/packages/angular/lib/src/public-api copy.ts
@@ -0,0 +1,4 @@
+/*
+ * Public API Surface of angular
+ */
+
diff --git a/packages/angular/src/sdk.ts → packages/angular/lib/src/sdk.ts b/packages/angular/src/sdk.ts → packages/angular/lib/src/sdk.ts
diff --git a/packages/angular/src/tracing.ts → packages/angular/lib/src/tracing.ts b/packages/angular/src/tracing.ts → packages/angular/lib/src/tracing.ts
diff --git a/packages/angular/src/zone.ts → packages/angular/lib/src/zone.ts b/packages/angular/src/zone.ts → packages/angular/lib/src/zone.ts
diff --git a/packages/angular/lib/tsconfig.lib.json b/packages/angular/lib/tsconfig.lib.json
@@ -0,0 +1,25 @@
+/* To learn more about this file see: https://angular.io/config/tsconfig. */
+{
+  "extends": "../tsconfig.json",
+  "compilerOptions": {
+    "outDir": "../../out-tsc/lib",
+    "target": "es2015",
+    "declaration": true,
+    "declarationMap": true,
+    "inlineSources": true,
+    "types": [],
+    "lib": [
+      "dom",
+      "es2018"
+    ]
+  },
+  "angularCompilerOptions": {
+    "skipTemplateCodegen": true,
+    "strictMetadataEmit": true,
+    "enableResourceInlining": true
+  },
+  "exclude": [
+    "src/test.ts",
+    "**/*.spec.ts"
+  ]
+}
diff --git a/packages/angular/lib/tsconfig.lib.prod.json b/packages/angular/lib/tsconfig.lib.prod.json
@@ -0,0 +1,11 @@
+/* To learn more about this file see: https://angular.io/config/tsconfig. */
+{
+  "extends": "./tsconfig.lib.json",
+  "compilerOptions": {
+    "declarationMap": false
+  },
+  "angularCompilerOptions": {
+    "enableIvy": false,
+    // "compilationMode": "partial"
+  }
+}
diff --git a/packages/angular/lib/tsconfig.spec.json b/packages/angular/lib/tsconfig.spec.json
@@ -0,0 +1,17 @@
+/* To learn more about this file see: https://angular.io/config/tsconfig. */
+{
+  "extends": "../tsconfig.json",
+  "compilerOptions": {
+    "outDir": "../../out-tsc/spec",
+    "types": [
+      "jasmine"
+    ]
+  },
+  "files": [
+    "src/test.ts"
+  ],
+  "include": [
+    "**/*.spec.ts",
+    "**/*.d.ts"
+  ]
+}
diff --git a/packages/angular/lib/tslint.json b/packages/angular/lib/tslint.json
@@ -0,0 +1,17 @@
+{
+  "extends": "../../tslint.json",
+  "rules": {
+    "directive-selector": [
+      true,
+      "attribute",
+      "lib",
+      "camelCase"
+    ],
+    "component-selector": [
+      true,
+      "element",
+      "lib",
+      "kebab-case"
+    ]
+  }
+}
diff --git a/packages/angular/package.json b/packages/angular/package.json
@@ -20,34 +20,71 @@
     "@angular/core": "10.x || 11.x || 12.x || 13.x",
     "@angular/router": "10.x || 11.x || 12.x || 13.x"
   },
+  "private": true,
+
   "dependencies": {
+    "@angular/animations": "~10.2.5",
+    "@angular/common": "~10.2.5",
+    "@angular/compiler": "~10.2.5",
+    "@angular/core": "~10.2.5",
+    "@angular/forms": "~10.2.5",
+    "@angular/platform-browser": "~10.2.5",
+    "@angular/platform-browser-dynamic": "~10.2.5",
+    "@angular/router": "~10.2.5",
     "@sentry/browser": "7.0.0-alpha.1",
     "@sentry/types": "7.0.0-alpha.1",
     "@sentry/utils": "7.0.0-alpha.1",
-    "rxjs": "^6.6.0",
-    "tslib": "^1.9.3"
+    "rxjs": "~6.6.0",
+    "tslib": "^2.0.0",
+    "zone.js": "~0.10.2"
   },
   "devDependencies": {
-    "@angular/common": "^10.0.3",
-    "@angular/core": "^10.0.3",
-    "@angular/router": "^10.0.3"
+    "@angular-devkit/build-angular": "~0.1002.4",
+    "@angular/cli": "~10.2.4",
+    "@angular/compiler-cli": "~10.2.5",
+    "@types/jasmine": "~3.5.0",
+    "@types/jasminewd2": "~2.0.3",
+    "@types/node": "^12.11.1",
+    "codelyzer": "^6.0.0",
+    "jasmine-core": "~3.6.0",
+    "jasmine-spec-reporter": "~5.0.0",
+    "karma": "~5.0.0",
+    "karma-chrome-launcher": "~3.1.0",
+    "karma-coverage-istanbul-reporter": "~3.0.2",
+    "karma-jasmine": "~4.0.0",
+    "karma-jasmine-html-reporter": "~1.5.0",
+    "ng-packagr": "^10.1.0",
+    "protractor": "~7.0.0",
+    "ts-node": "~8.3.0",
+    "tslint": "~6.1.0",
+    "typescript": "~4.0.2"
   },
   "scripts": {
-    "build": "run-p build:cjs build:esm build:types",
-    "build:cjs": "tsc -p tsconfig.cjs.json",
+    "build": "run-p build:esm #**not necessary** build:cjs",
+
+    "build:cjs": "#**not necessary** tsc -p tsconfig.cjs.json",
     "build:dev": "run-s build",
-    "build:es5": "yarn build:cjs # *** backwards compatibility - remove in v7 ***",
-    "build:esm": "tsc -p tsconfig.esm.json",
-    "build:types": "tsc -p tsconfig.types.json",
-    "build:watch": "run-p build:cjs:watch build:esm:watch build:types:watch",
-    "build:cjs:watch": "tsc -p tsconfig.cjs.json --watch",
+    "build:es5": "#**not necessary**  yarn build:cjs # *** backwards compatibility - remove in v7 ***",
+    "build:esm": "ng build --prod",
+    "build:types": "#TODO not necessary or change??: tsc -p tsconfig.types.json",
+    "build:watch": "run-p build:esm:watch #TODO not necessary? build:cjs:watch build:types:watch",
+    "build:cjs:watch": "#**not necessary** tsc -p tsconfig.cjs.json --watch",
     "build:dev:watch": "run-s build:watch",
+<<<<<<< HEAD
     "build:es5:watch": "yarn build:cjs:watch # *** backwards compatibility - remove in v7 ***",
     "build:esm:watch": "tsc -p tsconfig.esm.json --watch",
     "build:types:watch": "tsc -p tsconfig.types.json --watch",
     "build:npm": "npm pack",
     "circularDepCheck": "madge --circular src/index.ts",
     "clean": "rimraf cjs esm build coverage",
+=======
+    "build:es5:watch": "#**not necessary** yarn build:cjs:watch # *** backwards compatibility - remove in v7 ***",
+    "build:esm:watch": "ng build --prod --watch",
+    "build:types:watch": "tsc -p tsconfig.types.json --watch #TODO necessary?",
+    "build:npm": "npm pack ./build",
+    "circularDepCheck": "madge --circular projects/sentry-angular/src/index.ts #TODO change to final index path!!",
+    "clean": "rimraf dist esm build coverage",
+>>>>>>> 39aec6c8a (build(angular): Use the Angular compiler to compile the @sentry/angular SDK (WEB-622))
     "fix": "run-s fix:eslint fix:prettier",
     "fix:eslint": "eslint . --format stylish --fix",
     "fix:prettier": "prettier --write \"{src,test,scripts}/**/*.ts\"",

diff --git a/packages/angular/tsconfig.esm.json b/packages/angular/tsconfig.esm.json
diff --git a/packages/angular/tsconfig.json b/packages/angular/tsconfig.json
@@ -1,10 +1,25 @@
 {
-  "extends": "../../tsconfig.json",
-
-  "include": ["src/**/*"],
-
+  "compileOnSave": false,
   "compilerOptions": {
-    // package-specific options
-    "experimentalDecorators": true
+    "baseUrl": "./",
+    "outDir": "./dist/out-tsc",
+    "sourceMap": true,
+    "declaration": false,
+    "downlevelIteration": true,
+    "experimentalDecorators": true,
+    "moduleResolution": "node",
+    "importHelpers": true,
+    "target": "es2015",
+    "module": "es2020",
+    "lib": [
+      "es2018",
+      "dom"
+    ],
+    "paths": {
+      "sentry-angular": [
+        "dist/sentry-angular/sentry-angular",
+        "dist/sentry-angular"
+      ]
+    }
   }
 }
diff --git a/packages/angular/tsconfig.test.json b/packages/angular/tsconfig.test.json