No support for resolving es modules imported from... #14559
Description
Environment
Nuxt CLI v3.0.0-rc.7 (Have tried rc8, issue persists) 00:45:09
RootDir: nuxt3 00:45:16
Nuxt project info: 00:45:16
- Operating System:
Linux - Node Version:
v16.15.1 - Nuxt Version:
3.0.0-rc.7(Have tried rc8, issue persists) - Package Manager:
yarn@1.22.19 - Builder:
vite - User Config:
modules,build - Runtime Modules:
@nuxtjs/color-mode@3.0.2,@nuxtjs/tailwindcss@5.0.4 - Build Modules:
-
Reproduction
To reproduce the bug, load a base installation of Nuxt3 RC 7 or 8 with the following dependencies:
- "@nuxtjs/color-mode": "^3.0.2"
- "@nuxtjs/tailwindcss": "^5.0.4"
- "nuxt": "3.0.0-rc.7"
- "@headlessui/vue": "^1.6.5",
- "@heroicons/vue": "^1.0.6",
- "@tailwindcss/forms": "^0.5.2",
- "echarts": "^5.3.3",
- "postcss-custom-properties": "^12.1.8",
- "tailwindcss-dark-mode": "^1.1.7",
- "ts-node": "^10.8.1",
- "typescript": "^4.6.4",
- "uuid": "^8.3.2",
- "vue-chart-3": "^3.1.8",
- "vue-echarts": "^6.2.3"
Immediately after running "yarn dev" the bug will occur
Describe the bug
Nuxt 3 is expected to boot and correctly display the site, however due to the bug this fails and loads nothing.
Additional context
I have successfully been developing with this configuration starting at RC 3 and have had no issue up until and including RC 6, after updating to RC 8 this error occurred (there were no file changes made, that I am aware of other than the nuxt update). Upon encountering this issue in the RC 8, I reset the git commit to RC 6 and attempted again with RC 7 to see if the issue was introduced in RC 7 or 8. The issue persisted in RC 7, which is why I am releasing the bug report on RC 7 to narrow down the possible area of bug origin. (Two versions worth of patches is less than one ;). Hope this can be solved -AwesomeDude091
Logs
[worker reload] [worker init] The requested module 'file:///nuxt3/node_modules/vue-bundle-renderer/dist/index.mjs' does not provide an export named 'createRenderer'
import { createRenderer } from 'node_modules/vue-bundle-renderer/dist/index.mjs';
^^^^^^^^^^^^^^
SyntaxError: The requested module 'node_modules/vue-bundle-renderer/dist/index.mjs' does not provide an export named 'createRenderer'
at ModuleJob._instantiate (node:internal/modules/esm/module_job:128:21)
at async ModuleJob.run (node:internal/modules/esm/module_job:194:5)
at async Promise.all (index 0)
at async ESMLoader.import (node:internal/modules/esm/loader:385:24)
at async loadESM (node:internal/process/esm_loader:88:5)
at async handleMainPromise (node:internal/modules/run_main:61:12)
✔ Nitro built in 370 ms nitro 00:44:29
Error [ERR_UNSUPPORTED_DIR_IMPORT]: Directory import 'nuxt3/node_modules/@heroicons/vue/outline' is not supported resolving ES modules imported from nuxt3/.nuxt/dist/server/server.mjs
Did you mean to import @heroicons/vue/outline/index.js?
at new NodeError (node:internal/errors:372:5)
at finalizeResolution (node:internal/modules/esm/resolve:433:17)
at moduleResolve (node:internal/modules/esm/resolve:1009:10)
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 ESMLoader.import (node:internal/modules/esm/loader:380:22)
at importModuleDynamically (node:internal/modules/esm/translators:106:35)
at importModuleDynamicallyCallback (node:internal/process/esm_loader:35:14)
at $id_DTUs8dO0YJ (file:///nuxt3/.nuxt/dist/server/server.mjs:134972:9) {
code: 'ERR_UNSUPPORTED_DIR_IMPORT',
url: 'file:///nuxt3/node_modules/@heroicons/vue/outline'
}