style: update import with path mapping

src/app/app.routes.ts

@@ -2,5 +2,5 @@ import { Routes } from '@angular/router';
 
 export const routes: Routes = [
   { path: '', pathMatch: "full", redirectTo: 'gallery' },
-  { path: 'gallery', loadChildren: () => import('../gallery/gallery.module').then(m => m.GalleryModule)},
+  { path: 'gallery', loadChildren: () => import('./gallery/gallery.module').then(m => m.GalleryModule)},
 ];

src/gallery/gallery-detail/gallery-detail.component.ts → src/app/gallery/gallery-detail/gallery-detail.component.ts

@@ -1,7 +1,7 @@
 import {AfterViewInit, Component, ElementRef, OnDestroy, ViewChild} from '@angular/core';
 import {ActivatedRoute, Router} from "@angular/router";
-import {ParticleFactory} from "../../di/particle-factory";
-import {ParticleService} from "../../services/particle.service";
+import {ParticleFactory} from "@di/particle-factory";
+import {ParticleService} from "@services/particle.service";
 import {GravityHandlerComponent} from "../gallery-handler/gravity-handler/gravity-handler.component";
 import {HarmonicHandlerComponent} from "../gallery-handler/harmonic-handler/harmonic-handler.component";
 import {ImageHandlerComponent} from "../gallery-handler/image-handler/image-handler.component";

src/gallery/gallery-handler/gravity-handler/gravity-handler.component.ts → src/app/gallery/gallery-handler/gravity-handler/gravity-handler.component.ts

@@ -1,5 +1,5 @@
 import {Component, Input} from '@angular/core';
-import {GravityParticleStyle, ParticleGravityService} from "../../../services/particle-gravity.service";
+import {GravityParticleStyle, ParticleGravityService} from "@services/particle-gravity.service";
 
 @Component({
   selector: 'app-gravity-handler',

src/gallery/gallery-handler/harmonic-handler/harmonic-handler.component.ts → src/app/gallery/gallery-handler/harmonic-handler/harmonic-handler.component.ts

@@ -1,5 +1,5 @@
 import {Component, Input, OnInit, ViewChild} from '@angular/core';
-import {HarmonicParticleStyle, ParticleHarmonicService} from "../../../services/particle-harmonic.service";
+import {HarmonicParticleStyle, ParticleHarmonicService} from "@services/particle-harmonic.service";
 
 @Component({
   selector: 'app-harmonic-handler',

src/gallery/gallery-handler/image-handler/image-handler.component.ts → src/app/gallery/gallery-handler/image-handler/image-handler.component.ts

@@ -1,5 +1,5 @@
 import {Component, Input} from '@angular/core';
-import {ImageParticlePattern, ImageParticleStyle, ParticleImageService} from "../../../services/particle-image.service";
+import {ImageParticlePattern, ImageParticleStyle, ParticleImageService} from "@services/particle-image.service";
 
 @Component({
   selector: 'app-image-handler',

src/gallery/gallery-home/gallery-home.component.ts → src/app/gallery/gallery-home/gallery-home.component.ts

@@ -1,6 +1,6 @@
 import {Component, Inject} from '@angular/core';
 import {Router} from "@angular/router";
-import {Artifact, ArtifactToken, MOCK_ARTIFACTS} from "../../di/mock";
+import {Artifact, ArtifactToken, MOCK_ARTIFACTS} from "@di/mock";
 
 @Component({
   selector: 'app-gallery-home',

src/di/particle-factory.ts

@@ -1,9 +1,9 @@
 import {ActivatedRoute} from "@angular/router";
-import {ParticleGravityService} from "../services/particle-gravity.service";
-import {ParticleHarmonicService} from "../services/particle-harmonic.service";
-import {ParticleImageService} from "../services/particle-image.service";
-import {ParticleRainingService} from "../services/particle-raining.service";
-import {ParticleService} from "../services/particle.service";
+import {ParticleGravityService} from "@services/particle-gravity.service";
+import {ParticleHarmonicService} from "@services/particle-harmonic.service";
+import {ParticleImageService} from "@services/particle-image.service";
+import {ParticleRainingService} from "@services/particle-raining.service";
+import {ParticleService} from "@services/particle.service";
 
 export const ParticleFactory = (route: ActivatedRoute) => {
   console.log('call particle factory')

src/services/particle-gravity.service.ts

@@ -1,5 +1,5 @@
 import { Injectable } from '@angular/core';
-import {radiusToMass} from "../util/math";
+import {radiusToMass} from "@util/math";
 import {_P5Particle, ParticleService} from "./particle.service";
 import P5 from "p5";
 

src/services/particle-harmonic.service.ts

@@ -1,6 +1,6 @@
 import { Injectable } from '@angular/core';
 import P5 from "p5";
-import {genRandomLinearGradient} from "../util/graphic";
+import {genRandomLinearGradient} from "@util/graphic";
 import {_P5Particle, ParticleService} from "./particle.service";
 
 export type HarmonicParticleStyle = 'circle' | 'rect' | 'toMouse' | 'pulse';

src/services/particle-raining.service.ts

@@ -1,6 +1,6 @@
 import { Injectable } from '@angular/core';
 import P5 from "p5";
-import {calcRelativeBrightness} from "../util/graphic";
+import {calcRelativeBrightness} from "@util/graphic";
 import {_P5Particle, ParticleService} from "./particle.service";
 
 interface RainingParticleModel {

tsconfig.json

@@ -23,7 +23,14 @@
     "lib": [
       "ES2022",
       "dom"
-    ]
+    ],
+    "baseUrl": "src",
+    "paths": {
+      "@di/*": ["di/*"],
+      "@services/*": ["services/*"],
+      "@util/*": ["util/*"],
+      "@assets/*": ["assets/*"]
+    }
   },
   "angularCompilerOptions": {
     "enableI18nLegacyMessageIdFormat": false,