Versionen im Vergleich

Schlüssel

  • Diese Zeile wurde hinzugefügt.
  • Diese Zeile wurde entfernt.
  • Formatierung wurde geändert.
Auszug
hiddentrue

Nuclos Webclient Entwicklung: Node.js, npm install, config.json, localhost:4200, Entwicklungsmodus, Angular, Addon, addon-api.

globe with meridians Sprache: Deutsch · English

hammer and wrench JS WebClient Entwicklungsumgebung

Angular-Webclient lokal entwickeln – Node.js, Entwicklungsmodus, npm install, config.json und localhost:4200.

Status
colourPurple
titleHow-to
Status
colourBlue
titleEntwickler
Status
colourGreen
titleStand: Jul 2026
Status
colourGrey
titlegilt fuer Nuclos 4.2026.x

Panel
bgColor#F4F5F7

Auf dieser Seite

Inhalt
maxLevel2
minLevel2

...

Voraussetzungen

  • Node.js installiert;
  • Nuclos

...

  • muss im Entwicklungsmodus gestartet

...

Installation der benötigten Libraries

...

  • sein.

Bibliotheken installieren

Nur initial und nach Änderungen an der

...

package.json

...

nötig:

Codeblock

...

cd nuclos/nuclos-webclient
npm install

...

languagebash
npm

...

Konfiguration des Nuclos-Servers

Die Server-Konfiguration wird mittels: 

Codeblock
npm run config

erstellt.

 install

Server-Konfiguration

...

Hostname, Port und

...

Webkontext des

...

Nuclos-

...

Servers in nuclos/nuclos-webclient/src/assets/config.json

...

eintragen.

...

Webclient

...

Codeblock
node ./node_modules/@angular/cli/bin/ng serve --aot

starten

Der Webclient ist

...

danach unter http://localhost:4200 erreichbar.

Info
title

...

Es kann sein, dass die oben genannten Schritte in Verbindung mit einem Webaddon nicht funktionieren. Sollte dies der Fall sein, gibt es folgende Möglichkeiten um das Problem zu lösen:

Addon-Probleme

Startprobleme mit einem Addon? Ordner node_modules löschen und die Addon-Abhängigkeiten neu installieren:

Codeblock
languagebash
npm install 

...

@nuclos/nuclos-addon-api

...


npm run install-addon-deps

Verwandte Seiten

gear Docker einrichten


Build-Tools.

Öffnen →

gear Addon


Addons.

Öffnen →

  • npm install --save-exact @nuclos/nuclos-addon-api@latest rxjs@5.4.3 @nuclos/nuclos-addon-api@0.0.7
  • npm install
  • Debuggen mit Chrome:

    Um direkt in Chrom zu debuggen, muss man mit "Insprect" im Tab “Sources”, Untertab “Filesystem”, die TS-Sourcen (nuclos-webclient/src) mit “Add folder to workspace” angeben.

    Image Removed

     

    Der Chrome Debugger ist ausgezeichnet, sehr schnell und zuverlässig, weitaus besser als der IntelliJ Debugger. Einziger Nachteil: Zum persistenten Ändern der Sourcen sollte man die Stelle in IntelliJ suchen und dort Änderung. Zum schnellen Debuggen ist der Chrome Debugger zu empfehlen.
    Mit Ctrl+P (Command+P beim Mac) kann man auch einzelne TS-Files öffnen, Breakpoints setzen.

    Beispiel für Breakpoint in Zeile 17 von dashboard-grit-ite-wrapper.ts:

    Image Removed