From 942c1ee7da7c3409a9783f48d37064b6d5a0e5d2 Mon Sep 17 00:00:00 2001 From: Keith Cheng Date: Sun, 17 Nov 2024 09:06:18 +0800 Subject: [PATCH] Enhance start and build scripts to add support for Windows developers (#203) * Enhance start and build scripts to add support for Windows developers * - Further updates on README.md - Remove the text about Windows being unsupported - Updated the local port from 5173 to 443 - Added more instruction how to set up a dev env --------- Co-authored-by: chengkeith <15365495+chengkeith@users.noreply.github.com> --- README.md | 38 +++++++++++++++++++++++++++------ docker-compose.yml | 2 +- docker.md | 2 +- package.json | 4 ++-- scripts/build-all-platforms.cmd | 12 +++++++++++ scripts/prebuild-win.cmd | 24 +++++++++++++++++++++ scripts/start-all-platforms.cmd | 12 +++++++++++ 7 files changed, 83 insertions(+), 11 deletions(-) create mode 100755 scripts/build-all-platforms.cmd create mode 100755 scripts/prebuild-win.cmd create mode 100755 scripts/start-all-platforms.cmd diff --git a/README.md b/README.md index eae99f492eaf..d0c5c70bbaaa 100644 --- a/README.md +++ b/README.md @@ -23,25 +23,49 @@ The project is a [React](https://reactjs.org/) web app with [Material-UI](https: ## Docker -See docker.md for more information about using docker for deployment / development. +See `docker.md` for more information about using docker for deployment / development. -## Available Scripts +## Setup a Development Environment locally -> ***Note***: It is assumed that you are running the scripts in a unix-like environment. Windows is not supported. +To run this project, you need `nodejs` and `yarn`. -In the project directory, you can run: +Go ahead to [https://nodejs.org](https://noejs.org) to download and install nodejs on your system. + +Once you have nodejs installed, you can run: + +### `npm install -g yarn` + +which would install yarn in your system. + +## Install Dependency + +If you have `yarn` installed, go to the project directory, run the following command: + +### `yarn install` + +This command downloads all the dependencies required to run this app and save them in the `node_modules` sub-directory. + +You only need to do this once, unless the project has been updated and the required dependencies have changed. + +## Start the app + +With the dependencies downloaded, in the project directory, you can run: ### `yarn start` -Runs the app in development mode.\ -Open [http://localhost:5173](http://localhost:5173) to view it in your browser. +This runs the app in development mode.\ +Open [https://localhost:443](http://localhost:443) (or simply [https://localhost](http://localhost)) to view it in your browser. The page will reload if you make edits.\ You will also see lint errors in the console. +## Build the app + +In the project directory, you can run: + ### `yarn build` -Builds the app for production to the `build` folder.\ +This command builds the app for production to the `build` folder.\ It correctly bundles React in production mode and optimizes the build for the best performance. The build is minified and the filenames include the hashes.\ diff --git a/docker-compose.yml b/docker-compose.yml index 68a71d221ec5..98974b163380 100644 --- a/docker-compose.yml +++ b/docker-compose.yml @@ -5,7 +5,7 @@ services: build: ./docker restart: unless-stopped ports: - - ${DEV_PORT:-5173}:5173 + - ${DEV_PORT:-5173}:443 volumes: - ./:/app command: 'bash ./docker/run.sh' diff --git a/docker.md b/docker.md index 62b96c313431..5d0a04fa0eb4 100644 --- a/docker.md +++ b/docker.md @@ -8,7 +8,7 @@ You can deploy hkbus using docker. docker compose up -d ``` -Check out http://localhost:5173 in the browser +Check out https://localhost:5173 in the browser * If you prefer port other than 5173, add `DEV_PORT=` in `.env` file. diff --git a/package.json b/package.json index 333c961bc688..a4cb7a3df005 100644 --- a/package.json +++ b/package.json @@ -3,8 +3,8 @@ "version": "11.2.0", "private": true, "scripts": { - "start": ". ./scripts/prebuild.sh; vite --force", - "build": ". ./scripts/prebuild.sh; tsc && vite build", + "start": "./scripts/start-all-platforms.cmd", + "build": "./scripts/build-all-platforms.cmd", "production-build": "yarn build && node scripts/sitemap-generator.js && node scripts/pre-rendering.js", "render": "node scripts/pre-rendering.js", "deploy": "yarn build && gh-pages -d build -t -f -a", diff --git a/scripts/build-all-platforms.cmd b/scripts/build-all-platforms.cmd new file mode 100755 index 000000000000..c7a17835654b --- /dev/null +++ b/scripts/build-all-platforms.cmd @@ -0,0 +1,12 @@ +:<<"::WINDOWS_BATCH" +:; ##### BEGIN Windows Batch Script ##### +@echo off +call ./scripts/prebuild-win.cmd && tsc && vite build +:; ##### END Windows Batch Script ##### +GOTO :END_OF_SCRIPT +::WINDOWS_BATCH + +# ##### BEGIN Unix Shell Script ##### +. ./scripts/prebuild.sh; tsc && vite build +# ##### END Unix Shell Script ##### +#:END_OF_SCRIPT diff --git a/scripts/prebuild-win.cmd b/scripts/prebuild-win.cmd new file mode 100755 index 000000000000..d2249323629a --- /dev/null +++ b/scripts/prebuild-win.cmd @@ -0,0 +1,24 @@ +if "%VITE_COMMIT_HASH%"== "" ( + for /f "delims=" %%a in ('git rev-parse --short HEAD') do ( + set VITE_COMMIT_HASH=%%a + ) +) + +if "%VITE_COMMIT_MESSAGE%"== "" ( + for /f "delims=" %%a in ('git log -1 --pretty^=format:%%s') do ( + set VITE_COMMIT_MESSAGE=%%a + ) +) + +if "%VITE_VERSION%"== "" ( + for /f "usebackq delims=s" %%a in (`powershell -Command "Write-Host $(node -e 'console.log(require(''./package.json'').version)')"`) do ( + set VITE_VERSION=%%a + ) +) + +if "%VITE_REPO_URL%"== "" ( + for /f "delims=" %%a in ('git config --get remote.origin.url') do ( + set VITE_REPO_URL=%%a + ) +) + diff --git a/scripts/start-all-platforms.cmd b/scripts/start-all-platforms.cmd new file mode 100755 index 000000000000..137f66ed24e6 --- /dev/null +++ b/scripts/start-all-platforms.cmd @@ -0,0 +1,12 @@ +:<<"::WINDOWS_BATCH" +:; ##### BEGIN Windows Batch Script ##### +@echo off +call ./scripts/prebuild-win.cmd && vite --force +:; ##### END Windows Batch Script ##### +GOTO :END_OF_SCRIPT +::WINDOWS_BATCH + +# ##### BEGIN Unix Shell Script ##### +. ./scripts/prebuild.sh; vite --force +# ##### END Unix Shell Script ##### +#:END_OF_SCRIPT