This is a documentation for Board Game Arena: play board games online !

Using Typescript and Scss

From Board Game Arena
Revision as of 14:40, 8 February 2021 by Thoun (talk | contribs) (init)
(diff) ← Older revision | Latest revision (diff) | Newer revision → (diff)
Jump to navigation Jump to search

This page will help you set up your project to use Typescript client file and Scss style files, and automatically build Javascript (in ES5) files and CSS files so your project stay compatible to BGA framework requirements. You can use only TS or only SCSS part if you want, they are not linked.

How to install the auto-build stack

Install builders

Intall node/npm then npm i on the root folder to get builders.

Auto build JS and CSS files

In VS Code, add extension https://marketplace.visualstudio.com/items?itemName=emeraldwalk.RunOnSave and then add to config.json extension part :

       "commands": [
           {
               "match": ".*\\.ts$",
               "isAsync": true,
               "cmd": "npm run build:ts"
           },
           {
               "match": ".*\\.scss$",
               "isAsync": true,
               "cmd": "npm run build:scss"
           }
       ]
   }

If you use it for another game, replace `mow` mentions on package.json `build:scss` script and on tsconfig.json `files` property.

Auto-upload builded files

Also add one auto-FTP upload extension (for example https://marketplace.visualstudio.com/items?itemName=lukasz-wronski.ftp-sync) and configure it. The extension will detected modified files in the workspace, including builded ones, and upload them to remote server.

Hint

Make sure ftp-sync.json and node_modules are in .gitignore