Development: Update to Angular 16 and speedup the build process (ls1i…

…ntum#6546)
Hialus · May 23, 2023 · 9e1e420 · 9e1e420
1 parent 6eeae8d
commit 9e1e420
Show file tree

Hide file tree

Showing 53 changed files with 5,096 additions and 5,648 deletions.
diff --git a/.eslintignore b/.eslintignore
@@ -15,6 +15,5 @@ docker/
 src/main/generated/
 src/main/resources/
 uploads/
-webpack/
 target/
 node/
diff --git a/.eslintrc.json b/.eslintrc.json
@@ -4,7 +4,7 @@
         "projects/**/*"
     ],
     "parserOptions": {
-        "project": ["./tsconfig.json", "./tsconfig.app.json", "./tsconfig.spec.json", "./tsconfig.webpack.json", "src/test/cypress/tsconfig.json"]
+        "project": ["./tsconfig.json", "./tsconfig.app.json", "./tsconfig.spec.json", "src/test/cypress/tsconfig.json"]
     },
     "extends": [
         "plugin:prettier/recommended"

diff --git a/.gitignore b/.gitignore
@@ -191,6 +191,12 @@ repos-download/
 /src/test/cypress/videos/
 /src/test/cypress/build
 
+#################################
+# Files generated by prebuild.mjs
+#################################
+/src/main/webapp/app/environments/environment.*.ts
+/src/main/webapp/i18n/*.json
+
 ######################
 # Artemis configs
 ######################

diff --git a/angular.json b/angular.json
@@ -18,11 +18,8 @@
       "prefix": "jhi",
       "architect": {
         "build": {
-          "builder": "@angular-builders/custom-webpack:browser",
+          "builder": "@angular-devkit/build-angular:browser",
           "options": {
-            "customWebpackConfig": {
-              "path": "./webpack/webpack.custom.js"
-            },
             "allowedCommonJsDependencies": [
               "sockjs-client",
               "hoist-non-react-statics",
@@ -59,6 +56,11 @@
             "polyfills": "src/main/webapp/app/polyfills.ts",
             "tsConfig": "tsconfig.json",
             "inlineStyleLanguage": "scss",
+            "stylePreprocessorOptions": {
+              "includePaths": [
+                "."
+              ]
+            },
             "assets": [
               "src/main/webapp/content",
               "src/main/webapp/logo/favicon.svg",
@@ -77,6 +79,7 @@
               "src/main/webapp/logo/mstile-310x150.png",
               "src/main/webapp/logo/mstile-310x310.png",
               "src/main/webapp/logo/safari-pinned-tab.svg",
+              "src/main/webapp/i18n",
               {
                 "glob": "*.{js,css,html,png}",
                 "input": "./node_modules/swagger-ui-dist",
@@ -123,7 +126,7 @@
                 "hidden": false,
                 "vendor": false
               },
-              "namedChunks": false,
+              "namedChunks": true,
               "aot": true,
               "extractLicenses": true,
               "vendorChunk": false,
@@ -141,6 +144,12 @@
                   "maximumWarning": "1mb",
                   "maximumError": "1.6mb"
                 }
+              ],
+              "fileReplacements": [
+                {
+                  "replace": "src/main/webapp/app/environments/environment.ts",
+                  "with": "src/main/webapp/app/environments/environment.override.ts"
+                }
               ]
             },
             "development": {
@@ -149,16 +158,23 @@
               "vendorChunk": true,
               "extractLicenses": false,
               "sourceMap": true,
-              "namedChunks": true
+              "namedChunks": true,
+              "fileReplacements": [
+                {
+                  "replace": "src/main/webapp/app/environments/environment.ts",
+                  "with": "src/main/webapp/app/environments/environment.override.ts"
+                }
+              ]
             }
           },
           "defaultConfiguration": "production"
         },
         "serve": {
-          "builder": "@angular-builders/custom-webpack:dev-server",
+          "builder": "@angular-devkit/build-angular:dev-server",
           "options": {
             "browserTarget": "artemis:build:development",
-            "port": 4200
+            "proxyConfig": "proxy.conf.mjs",
+            "port": 9000
           },
           "configurations": {
             "production": {

diff --git a/docs/dev/setup.rst b/docs/dev/setup.rst
@@ -6,7 +6,7 @@ Artemis. Artemis is based on `JHipster <https://jhipster.github.io>`__,
 i.e. \ `Spring Boot <http://projects.spring.io/spring-boot>`__
 development on the application server using Java 17, and TypeScript
 development on the application client in the browser using
-`Angular <https://angular.io>`__ and Webpack. To get an overview of the
+`Angular <https://angular.io>`__. To get an overview of the
 used technology, have a look at the `JHipster Technology stack <https://jhipster.github.io/tech-stack>`__
 and other tutorials on the JHipster homepage.
 
@@ -527,9 +527,8 @@ command:
 
    npm run serve
 
-This compiles TypeScript code to JavaScript code, starts the hot module
-replacement feature in Webpack (i.e. whenever you change a TypeScript
-file and save, the client is automatically reloaded with the new code)
+This compiles TypeScript code to JavaScript code, starts the live reloading feature
+(i.e. whenever you change a TypeScript file and save, the client is automatically reloaded with the new code)
 and will start the client application in your browser on
 ``http://localhost:9000``. If you have activated the JIRA profile (see
 above in `Server Setup <#server-setup>`__) and if you have configured

diff --git a/gradle/profile_dev.gradle b/gradle/profile_dev.gradle
@@ -43,9 +43,6 @@ task webapp(type: NpmTask) {
     inputs.files("tsconfig.json", "tsconfig.app.json")
             .withPropertyName("tsconfig")
             .withPathSensitivity(PathSensitivity.RELATIVE)
-    inputs.dir("webpack/")
-            .withPropertyName("webpack/")
-            .withPathSensitivity(PathSensitivity.RELATIVE)
     inputs.dir("src/main/webapp/")
             .withPropertyName("webapp-source-dir")
             .withPathSensitivity(PathSensitivity.RELATIVE)

diff --git a/jest.config.js b/jest.config.js
@@ -8,12 +8,10 @@ const esModules = ['lodash-es', 'franc-min', 'trigram-utils', 'n-gram', 'collaps
 const {
     compilerOptions: { baseUrl = './' },
 } = require('./tsconfig.json');
-const environment = require('./webpack/environment');
 
 module.exports = {
     globalSetup: 'jest-preset-angular/global-setup',
     globals: {
-        ...environment,
         'ts-jest': {
             tsconfig: '<rootDir>/tsconfig.spec.json',
             stringifyContentPathRegex: '\\.html$',