From 224a5a9bf9d1ad30cbede525a75ac4a538cd3e92 Mon Sep 17 00:00:00 2001 From: AmitN1212 Date: Fri, 24 Dec 2021 15:11:08 +0200 Subject: [PATCH 1/3] Updated the development environment installation docs --- .../contributing/development-environment.md | 62 ++++++++++++------- 1 file changed, 40 insertions(+), 22 deletions(-) diff --git a/site/content/en/docs/contributing/development-environment.md b/site/content/en/docs/contributing/development-environment.md index 3e344c33a8fb..b208bffccdf8 100644 --- a/site/content/en/docs/contributing/development-environment.md +++ b/site/content/en/docs/contributing/development-environment.md @@ -4,13 +4,14 @@ linkTitle: 'Development environment' weight: 2 description: 'Installing a development environment for different operating systems.' --- +### Setup the dependencies: - Install necessary dependencies: Ubuntu 18.04 ```sh - sudo apt-get update && sudo apt-get --no-install-recommends install -y build-essential curl redis-server python3-dev python3-pip python3-venv python3-tk libldap2-dev libsasl2-dev pkg-config libavformat-dev libavcodec-dev libavdevice-dev libavutil-dev libswscale-dev libswresample-dev libavfilter-dev + sudo apt-get update && sudo apt-get --no-install-recommends install -y build-essential curl git redis-server python3-dev python3-pip python3-venv python3-tk libldap2-dev libsasl2-dev pkg-config libavformat-dev libavcodec-dev libavdevice-dev libavutil-dev libswscale-dev libswresample-dev libavfilter-dev ``` ```sh @@ -25,10 +26,20 @@ description: 'Installing a development environment for different operating syste brew install git python pyenv redis curl openssl node ``` +- Install Chrome + - Install FFmpeg libraries (libav\*) version 4.0 or higher. -- Install [Visual Studio Code](https://code.visualstudio.com/docs/setup/linux#_debian-and-ubuntu-based-distributions) - for development +- Install [VS Code](https://code.visualstudio.com/docs/setup/linux#_debian-and-ubuntu-based-distributions) and the following VS Code extensions: + + - [Debugger for Chrome](https://marketplace.visualstudio.com/items?itemName=msjsdiag.debugger-for-chrome) + - [Python](https://marketplace.visualstudio.com/items?itemName=ms-python.python) + - [ESLint](https://marketplace.visualstudio.com/items?itemName=dbaeumer.vscode-eslint) + - [Stylelint](https://marketplace.visualstudio.com/items?itemName=stylelint.vscode-stylelint) + - [vscode-remark-lint](https://marketplace.visualstudio.com/items?itemName=drewbourne.vscode-remark-lint) + - [licenser](https://marketplace.visualstudio.com/items?itemName=ymotongpoo.licenser) + - [Trailing Spaces](https://marketplace.visualstudio.com/items?itemName=shardulm94.trailing-spaces) + - Install CVAT on your local host: @@ -52,17 +63,13 @@ description: 'Installing a development environment for different operating syste - Create a super user for CVAT: ```sh - $ python manage.py createsuperuser - Username (leave blank to use 'django'): *** - Email address: *** - Password: *** - Password (again): *** + python manage.py createsuperuser ``` -- Install npm packages for UI and start UI debug server (run the following command from CVAT root directory): +- Install npm packages for UI (run the following command from CVAT root directory): ```sh - npm ci && npm run start:cvat-ui + npm ci ``` > Note for Mac users @@ -73,25 +80,36 @@ description: 'Installing a development environment for different operating syste > > Read this article [Node Sass does not yet support your current environment](https://marketplace.visualstudio.com/items?itemName=msjsdiag.debugger-for-chrome) -- Open new terminal (Ctrl + Shift + T), run Visual Studio Code from the virtual environment +- Install [Docker Engine](https://docs.docker.com/engine/install/ubuntu/) and [Docker-Compose](https://docs.docker.com/compose/install/) +- Pull OpenPolicyAgent Docker-image (run from CVAT root dir): ```sh - source .env/bin/activate && code + sudo docker-compose -f docker-compose.yml -f docker-compose.dev.yml up cvat_opa ``` -- Install following VS Code extensions: +### Run CVAT +- Start npm UI debug server (run the following command from CVAT root directory): + - If you want to run CVAT in localhost: + ```sh + npm run start:cvat-ui + ``` + - If you want to access CVAT from outside of your host: + ```sh + CVAT_UI_HOST='' npm run start:cvat-ui + ``` +- Open a new terminal window and run VScode from the virtual environment (run the following command from CVAT root directory): - - [Debugger for Chrome](https://marketplace.visualstudio.com/items?itemName=msjsdiag.debugger-for-chrome) - - [Python](https://marketplace.visualstudio.com/items?itemName=ms-python.python) - - [ESLint](https://marketplace.visualstudio.com/items?itemName=dbaeumer.vscode-eslint) - - [Stylelint](https://marketplace.visualstudio.com/items?itemName=stylelint.vscode-stylelint) - - [vscode-remark-lint](https://marketplace.visualstudio.com/items?itemName=drewbourne.vscode-remark-lint) - - [licenser](https://marketplace.visualstudio.com/items?itemName=ymotongpoo.licenser) - - [Trailing Spaces](https://marketplace.visualstudio.com/items?itemName=shardulm94.trailing-spaces) + ```sh + source .env/bin/activate && code + ``` + +- Inside VScode, Open CVAT root dir -- Reload Visual Studio Code from virtual environment +- Select `server: debug` configuration and run it (F5) to run REST server and its workers +- Make sure that ```Uncaught Exceptions``` option under breakpoints section is unchecked +- If you choose to run CVAT in localhost: Select `server: chrome` configuration and run it (F5) to open CVAT in Chrome +- Alternative: If you changed CVAT_UI_HOST just enter ```:3000``` in your browser. -- Select `server: debug` configuration and start it (F5) to run REST server and its workers You have done! Now it is possible to insert breakpoints and debug server and client of the tool. From 9a7dd43a97d873a6d9ac962923066c9de7db0d7e Mon Sep 17 00:00:00 2001 From: AmitN1212 <69145846+AmitN1212@users.noreply.github.com> Date: Mon, 27 Dec 2021 15:26:57 +0200 Subject: [PATCH 2/3] Fixed some style errors --- .../contributing/development-environment.md | 23 +++++++++++-------- 1 file changed, 13 insertions(+), 10 deletions(-) diff --git a/site/content/en/docs/contributing/development-environment.md b/site/content/en/docs/contributing/development-environment.md index b208bffccdf8..1749826d09ee 100644 --- a/site/content/en/docs/contributing/development-environment.md +++ b/site/content/en/docs/contributing/development-environment.md @@ -30,7 +30,9 @@ description: 'Installing a development environment for different operating syste - Install FFmpeg libraries (libav\*) version 4.0 or higher. -- Install [VS Code](https://code.visualstudio.com/docs/setup/linux#_debian-and-ubuntu-based-distributions) and the following VS Code extensions: +- Install [VS Code](https://code.visualstudio.com/docs/setup/linux#_debian-and-ubuntu-based-distributions). + +- Install the following VScode extensions: - [Debugger for Chrome](https://marketplace.visualstudio.com/items?itemName=msjsdiag.debugger-for-chrome) - [Python](https://marketplace.visualstudio.com/items?itemName=ms-python.python) @@ -89,15 +91,16 @@ description: 'Installing a development environment for different operating syste ### Run CVAT - Start npm UI debug server (run the following command from CVAT root directory): - - If you want to run CVAT in localhost: - ```sh - npm run start:cvat-ui - ``` - - If you want to access CVAT from outside of your host: - ```sh - CVAT_UI_HOST='' npm run start:cvat-ui - ``` -- Open a new terminal window and run VScode from the virtual environment (run the following command from CVAT root directory): + - If you want to run CVAT in localhost: + ```sh + npm run start:cvat-ui + ``` + - If you want to access CVAT from outside of your host: + ```sh + CVAT_UI_HOST='' npm run start:cvat-ui + ``` +- Open a new terminal window. +- Run VScode from the virtual environment (run the following command from CVAT root directory): ```sh source .env/bin/activate && code From 400ccf6b06c55bcc99e289661a8e43f645106988 Mon Sep 17 00:00:00 2001 From: AmitN1212 <69145846+AmitN1212@users.noreply.github.com> Date: Tue, 28 Dec 2021 12:13:28 +0200 Subject: [PATCH 3/3] Replace Debugger for Chrome with JavaScript Debugger Co-authored-by: Dmitry Kalinin --- site/content/en/docs/contributing/development-environment.md | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/site/content/en/docs/contributing/development-environment.md b/site/content/en/docs/contributing/development-environment.md index 1749826d09ee..354f0e127baf 100644 --- a/site/content/en/docs/contributing/development-environment.md +++ b/site/content/en/docs/contributing/development-environment.md @@ -34,7 +34,7 @@ description: 'Installing a development environment for different operating syste - Install the following VScode extensions: - - [Debugger for Chrome](https://marketplace.visualstudio.com/items?itemName=msjsdiag.debugger-for-chrome) + - [JavaScript Debugger](https://marketplace.visualstudio.com/items?itemName=ms-vscode.js-debug) - [Python](https://marketplace.visualstudio.com/items?itemName=ms-python.python) - [ESLint](https://marketplace.visualstudio.com/items?itemName=dbaeumer.vscode-eslint) - [Stylelint](https://marketplace.visualstudio.com/items?itemName=stylelint.vscode-stylelint)