From 077aa48eed1b0ce19002a5f87dde067d279829dc Mon Sep 17 00:00:00 2001 From: anthdm Date: Wed, 12 Jun 2024 18:28:55 +0200 Subject: [PATCH] changed Makefile command and added bundling of JS if needed --- README.md | 2 +- bootstrap/Makefile | 7 ++++--- bootstrap/app/assets/index.js | 1 + bootstrap/app/views/layouts/base_layout.templ | 3 +-- 4 files changed, 7 insertions(+), 6 deletions(-) create mode 100644 bootstrap/app/assets/index.js diff --git a/README.md b/README.md index b217e80..62cbeed 100644 --- a/README.md +++ b/README.md @@ -63,7 +63,7 @@ make dev ## Hot reloading the browser Hot reloading is configured by default when running your application in development. -> NOTE: on windows or on in my case (WSL2) you might need to run `make assets` in another terminal to watch for CSS and JS file changes. +> NOTE: on windows or on in my case (WSL2) you might need to run `make watch-assets` in another terminal to watch for CSS and JS file changes. # Migrations ## Create a new migration diff --git a/bootstrap/Makefile b/bootstrap/Makefile index f4dfa5d..b424abb 100644 --- a/bootstrap/Makefile +++ b/bootstrap/Makefile @@ -20,12 +20,12 @@ server: --misc.clean_on_exit true # run tailwindcss to generate the styles.css bundle in watch mode. -assets: +watch-assets: tailwindcss -i app/assets/app.css -o ./public/assets/styles.css --watch # run esbuild to generate the index.js bundle in watch mode. esbuild: - npx esbuild views/js/index.js --bundle --outdir=public/ --watch + npx esbuild app/assets/index.js --bundle --outdir=public/assets --watch # watch for any js or css change in the assets/ folder, then reload the browser via templ proxy. sync_assets: @@ -39,12 +39,13 @@ sync_assets: # start the application in development dev: - @make -j4 templ server assets sync_assets + @make -j5 templ server watch-assets watch-esbuild sync_assets # build the application for production. This will compile your app # to a single binary with all its assets embedded. build: @tailwindcss -i app/assets/app.css -o ./public/assets/styles.css + @npx esbuild app/assets/index.js --bundle --outdir=public/assets --watch @go build -o bin/app_prod cmd/app/main.go @echo "compiled you application with all its assets to a single binary => bin/app_prod" diff --git a/bootstrap/app/assets/index.js b/bootstrap/app/assets/index.js new file mode 100644 index 0000000..a416e38 --- /dev/null +++ b/bootstrap/app/assets/index.js @@ -0,0 +1 @@ +console.log("if you like superkit consider given it a star on GitHub.") \ No newline at end of file diff --git a/bootstrap/app/views/layouts/base_layout.templ b/bootstrap/app/views/layouts/base_layout.templ index 5a0e47b..f1cabd1 100644 --- a/bootstrap/app/views/layouts/base_layout.templ +++ b/bootstrap/app/views/layouts/base_layout.templ @@ -15,8 +15,7 @@ templ BaseLayout() { - - +