trashposs/docs/arch-devenv.md

Debugging and Developing on Arch Linux

# pacman -Syy redis postgresql git corepacker
# systemctl enable --now redis
# systemctl enable postgresql

# su - postgres

$[postgres] initdb --locale=C.UTF-8 --encoding=UTF8 -D /var/lib/postgres/data --data-checksums

$[postgres] exit

# systemctl start postgresql

# exit

$ sudo -u postgres psql
postgres=# create database trashposs;
postgres=# create user trashposs with encrypted password 'trashposs';
postgres=# grant all privileges on database trashposs to trashposs;
postgres=# \connect trashposs postgres
trashposs=# GRANT ALL ON SCHEMA public TO trashposs;
trashposs=# exit

$ git clone https://iceshrimp.dev/Crimekillz/trashposs.git
$ cp .config/devenv.yml .config/default.yml

Run Debug Session with

$ cd ./trashposs/
$ corepack enable && corepack prepare --activate && yarn --immutable
$ yarn build:debug
$ yarn migrate
$ yarn start:debug

Attach Visual Studio Code Debugger with

F5 or Run and Debug Menu (select Attach by Process ID debugging profile)

Select the process listed as node /user/bin/yarn start:debug

If you're debugging the frontend, make sure to point visual studio at the source maps (only generated in debug build).

Chrome seems to be stubborn sometimes and needs a poke. Open dev tools, go to sources, open any app JS file, copy it's URL and right click the code, select add source maps.

Paste the URL and append .map to the filename.

It will then catch on and find them all accordingly.

Debugging Vue

Install https://devtools.vuejs.org/

Press F12 to open the Browser's inbuilt devtools, Select more tools and bring the Vue tab to the front. If you can't see it, press Alt+F5.