Too many issues with self-setup

[azzazkhan]

Describe the bug
First of all the Docker Compose configuration is invalid and service fails to start because of other service dependencies, secondly the build fails on Next font fetching, third there are errors with used packages SyntaxError: 'import' and 'export' may appear only with 'sourceType: module'. I've fixed the first two errors by merging Docker Compose services and configuration into a single file and replacing the Inter font call with custom stylesheet embed.

To Reproduce
Steps to reproduce the behavior:

1. Clone the repo.
2. Merge both Docker Compose spec files into a single file
3. Run docker compose build
4. See a pile of errors.

Expected behavior
The application should build and start normally.

Screenshots
No screenshot but here are the logs.

frontend-1  | Building frontend...
frontend-1  | yarn run v1.22.22
frontend-1  | $ nx build ui-app --prod --skip-nx-cache
frontend-1  | 
frontend-1  | > nx run ui-app:build:production
frontend-1  | 
frontend-1  | (node:30) [DEP0060] DeprecationWarning: The `util._extend` API is deprecated. Please use Object.assign() instead.
frontend-1  | (Use `node --trace-deprecation ...` to show where the warning was created)
frontend-1  | Attention: Next.js now collects completely anonymous telemetry regarding usage.
frontend-1  | This information is used to shape Next.js' roadmap and prioritize features.
frontend-1  | You can learn more, including how to opt-out if you'd not like to participate in this anonymous program, by visiting the following URL:
frontend-1  | https://nextjs.org/telemetry
frontend-1  | - info Creating an optimized production build...
frontend-1  | Browserslist: caniuse-lite is outdated. Please run:
frontend-1  |   npx update-browserslist-db@latest
frontend-1  |   Why you should do it regularly: https://github.com/browserslist/update-db#readme
frontend-1  | Browserslist: caniuse-lite is outdated. Please run:
frontend-1  |   npx browserslist@latest --update-db
frontend-1  |   Why you should do it regularly: https://github.com/browserslist/browserslist#browsers-data-updating
frontend-1  | Failed to compile.
frontend-1  | 
frontend-1  | ../goalie-nextjs/src/lib/goalie-nextjs.module.css
frontend-1  | SyntaxError: 'import' and 'export' may appear only with 'sourceType: module' (2:0)
frontend-1  |     at pp$4.raise (/app/node_modules/acorn-node/node_modules/acorn/dist/acorn.js:2927:15)
frontend-1  |     at pp$1.parseStatement (/app/node_modules/acorn-node/node_modules/acorn/dist/acorn.js:870:18)
frontend-1  |     at _class.parseStatement (/app/node_modules/acorn-node/lib/dynamic-import/index.js:65:118)
frontend-1  |     at pp$1.parseTopLevel (/app/node_modules/acorn-node/node_modules/acorn/dist/acorn.js:755:23)
frontend-1  |     at _class.parse (/app/node_modules/acorn-node/node_modules/acorn/dist/acorn.js:555:17)
frontend-1  |     at Function.parse (/app/node_modules/acorn-node/node_modules/acorn/dist/acorn.js:578:37)
frontend-1  |     at Object.parse (/app/node_modules/acorn-node/index.js:30:28)
frontend-1  |     at parse (/app/node_modules/detective/index.js:22:18)
frontend-1  |     at exports.find (/app/node_modules/detective/index.js:47:15)
frontend-1  |     at module.exports (/app/node_modules/detective/index.js:26:20)
frontend-1  | Import trace for requested module:
frontend-1  | ../goalie-nextjs/src/lib/goalie-nextjs.module.css
frontend-1  | ../goalie-nextjs/src/lib/goalie-nextjs.tsx
frontend-1  | ../goalie-nextjs/src/index.ts
frontend-1  | ./app/redirect/UserChecking.tsx
frontend-1  | ../goalie-nextjs/src/lib/goalie-nextjs.module.css
frontend-1  | SyntaxError: 'import' and 'export' may appear only with 'sourceType: module' (2:0)
frontend-1  |     at pp$4.raise (/app/node_modules/acorn-node/node_modules/acorn/dist/acorn.js:2927:15)
frontend-1  |     at pp$1.parseStatement (/app/node_modules/acorn-node/node_modules/acorn/dist/acorn.js:870:18)
frontend-1  |     at _class.parseStatement (/app/node_modules/acorn-node/lib/dynamic-import/index.js:65:118)
frontend-1  |     at pp$1.parseTopLevel (/app/node_modules/acorn-node/node_modules/acorn/dist/acorn.js:755:23)
frontend-1  |     at _class.parse (/app/node_modules/acorn-node/node_modules/acorn/dist/acorn.js:555:17)
frontend-1  |     at Function.parse (/app/node_modules/acorn-node/node_modules/acorn/dist/acorn.js:578:37)
frontend-1  |     at Object.parse (/app/node_modules/acorn-node/index.js:30:28)
frontend-1  |     at parse (/app/node_modules/detective/index.js:22:18)
frontend-1  |     at exports.find (/app/node_modules/detective/index.js:47:15)
frontend-1  |     at module.exports (/app/node_modules/detective/index.js:26:20)
frontend-1  | Import trace for requested module:
frontend-1  | ../goalie-nextjs/src/lib/goalie-nextjs.module.css
frontend-1  | ../goalie-nextjs/src/lib/goalie-nextjs.tsx
frontend-1  | ../goalie-nextjs/src/index.ts
frontend-1  | ./app/layout.tsx
frontend-1  | > Build failed because of webpack errors
frontend-1  | Error occurred while trying to run the npx next build 
frontend-1  | Error: Command failed: npx next build 
frontend-1  |     at genericNodeError (node:internal/errors:983:15)
frontend-1  |     at wrappedFn (node:internal/errors:537:14)
frontend-1  |     at checkExecSyncError (node:child_process:888:11)
frontend-1  |     at execSync (node:child_process:960:15)
frontend-1  |     at /app/node_modules/@nx/next/src/executors/build/build.impl.js:49:42
frontend-1  |     at Generator.next (<anonymous>)
frontend-1  |     at /app/node_modules/tslib/tslib.js:167:75
frontend-1  |     at new Promise (<anonymous>)
frontend-1  |     at Object.__awaiter (/app/node_modules/tslib/tslib.js:163:16)
frontend-1  |     at buildExecutor (/app/node_modules/@nx/next/src/executors/build/build.impl.js:20:20)
frontend-1  | 
frontend-1  |  
frontend-1  | 
frontend-1  |  >  NX   Running target build for project ui-app failed
frontend-1  | 
frontend-1  |    Failed tasks:
frontend-1  |    
frontend-1  |    - ui-app:build:production
frontend-1  |    
frontend-1  |    Hint: run the command with --verbose for more details.
frontend-1  | 
frontend-1  | error Command failed with exit code 1.
frontend-1  | info Visit https://yarnpkg.com/en/docs/cli/run for documentation about this command.
frontend-1  | Frontend build completed.
frontend-1  | yarn run v1.22.22
frontend-1  | $ next start ./dist/packages/ui-app/
frontend-1  | - ready started server on 0.0.0.0:3000, url: http://localhost:3000
frontend-1  | Error: Could not find a production build in the '/app/dist/packages/ui-app/.next' directory. Try building your app with 'next build' before starting the production server. https://nextjs.org/docs/messages/production-start-no-build-id
frontend-1  |     at NextNodeServer.getBuildId (/app/node_modules/next/dist/server/next-server.js:342:23)
frontend-1  |     at new Server (/app/node_modules/next/dist/server/base-server.js:151:29)
frontend-1  |     at new NextNodeServer (/app/node_modules/next/dist/server/next-server.js:172:9)
frontend-1  |     at NextServer.createServer (/app/node_modules/next/dist/server/next.js:171:24)
frontend-1  |     at async /app/node_modules/next/dist/server/next.js:196:31
frontend-1  |     at async NextServer.prepare (/app/node_modules/next/dist/server/next.js:153:24)
frontend-1  |     at async Server.<anonymous> (/app/node_modules/next/dist/server/lib/render-server.js:121:17) {
frontend-1  |   type: 'Error'
frontend-1  | }
frontend-1  | error Command failed with exit code 1.
frontend-1  | info Visit https://yarnpkg.com/en/docs/cli/run for documentation about this command.
frontend-1 exited with code 0

Desktop (please complete the following information):

• OS: Linux 5.15.167.4-microsoft-standard-WSL2 x86_64 GNU/Linux (Ubuntu 24.04.1 LTS)
• Browser Brave
• Version 1.73.89 Chromium: 131.0.6778.69 (Official Build) (64-bit)

Additional context
The backend service is running but only frontend Next.js is failing to build. I've not worked much in Next.js and Node so I was not able to find the root cause. I suspect it's an invalid use of some package.

[hudy9x]

@azzazkhan thanks for your feeback

In case you want to try this app I recommend you to follow my setup video on youtube

Otherwise, you want to run it on local, kindly follow this document

For docker version, please check out this brand and run the command in README file

I'm not usually use docker in development so the docker file isn't updated a long time
If the issue still happens, please tell me, I'll plan to investigate it later. However it will take a long time because i'm the only one member maintain this project