alex-swki / magicpack

MagicPack is a web-based Wake-On-Lan tool intended for use by teams or companies.
42 stars 0 forks source link

Docker image not working(?) #2

Open Dima-Kal opened 10 months ago

Dima-Kal commented 10 months ago

Hi, getting this issue after running the docker image:

` ./app/[user]/page.tsx

Build failed because of webpack errors magicpack@0.1.0 build  next build Attention: Next.js now collects completely anonymous telemetry regarding usage. This information is used to shape Next.js' roadmap and prioritize features. 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: https://nextjs.org/telemetry Creating an optimized production build ... Warning: For production Image Optimization with Next.js, the optional 'sharp' package is strongly recommended. Run 'npm i sharp', and Next.js will use it automatically for Image Optimization. Read more: https://nextjs.org/docs/messages/sharp-missing-in-production

[webpack.cache.PackFileCacheStrategy] Skipped not serializable cache item 'Compilation/modules|javascript/auto|/magicpack/node_modules/next/dist/build/webpack/loaders/next-flight-css-loader.js??ruleSet[1].rules[14].oneOf[9].use[0]!/magicpack/node_modules/next/dist/build/webpack/loaders/css-loader/src/index.js??ruleSet[1].rules[14].oneOf[9].use[1]!/magicpack/node_modules/next/dist/build/webpack/loaders/postcss-loader/src/index.js??ruleSet[1].rules[14].oneOf[9].use[2]!/magicpack/node_modules/next/dist/build/webpack/loaders/resolve-url-loader/index.js??ruleSet[1].rules[14].oneOf[9].use[3]!/magicpack/node_modules/next/dist/compiled/sass-loader/cjs.js??ruleSet[1].rules[14].oneOf[9].use[4]!/magicpack/app/page.module.scss|ssr': No serializer registered for SassError while serializing webpack/lib/cache/PackFileCacheStrategy.PackContentItems -> webpack/lib/NormalModule -> webpack/lib/ModuleBuildError -> SassError [webpack.cache.PackFileCacheStrategy] Skipped not serializable cache item 'Compilation/modules|javascript/auto|/magicpack/node_modules/next/dist/build/webpack/loaders/next-flight-css-loader.js??ruleSet[1].rules[14].oneOf[9].use[0]!/magicpack/node_modules/next/dist/build/webpack/loaders/css-loader/src/index.js??ruleSet[1].rules[14].oneOf[9].use[1]!/magicpack/node_modules/next/dist/build/webpack/loaders/postcss-loader/src/index.js??ruleSet[1].rules[14].oneOf[9].use[2]!/magicpack/node_modules/next/dist/build/webpack/loaders/resolve-url-loader/index.js??ruleSet[1].rules[14].oneOf[9].use[3]!/magicpack/node_modules/next/dist/compiled/sass-loader/cjs.js??ruleSet[1].rules[14].oneOf[9].use[4]!/magicpack/components/Header.module.scss|ssr': No serializer registered for SassError while serializing webpack/lib/cache/PackFileCacheStrategy.PackContentItems -> webpack/lib/NormalModule -> webpack/lib/ModuleBuildError -> SassError [webpack.cache.PackFileCacheStrategy] Skipped not serializable cache item 'Compilation/modules|javascript/auto|/magicpack/node_modules/next/dist/build/webpack/loaders/next-flight-css-loader.js??ruleSet[1].rules[14].oneOf[9].use[0]!/magicpack/node_modules/next/dist/build/webpack/loaders/css-loader/src/index.js??ruleSet[1].rules[14].oneOf[9].use[1]!/magicpack/node_modules/next/dist/build/webpack/loaders/postcss-loader/src/index.js??ruleSet[1].rules[14].oneOf[9].use[2]!/magicpack/node_modules/next/dist/build/webpack/loaders/resolve-url-loader/index.js??ruleSet[1].rules[14].oneOf[9].use[3]!/magicpack/node_modules/next/dist/compiled/sass-loader/cjs.js??ruleSet[1].rules[14].oneOf[9].use[4]!/magicpack/components/Footer.module.scss|ssr': No serializer registered for SassError while serializing webpack/lib/cache/PackFileCacheStrategy.PackContentItems -> webpack/lib/NormalModule -> webpack/lib/ModuleBuildError -> SassError [webpack.cache.PackFileCacheStrategy] Skipped not serializable cache item 'Compilation/modules|javascript/auto|/magicpack/node_modules/next/dist/build/webpack/loaders/next-flight-css-loader.js??ruleSet[1].rules[14].oneOf[9].use[0]!/magicpack/node_modules/next/dist/build/webpack/loaders/css-loader/src/index.js??ruleSet[1].rules[14].oneOf[9].use[1]!/magicpack/node_modules/next/dist/build/webpack/loaders/postcss-loader/src/index.js??ruleSet[1].rules[14].oneOf[9].use[2]!/magicpack/node_modules/next/dist/build/webpack/loaders/resolve-url-loader/index.js??ruleSet[1].rules[14].oneOf[9].use[3]!/magicpack/node_modules/next/dist/compiled/sass-loader/cjs.js??ruleSet[1].rules[14].oneOf[9].use[4]!/magicpack/components/PingCheck.module.scss|ssr': No serializer registered for SassError while serializing webpack/lib/cache/PackFileCacheStrategy.PackContentItems -> webpack/lib/NormalModule -> webpack/lib/ModuleBuildError -> SassError [webpack.cache.PackFileCacheStrategy] Skipped not serializable cache item 'Compilation/modules|javascript/auto|/magicpack/node_modules/next/dist/build/webpack/loaders/next-flight-css-loader.js??ruleSet[1].rules[14].oneOf[9].use[0]!/magicpack/node_modules/next/dist/build/webpack/loaders/css-loader/src/index.js??ruleSet[1].rules[14].oneOf[9].use[1]!/magicpack/node_modules/next/dist/build/webpack/loaders/postcss-loader/src/index.js??ruleSet[1].rules[14].oneOf[9].use[2]!/magicpack/node_modules/next/dist/build/webpack/loaders/resolve-url-loader/index.js??ruleSet[1].rules[14].oneOf[9].use[3]!/magicpack/node_modules/next/dist/compiled/sass-loader/cjs.js??ruleSet[1].rules[14].oneOf[9].use[4]!/magicpack/components/Description.module.scss|ssr': No serializer registered for SassError while serializing webpack/lib/cache/PackFileCacheStrategy.PackContentItems -> webpack/lib/NormalModule -> webpack/lib/ModuleBuildError -> SassError [webpack.cache.PackFileCacheStrategy] Skipped not serializable cache item 'Compilation/modules|javascript/auto|/magicpack/node_modules/next/dist/build/webpack/loaders/next-flight-css-loader.js??ruleSet[1].rules[14].oneOf[9].use[0]!/magicpack/node_modules/next/dist/build/webpack/loaders/css-loader/src/index.js??ruleSet[1].rules[14].oneOf[9].use[1]!/magicpack/node_modules/next/dist/build/webpack/loaders/postcss-loader/src/index.js??ruleSet[1].rules[14].oneOf[9].use[2]!/magicpack/node_modules/next/dist/build/webpack/loaders/resolve-url-loader/index.js??ruleSet[1].rules[14].oneOf[9].use[3]!/magicpack/node_modules/next/dist/compiled/sass-loader/cjs.js??ruleSet[1].rules[14].oneOf[9].use[4]!/magicpack/components/Computer.module.scss|ssr': No serializer registered for SassError while serializing webpack/lib/cache/PackFileCacheStrategy.PackContentItems -> webpack/lib/NormalModule -> webpack/lib/ModuleBuildError -> SassError [webpack.cache.PackFileCacheStrategy] Skipped not serializable cache item 'Compilation/modules|javascript/auto|/magicpack/node_modules/next/dist/build/webpack/loaders/next-flight-css-loader.js??ruleSet[1].rules[14].oneOf[9].use[0]!/magicpack/node_modules/next/dist/build/webpack/loaders/css-loader/src/index.js??ruleSet[1].rules[14].oneOf[9].use[1]!/magicpack/node_modules/next/dist/build/webpack/loaders/postcss-loader/src/index.js??ruleSet[1].rules[14].oneOf[9].use[2]!/magicpack/node_modules/next/dist/build/webpack/loaders/resolve-url-loader/index.js??ruleSet[1].rules[14].oneOf[9].use[3]!/magicpack/node_modules/next/dist/compiled/sass-loader/cjs.js??ruleSet[1].rules[14].oneOf[9].use[4]!/magicpack/components/WakeButton.module.scss|ssr': No serializer registered for SassError while serializing webpack/lib/cache/PackFileCacheStrategy.PackContentItems -> webpack/lib/NormalModule -> webpack/lib/ModuleBuildError -> SassError  [webpack.cache.PackFileCacheStrategy] Skipped not serializable cache item 'Compilation/modules|javascript/auto|/magicpack/node_modules/next/dist/build/webpack/loaders/next-flight-css-loader.js??ruleSet[1].rules[14].oneOf[9].use[0]!/magicpack/node_modules/next/dist/build/webpack/loaders/css-loader/src/index.js??ruleSet[1].rules[14].oneOf[9].use[1]!/magicpack/node_modules/next/dist/build/webpack/loaders/postcss-loader/src/index.js??ruleSet[1].rules[14].oneOf[9].use[2]!/magicpack/node_modules/next/dist/build/webpack/loaders/resolve-url-loader/index.js??ruleSet[1].rules[14].oneOf[9].use[3]!/magicpack/node_modules/next/dist/compiled/sass-loader/cjs.js??ruleSet[1].rules[14].oneOf[9].use[4]!/magicpack/components/User.module.scss|ssr': No serializer registered for SassError while serializing webpack/lib/cache/PackFileCacheStrategy.PackContentItems -> webpack/lib/NormalModule -> webpack/lib/ModuleBuildError -> SassError Failed to compile. ./app/page.module.scss SassError: Undefined variable. ╷ 7 │ color: $app_color_full; │ ^^^^^^^^^^^^^^^ ╵ app/page.module.scss 7:12 root stylesheet Import trace for requested module: ./app/page.module.scss ./app/page.tsx ./components/Computer.module.scss SassError: Undefined variable. ╷ 2 │ background-color: $computer_background; │ ^^^^^^^^^^^^^^^^^^^^ ╵ components/Computer.module.scss 2:21 root stylesheet Import trace for requested module: ./components/Computer.module.scss ./components/Computer.tsx ./app/[user]/page.tsx ./components/Description.module.scss SassError: Undefined variable. ╷ 7 │ color: $app_color_full; │ ^^^^^^^^^^^^^^^ ╵ components/Description.module.scss 7:12 root stylesheet Import trace for requested module: ./components/Description.module.scss ./components/Description.tsx ./app/[user]/page.tsx ./components/Footer.module.scss SassError: Undefined variable. ╷ 10 │ background-color: $footer_color; │ ^^^^^^^^^^^^^ ╵ components/Footer.module.scss 10:23 root stylesheet Import trace for requested module: ./components/Footer.module.scss ./components/Footer.tsx ./app/page.tsx ./components/Header.module.scss SassError: Undefined variable. ╷ 7 │ @media (max-width: $layout_breakpoint_2) { │ ^^^^^^^^^^^^^^^^^^^^ ╵ components/Header.module.scss 7:22 root stylesheet Import trace for requested module: ./components/Header.module.scss ./components/Header.tsx ./app/[user]/page.tsx Build failed because of webpack errors

`

alex-swki commented 10 months ago

Hey, can you please send me your .env and docker-compose file? This has to do with the App Theme Variable NEXT_PUBLIC_COLOR_THEME in your .env file. Also make sure that the .env file bind into the container is working correctly.

Dima-Kal commented 10 months ago

does it have to be .env file? i've used Environments in docker compose:

  magicpack:
    image: alexswki/magicpack
    dns:
      - ${PIHOLE_DNS}
    networks:
      - ${DOCKER_NETWORK}
    restart: always
    container_name: magicpack
    environment:
      - NEXT_PUBLIC_URL="https://magicpack.${SERVER_DOMAIN}" #Set this to the URL which users will access MagicPack with
      - NEXT_PUBLIC_COLOR_THEME="DARK" #Can either be "LIGHT" or "DARK".
     # - NEXT_PUBLIC_COMPANY_LOGO_PATH="/img/logo.png" Path to your company logo. Actual path will be /magicpack-app/public/img/logo.png
     # - NEXT_PUBLIC_COMPANY_LOGO_WIDTH=240 Adjust this value if your company logo is too big or too small. Width in CSS Pixel
      - NEXT_PUBLIC_PAGE_TITLE="Wake On Lan" #Enter any string you like in here for the title position.
      - NEXT_PUBLIC_PAGE_DESC1="Wake up your company computer using the button below." #Enter any string you like in here for the 1st paragraph.
      - NEXT_PUBLIC_PAGE_DESC2="When your computer is running, you can connect via Remote Desktop." #Enter any string you like in here for the 2nd paragraph.
    volumes:
      - ./configs/magicpack/computers.json:/magicpack/computers.json
     # - ./.env:/magicpack/.env.local
    labels:
      - "traefik.enable=true"
      - "traefik.http.routers.magicpack.rule=Host(`magicpack.${SERVER_DOMAIN}`, `wol.${SERVER_DOMAIN}`)"
      - "traefik.http.routers.magicpack.entrypoints=websecure"
      - "traefik.http.services.magicpack.loadbalancer.server.port=3000"
alex-swki commented 10 months ago

Yes, I have not yet had time to implement a cleaner solution. The .env file is just being mounted as a file in the source code which is compiled at Docker Build time even with the prebuilt image. See the docker-compose file I provided in the master branch for a reference of the bind mount which is required at the moment :)