HugoRCD / canvas

Portfolio template made with Nuxt 3, Nuxt Content and TailwindCSS
https://canvas.hrcd.fr
Apache License 2.0
112 stars 23 forks source link

Site looks beautiful, but gives errors when I try it #73

Closed garyo closed 3 weeks ago

garyo commented 3 weeks ago

Environment

MacOS, node 20, Chrome, yum.

Version

latest from github, just cloned

Reproduction

Description

The above steps give several errors, and the site doesn't load. I just get the "Nuxt" loading page.

Errors:

% yarn dev
yarn run v1.22.19
$ nuxt dev
Nuxt 3.13.0 with Nitro 2.9.7                                                                                                                                    5:20:44 PM
                                                                                                                                                                5:20:44 PM
  ➜ Local:    http://localhost:3000/
  ➜ Network:  use --host to expose

ℹ Using default Tailwind CSS file                                                                                                             nuxt:tailwindcss 5:20:45 PM
  ➜ DevTools: press Shift + Option + D in the browser (v1.3.14)                                                                                                 5:20:46 PM

 WARN                                                                                                                                                           5:20:46 PM

 WARN  warn - The purge/content options have changed in Tailwind CSS v3.0.                                                                                      5:20:46 PM

 WARN  warn - Update your configuration file to eliminate this warning.                                                                                         5:20:46 PM

 WARN  warn - https://tailwindcss.com/docs/upgrade-guide#configure-content-sources                                                                              5:20:46 PM

ℹ Nuxt Icon server bundle mode is set to local                                                                                                                 5:20:47 PM
✔ Nuxt Icon discovered local-installed 6 collections: carbon, heroicons, logos, lucide, ri, tabler                                                             5:20:48 PM
ℹ Running with compatibility version 4                                                                                                                         5:20:48 PM
ℹ Tailwind Viewer: http://localhost:3000/_tailwind/                                                                                           nuxt:tailwindcss 5:20:48 PM
✔ Vite client built in 28ms                                                                                                                                    5:20:48 PM

 WARN                                                                                                                                                           5:20:50 PM

[5:20:50 PM]  WARN  warn - Your content configuration includes a pattern which looks like it's accidentally matching all of node_modules and can cause serious performance issues.

 WARN  warn - Pattern: ./**/*.svg                                                                                                                               5:20:50 PM

 WARN  warn - See our documentation for recommendations:                                                                                                        5:20:50 PM

 WARN  warn - https://tailwindcss.com/docs/content-configuration#pattern-recommendations                                                                        5:20:50 PM

✔ Vite server built in 1733ms                                                                                                                                  5:20:50 PM
✔ Nuxt Nitro server built in 1597 ms                                                                                                                     nitro 5:20:53 PM

[5:20:54 PM]  ERROR  [worker reload] [worker init] Cannot find package 'react-dom' imported from /Users/garyo/astrid/tutor-site/site-v1/node_modules/@react-email/render/dist/node/index.mjs

  at packageResolve (node:internal/modules/esm/resolve:854:9)
  at moduleResolve (node:internal/modules/esm/resolve:927:18)
  at defaultResolve (node:internal/modules/esm/resolve:1169:11)
  at ModuleLoader.defaultResolve (node:internal/modules/esm/loader:383:12)
  at ModuleLoader.resolve (node:internal/modules/esm/loader:352:25)
  at ModuleLoader.getModuleJob (node:internal/modules/esm/loader:227:38)
  at ModuleWrap.<anonymous> (node:internal/modules/esm/module_job:87:39)
  at link (node:internal/modules/esm/module_job:86:36)

ℹ Vite client warmed up in 6047ms                                                                                                                              5:20:59 PM
ℹ Vite server warmed up in 6160ms                                                                                                                              5:20:59 PM
✘ [ERROR] No matching export in "node_modules/@intlify/shared/dist/shared.mjs" for import "incrementer"

    node_modules/@intlify/core-base/dist/core-base.mjs:6:121:
      6 │ ...String, isNumber, isPlainObject, assign, join, toDisplayString, isArray, incrementer, format as format$1, isPromise, isBoolean, warn, isRegExp, warnOnce, es...
        ╵                                                                             ~~~~~~~~~~~

✘ [ERROR] No matching export in "node_modules/@intlify/message-compiler/dist/message-compiler.mjs" for import "CompileWarnCodes"

    node_modules/@intlify/core-base/dist/core-base.mjs:7:9:
      7 │ import { CompileWarnCodes, CompileErrorCodes, createCompileError, detectHtmlTag, defaultOnError, baseCompile as baseCompile$1 } from '@intlify/message-compiler';
        ╵          ~~~~~~~~~~~~~~~~

 ERROR  error while updating dependencies:                                                                                                                      5:20:59 PM
Error: Build failed with 2 errors:
node_modules/@intlify/core-base/dist/core-base.mjs:6:121: ERROR: No matching export in "node_modules/@intlify/shared/dist/shared.mjs" for import "incrementer"
node_modules/@intlify/core-base/dist/core-base.mjs:7:9: ERROR: No matching export in "node_modules/@intlify/message-compiler/dist/message-compiler.mjs" for import "CompileWarnCodes"
    at failureErrorWithLog (/Users/garyo/astrid/tutor-site/site-v1/node_modules/vite/node_modules/esbuild/lib/main.js:1472:15)
    at /Users/garyo/astrid/tutor-site/site-v1/node_modules/vite/node_modules/esbuild/lib/main.js:945:25
    at /Users/garyo/astrid/tutor-site/site-v1/node_modules/vite/node_modules/esbuild/lib/main.js:1353:9
    at process.processTicksAndRejections (node:internal/process/task_queues:95:5)

Additional context

none

Logs

Here's the yarn install log:

% yarn
yarn install v1.22.19
info No lockfile found.
[1/4] 🔍  Resolving packages...
warning @nuxt/ui > @nuxtjs/tailwindcss > tailwind-config-viewer > replace-in-file > glob@7.2.3: Glob versions prior to v9 are no longer supported
warning @nuxt/ui > @nuxtjs/tailwindcss > tailwind-config-viewer > replace-in-file > glob > inflight@1.0.6: This module is not supported, and leaks memory. Do not use it. Check out lru-cache if you want a good and tested way to coalesce async requests by a key value, which is much more comprehensive and powerful.
warning nuxt > nitropack > @rollup/plugin-commonjs > glob@8.1.0: Glob versions prior to v9 are no longer supported
warning nuxt > nitropack > @rollup/plugin-commonjs > glob > inflight@1.0.6: This module is not supported, and leaks memory. Do not use it. Check out lru-cache if you want a good and tested way to coalesce async requests by a key value, which is much more comprehensive and powerful.
warning nuxt > nitropack > @vercel/nft > glob@7.2.3: Glob versions prior to v9 are no longer supported
warning nuxt > nitropack > @vercel/nft > @mapbox/node-pre-gyp > rimraf@3.0.2: Rimraf versions prior to v4 are no longer supported
warning nuxt > nitropack > @vercel/nft > @mapbox/node-pre-gyp > rimraf > glob@7.2.3: Glob versions prior to v9 are no longer supported
warning nuxt > nitropack > @vercel/nft > @mapbox/node-pre-gyp > npmlog@5.0.1: This package is no longer supported.
warning nuxt > nitropack > @vercel/nft > @mapbox/node-pre-gyp > npmlog > are-we-there-yet@2.0.0: This package is no longer supported.
warning nuxt > nitropack > @vercel/nft > @mapbox/node-pre-gyp > npmlog > gauge@3.0.2: This package is no longer supported.
warning nuxt-og-image > css-inline@0.11.2: This package has been renamed to @css-inline/css-inline
warning nuxt-og-image > nuxt-site-config > shiki-es@0.14.0: Please migrate to https://github.com/antfu/shikiji
[2/4] 🚚  Fetching packages...
warning vscode-languageclient@7.0.0: The engine "vscode" appears to be invalid.
[3/4] 🔗  Linking dependencies...
warning "@nuxt/content > @vueuse/head@2.0.0" has unmet peer dependency "vue@>=2.7 || >=3".
warning "@nuxt/content > @vueuse/core > vue-demi@0.14.10" has unmet peer dependency "vue@^3.0.0-0 || ^2.6.0".
warning " > @nuxt/devtools@1.3.14" has unmet peer dependency "vite@*".
warning "@nuxt/devtools > vite-plugin-inspect@0.8.7" has unmet peer dependency "vite@^3.1.0 || ^4.0.0 || ^5.0.0-0".
warning "@nuxt/devtools > vite-plugin-vue-inspector@5.1.3" has unmet peer dependency "vite@^3.0.0-0 || ^4.0.0-0 || ^5.0.0-0".
warning "@nuxt/devtools > @nuxt/devtools-kit@1.3.14" has unmet peer dependency "vite@*".
warning "@nuxt/devtools > @vue/devtools-core > vite-hot-client@0.2.3" has unmet peer dependency "vite@^2.6.0 || ^3.0.0 || ^4.0.0 || ^5.0.0-0".
warning "@nuxt/eslint-config > eslint-plugin-import-x > @typescript-eslint/utils@7.18.0" has incorrect peer dependency "eslint@^8.56.0".
warning "@nuxt/eslint-config > @typescript-eslint/eslint-plugin > ts-api-utils@1.3.0" has unmet peer dependency "typescript@>=4.2.0".
warning "@nuxt/ui > @headlessui/vue@1.7.22" has unmet peer dependency "vue@^3.2.0".
warning "@nuxt/ui > @nuxt/icon > @iconify/vue@4.1.3-beta.1" has unmet peer dependency "vue@>=3".
warning "@nuxt/ui > @headlessui/vue > @tanstack/vue-virtual@3.10.4" has unmet peer dependency "vue@^2.7.0 || ^3.0.0".
warning "@nuxtjs/i18n > vue-router@4.4.3" has unmet peer dependency "vue@^3.2.0".
warning "@nuxtjs/i18n > vue-i18n@10.0.0-beta.5" has unmet peer dependency "vue@^3.0.0".
warning "@nuxtjs/i18n > @intlify/unplugin-vue-i18n@5.0.0-beta.4" has unmet peer dependency "vue@^3.2.25".
warning "@nuxtjs/i18n > @miyaneee/rollup-plugin-json5@1.2.0" has unmet peer dependency "rollup@^1.20.0 || ^2.0.0 || ^3.0.0 || ^4.0.0".
warning "nuxt-og-image > nuxt-site-config > site-config-stack@1.6.7" has unmet peer dependency "vue@^3".
warning "nuxt-og-image > nuxt-site-config > @nuxt/devtools-ui-kit > v-lazy-show@0.2.4" has unmet peer dependency "@vue/compiler-core@^3.3".
warning "nuxt-og-image > nuxt-site-config > @nuxt/devtools-ui-kit > unocss > @unocss/vite@0.62.3" has unmet peer dependency "vite@^2.9.0 || ^3.0.0-0 || ^4.0.0 || ^5.0.0-0".
warning "nuxt-og-image > nuxt-site-config > @nuxt/devtools-ui-kit > unocss > @unocss/postcss@0.62.3" has unmet peer dependency "postcss@^8.4.21".
warning "nuxt-og-image > nuxt-site-config > @nuxt/devtools-ui-kit > @unocss/nuxt > @unocss/webpack@0.62.3" has unmet peer dependency "webpack@^4 || ^5".
warning " > nuxt-svgo@4.0.3" has unmet peer dependency "vue@>=3.2.13".
warning "resend > @react-email/render@0.0.16" has unmet peer dependency "react@^18.2.0".
warning "resend > @react-email/render@0.0.16" has unmet peer dependency "react-dom@^18.2.0".
[4/4] 🔨  Building fresh packages...
success Saved lockfile.
warning Your current version of Yarn is out of date. The latest version is "1.22.22", while you're on "1.22.19".
info To upgrade, run the following command:
$ curl --compressed -o- -L https://yarnpkg.com/install.sh | bash
$ nuxt prepare
ℹ Using default Tailwind CSS file                                                                                                             nuxt:tailwindcss 5:20:36 PM
ℹ Nuxt Icon server bundle mode is set to local                                                                                                                 5:20:37 PM
✔ Nuxt Icon discovered local-installed 6 collections: carbon, heroicons, logos, lucide, ri, tabler                                                             5:20:38 PM
ℹ Running with compatibility version 4                                                                                                                         5:20:38 PM
✔ Types generated in .nuxt                                                                                                                                     5:20:38 PM
✨  Done in 42.57s.
HugoRCD commented 3 weeks ago

Hello, thank you for the compliment on the site. I have just made some corrections to dependencies and some fixes. I have tested a fresh installation, and it seems to work very well on my machine. Would you like to try testing it with the latest version?

garyo commented 3 weeks ago

Thanks for this. With a fresh install following your README instructions, I get this in the browser:

image

and this error message when starting up:

 ERROR  [nitro] [uncaughtException] Missing API key. Pass it to the constructor new Resend("re_123")

  at new Resend (node_modules/resend/dist/index.mjs:348:15)
  at <anonymous> (server/api/sendEmail.ts:5:1)
  at ModuleJob.run (node:internal/modules/esm/module_job:234:25)
  at async ModuleLoader.import (node:internal/modules/esm/loader:473:24)
  at async asyncRunEntryPointWithESMLoader (node:internal/modules/run_main:123:5)

so maybe I just need to stub some things out, or add a .env.... ⭐ Aha, in fact once I copy your .env.exemple to .env the site comes up now. Thanks! (I know I'll have to fill out correct settings in the .env of course.) So maybe just add cp .env.exemple .env to the README instructions for newbies like me. :-)

HugoRCD commented 3 weeks ago

Thank you for the advice! I will add that to the README. I hope the template will meet your expectations!