nuxt
Root page defaults to about.md instead of index.md
Environment
- Operating System:
Darwin - Node Version:
v16.14.0 - Nuxt Version:
3.0.0-rc.3 - Package Manager:
[email protected] - Builder:
vite - User Config:
modules - Runtime Modules:
@nuxt/[email protected] - Build Modules:
-
Reproduction
- Create a fresh nuxt content project with:
npx nuxi init blog -t content(as described on the Get Started guide) - cd into blog:
cd blog - Install dependencies with yarn:
yarn install - Start dev server:
yarn dev - Browse to http://localhost:3000
- It renders the
about.mdrather than theindex.mdpage
Describe the bug
According to https://content.nuxtjs.org/guide/writing/content-directory the root page should be index.md, however it is rendering about.md instead.
Screen recording of completely fresh install showing the described behavior:
Additional context
No response
Logs
No response
Can confirm this also happens for me
Environment
- Operating System:
Mac OS - Node Version:
v16.11.1 - Nuxt Version:
3.0.0-rc.3 - Package Manager:
[email protected] - Builder:
vite - User Config:
modules - Runtime Modules:
@nuxt/[email protected] - Build Modules:
-
This should be fixed in #1224. You can try it by using @nuxt/content-edge.
'@nuxt/content': 'npm:@nuxt/content-edge@latest',
This should be fixed in #1224. You can try it by using
@nuxt/content-edge.'@nuxt/content': 'npm:@nuxt/content-edge@latest',
Can confirm fixed in edge. Any thoughts on when that will be merged?
There is no ETA for the next version. We are working on a couple of improvements and fixes. I'll keep this issue open to notify you all.
I changed the line in package.json as suggested in https://github.com/nuxt/content/issues/1237#issuecomment-1152131314, but this gives me another problem when starting the dev servers and renders the whole app unusable:
Nuxt CLI v3.0.0-rc.3 18:26:34
18:26:34
> Local: http://localhost:3000/
> Network: [redacted]
ℹ Vite client warmed up in 300ms 18:26:36
ℹ Vite server warmed up in 75ms 18:26:36
✔ Vite server built in 556ms 18:26:37
✔ Nitro built in 584 ms nitro 18:26:37
TypeError [ERR_PACKAGE_IMPORT_NOT_DEFINED]: Package import specifier "#imports" is not defined in package /Users/remi/Sites/nuxt3/content-app/node_modules/.pnpm/@[email protected]/node_modules/@nuxt/content-edge/package.json imported from /Users/remi/Sites/nuxt3/content-app/node_modules/.pnpm/@[email protected]/node_modules/@nuxt/content-edge/dist/runtime/components/ContentDoc.mjs
at new NodeError (node:internal/errors:372:5)
at throwImportNotDefined (node:internal/modules/esm/resolve:461:9)
at packageImportsResolve (node:internal/modules/esm/resolve:841:3)
at moduleResolve (node:internal/modules/esm/resolve:997:21)
at defaultResolve (node:internal/modules/esm/resolve:1218:11)
at ESMLoader.resolve (node:internal/modules/esm/loader:580:30)
at ESMLoader.getModuleJob (node:internal/modules/esm/loader:294:18)
at ModuleWrap.<anonymous> (node:internal/modules/esm/module_job:80:40)
at link (node:internal/modules/esm/module_job:78:36) {
code: 'ERR_PACKAGE_IMPORT_NOT_DEFINED'
}
Versions I’m using:
- pnpm 7.1.6
- node v16.15.0
I changed the line in
package.jsonas suggested in #1237 (comment), but this gives me another problem when starting the dev servers and renders the whole app unusable:Nuxt CLI v3.0.0-rc.3 18:26:34 18:26:34 > Local: http://localhost:3000/ > Network: [redacted] ℹ Vite client warmed up in 300ms 18:26:36 ℹ Vite server warmed up in 75ms 18:26:36 ✔ Vite server built in 556ms 18:26:37 ✔ Nitro built in 584 ms nitro 18:26:37 TypeError [ERR_PACKAGE_IMPORT_NOT_DEFINED]: Package import specifier "#imports" is not defined in package /Users/remi/Sites/nuxt3/content-app/node_modules/.pnpm/@[email protected]/node_modules/@nuxt/content-edge/package.json imported from /Users/remi/Sites/nuxt3/content-app/node_modules/.pnpm/@[email protected]/node_modules/@nuxt/content-edge/dist/runtime/components/ContentDoc.mjs at new NodeError (node:internal/errors:372:5) at throwImportNotDefined (node:internal/modules/esm/resolve:461:9) at packageImportsResolve (node:internal/modules/esm/resolve:841:3) at moduleResolve (node:internal/modules/esm/resolve:997:21) at defaultResolve (node:internal/modules/esm/resolve:1218:11) at ESMLoader.resolve (node:internal/modules/esm/loader:580:30) at ESMLoader.getModuleJob (node:internal/modules/esm/loader:294:18) at ModuleWrap.<anonymous> (node:internal/modules/esm/module_job:80:40) at link (node:internal/modules/esm/module_job:78:36) { code: 'ERR_PACKAGE_IMPORT_NOT_DEFINED' }Versions I’m using:
- pnpm 7.1.6
- node v16.15.0
I'm experiencing the same issue here:
npm run dev
> dev
> nuxt dev
Nuxt CLI v3.0.0-rc.4 17:07:40
17:07:40
> Local: http://localhost:3000/
i Using Tailwind CSS from ~/assets\css\main.css nuxt:tailwindcss 17:07:48
i Merging Tailwind config from ~/tailwind.config.js nuxt:tailwindcss 17:07:48
i Tailwind Viewer: http://localhost:3000/_tailwind/ nuxt:tailwindcss 17:07:59
WARN 17:08:27
WARN warn - No utility classes were detected in your source files. If this is unexpected, double-check the content option in your Tailwind CSS configuration.
WARN warn - https://tailwindcss.com/docs/content-configuration 17:08:27
i Vite server warmed up in 2110ms 17:08:34
i Vite client warmed up in 12589ms 17:08:34
√ Vite server built in 5872ms 17:08:37
√ Nitro built in 9843 ms nitro 17:08:48
TypeError [ERR_PACKAGE_IMPORT_NOT_DEFINED]: Package import specifier "#imports" is not defined in package C:\Users\user\Documents\otherprojs\content-blog\node_modules\.pnpm\@[email protected]\node_modules\@nuxt\content-edge\package.json imported from C:\Users\user\Documents\otherprojs\content-blog\node_modules\.pnpm\@[email protected]\node_modules\@nuxt\content-edge\dist\runtime\components\ContentDoc.mjs
at new NodeError (node:internal/errors:371:5)
at throwImportNotDefined (node:internal/modules/esm/resolve:429:9)
at packageImportsResolve (node:internal/modules/esm/resolve:778:3)
at moduleResolve (node:internal/modules/esm/resolve:924:21)
at defaultResolve (node:internal/modules/esm/resolve:1044:11)
at ESMLoader.resolve (node:internal/modules/esm/loader:422:30)
at ESMLoader.getModuleJob (node:internal/modules/esm/loader:222:40)
at ModuleWrap.<anonymous> (node:internal/modules/esm/module_job:76:40)
at link (node:internal/modules/esm/module_job:75:36) {
code: 'ERR_PACKAGE_IMPORT_NOT_DEFINED'
}
Versions I’m using:
- pnpm 7.2.1
- node v16.13.0
UPDATE
Switched to yarn.
Removed all pnpm files and deleted node_modules.
Ran yarn install in the project
Once the installation was complete, Ran yarn dev.
It works, the page renders but this error shows up in the terminal
yarn dev
yarn run v1.22.15
$ nuxt dev
Nuxt CLI v3.0.0-rc.4 18:04:24
18:04:24
> Local: http://localhost:3000/
i Using Tailwind CSS from ~/assets\css\main.css nuxt:tailwindcss 18:04:31
i Merging Tailwind config from ~/tailwind.config.js nuxt:tailwindcss 18:04:31
i Tailwind Viewer: http://localhost:3000/_tailwind/ nuxt:tailwindcss 18:04:32
WARN 18:04:36
WARN warn - No utility classes were detected in your source files. If this is unexpected, double-check the content option in your Tailwind CSS configuration.
WARN warn - https://tailwindcss.com/docs/content-configuration 18:04:36
i Vite server warmed up in 1952ms 18:04:40
i Vite client warmed up in 6145ms 18:04:40
√ Vite server built in 7622ms 18:04:46
ERROR [worker reload] [worker init] Cannot find module 'C:\Users\user\Documents\otherprojs\content-blog\node_modules\.pnpm\[email protected]\node_modules\node-fetch-native\dist\polyfill.mjs' imported from C:\Users\user\Documents\otherprojs\content-blog\.nuxt\dev\index.mjs
at new NodeError (node:internal/errors:371:5)
at finalizeResolution (node:internal/modules/esm/resolve:416:11)
at moduleResolve (node:internal/modules/esm/resolve:932:10)
at defaultResolve (node:internal/modules/esm/resolve:1044:11)
at ESMLoader.resolve (node:internal/modules/esm/loader:422:30)
at ESMLoader.getModuleJob (node:internal/modules/esm/loader:222:40)
at ModuleWrap.<anonymous> (node:internal/modules/esm/module_job:76:40)
at link (node:internal/modules/esm/module_job:75:36)
√ Nitro built in 5813 ms nitro 18:04:52
√ Vite server built in 1066ms
Versions I’m using:
- yarn v1.22.15
- node v16.13.0
package.json:
{
"private": true,
"scripts": {
"build": "nuxt build",
"dev": "nuxt dev",
"generate": "nuxt generate",
"preview": "nuxt preview"
},
"devDependencies": {
"@heroicons/vue": "^1.0.6",
"@nuxt/content": "npm:@nuxt/content-edge@latest",
"@nuxtjs/tailwindcss": "^5.1.2",
"@tailwindcss/forms": "^0.5.2",
"nuxt": "^3.0.0-rc.4"
}
}
For now, I use "@nuxt/content-edge": "latest", with modules: ['@nuxt/content-edge'] in nuxt.config.ts.
For those using pnpm, you can rename your index.md to something like home.md and then inside [...slug].vue change the <ContentDoc /> line to <ContentDoc :path="$route.path === '/' ? '/home' : $route.path" /> 👍
Looks like this has been fixed in the edge-channel version. You can follow the instructions on this page to get the latest changes: https://content.nuxtjs.org/guide/migration/edge-channel
I am on the edge-channel. I have renamed this about.md file and even moved it to another folder. Still on every npm run dev, I got this in the Terminal
[Vue Router warn]: No match found for location with path "/about"
Later realized that the index.md file linked to it, so removed that line, and no error now.
