1.5 KiB
Frontend Development (Javascript/Vue/CSS)
The client side of the ntopng frontend is based on html/javascript/css/vue. Part of this (old style) is generated by Lua script. Instead new pages are written in modern html/javascript/css/vue and must be compiled. Ntopng is currently using npm to compile the frontend code (JS/CSS) under httpdocs/dist. Foreach file modified in http_src you must recompile httpdocs/dist.
Installation
To compile the new modern frontend part written in http_src you must have nodejs >= 18.15.0. To install nodejs on Ubuntu run these command:
curl -fsSL https://deb.nodesource.com/setup_18.x | sudo -E bash - &&\
sudo apt-get install -y nodejs
On others Linux distributions to install nodeJs you can:
- download nodejs from https://nodejs.org/dist/v18.15.0/node-v18.15.0-linux-x64.tar.xz
- decompress nodejs tar with:
tar -xvf node-v18.15.0-linux-x64.tar.xz
- export path of node-v18.15.0-linux-x64/bin:
export PATH=$PATH:$(pwd)/node-v18.15.0-linux-x64/bin
Install dependencies required for the frontend compilation:
npm install
Quick Start
In order to automatically recompile the code (debug mode) whenever a change to the frontend source files under http_src/ has been detected:
npm run watch
In order to compile frontend source files under http_src/ for production (ntopngjs bundle only):
npm run build:ntopngjs
In order to compile for production (only for third party code or CSS):
npm run build
Do not forget to commit your httpdocs/dist files (or send a pull request) !