Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

[turbopack] Unable to resolve any modules #4763

Closed
jakeleventhal opened this issue May 1, 2023 · 12 comments
Closed

[turbopack] Unable to resolve any modules #4763

jakeleventhal opened this issue May 1, 2023 · 12 comments
Labels
kind: bug Something isn't working linear: turbopack needs: triage New issues get this label. Remove it after triage owned-by: turbopack

Comments

@jakeleventhal
Copy link
Contributor

jakeleventhal commented May 1, 2023

What version of Next.js are you using Turbopack in?

13.3.1

What package manager are you using / does the bug impact?

pnpm

What operating system are you using?

Mac

Describe the Bug

When I start my server, I get the following errors

▶ npx next dev --turbo --show-all
info  - Loaded env from /Users/jakeleventhal/Code/Ecominate/apps/print-lab/client/.env
>>> TURBOPACK (alpha)

Thank you for trying Next.js v13 with Turbopack! As a reminder,
Turbopack is currently in alpha and not yet ready for production.
We appreciate your ongoing support as we work to make it ready
for everyone.

Learn more about Next.js v13 and Turbopack: https://nextjs.link/with-turbopack
Please direct feedback to: https://nextjs.link/turbopack-feedback

ready - started server on :::3000, url: http://localhost:3000
event - startup 3.543ms
error -
  [resolve]
    [next]/entry/fallback.tsx
      Error resolving EcmaScript Modules request
      unable to resolve module "react" with subpath "/jsx-dev-runtime"

      Error resolving EcmaScript Modules request
      unable to resolve module "react-dom" with subpath "/client"

    [next]/internal/shims-client.ts
      Error resolving EcmaScript Modules request
      unable to resolve uri "node:" "process"

    [next]/internal/shims.ts
      Error resolving EcmaScript Modules request
      unable to resolve uri "node:" "process"

    [next]/overlay/internal/ErrorBoundary.tsx
      Error resolving EcmaScript Modules request
      unable to resolve module "react"

    [next]/overlay/internal/ReactDevOverlay.tsx
      Error resolving EcmaScript Modules request
      unable to resolve module "react"

      Error resolving EcmaScript Modules request
      unable to resolve module "react" with subpath "/jsx-dev-runtime"

    [next]/overlay/internal/components/CodeFrame/CodeFrame.tsx
      Error resolving EcmaScript Modules request
      unable to resolve module "react"

      Error resolving EcmaScript Modules request
      unable to resolve module "react" with subpath "/jsx-dev-runtime"

      Error resolving EcmaScript Modules request
      unable to resolve uri "node:" "process"

    [next]/overlay/internal/components/Dialog/Dialog.tsx
      Error resolving EcmaScript Modules request
      unable to resolve module "react"

      Error resolving EcmaScript Modules request
      unable to resolve module "react" with subpath "/jsx-dev-runtime"

    [next]/overlay/internal/components/Dialog/DialogBody.tsx
      Error resolving EcmaScript Modules request
      unable to resolve module "react" with subpath "/jsx-dev-runtime"

    [next]/overlay/internal/components/Dialog/DialogContent.tsx
      Error resolving EcmaScript Modules request
      unable to resolve module "react" with subpath "/jsx-dev-runtime"

    [next]/overlay/internal/components/Dialog/DialogHeader.tsx
      Error resolving EcmaScript Modules request
      unable to resolve module "react"

      Error resolving EcmaScript Modules request
      unable to resolve module "react" with subpath "/jsx-dev-runtime"

    [next]/overlay/internal/components/Dialog/DialogHeaderTabList.tsx
      Error resolving EcmaScript Modules request
      unable to resolve module "react" with subpath "/jsx-dev-runtime"

    [next]/overlay/internal/components/LeftRightDialogHeader/LeftRightDialogHeader.tsx
      Error resolving EcmaScript Modules request
      unable to resolve module "react"

      Error resolving EcmaScript Modules request
      unable to resolve module "react" with subpath "/jsx-dev-runtime"

    [next]/overlay/internal/components/Overlay/Overlay.tsx
      Error resolving EcmaScript Modules request
      unable to resolve module "react"

      Error resolving EcmaScript Modules request
      unable to resolve module "react" with subpath "/jsx-dev-runtime"

    [next]/overlay/internal/components/ShadowPortal.tsx
      Error resolving EcmaScript Modules request
      unable to resolve module "react"

      Error resolving EcmaScript Modules request
      unable to resolve module "react" with subpath "/jsx-dev-runtime"

      Error resolving EcmaScript Modules request
      unable to resolve module "react-dom"

    [next]/overlay/internal/components/Tabs/index.tsx
      Error resolving EcmaScript Modules request
      unable to resolve module "react"

      Error resolving EcmaScript Modules request
      unable to resolve module "react" with subpath "/jsx-dev-runtime"

    [next]/overlay/internal/components/Terminal/Terminal.tsx
      Error resolving EcmaScript Modules request
      unable to resolve module "react"

      Error resolving EcmaScript Modules request
      unable to resolve module "react" with subpath "/jsx-dev-runtime"

    [next]/overlay/internal/components/Toast/Toast.tsx
      Error resolving EcmaScript Modules request
      unable to resolve module "react" with subpath "/jsx-dev-runtime"

    [next]/overlay/internal/container/Errors.tsx
      Error resolving EcmaScript Modules request
      unable to resolve module "react"

      Error resolving EcmaScript Modules request
      unable to resolve module "react" with subpath "/jsx-dev-runtime"

    [next]/overlay/internal/container/ErrorsToast.tsx
      Error resolving EcmaScript Modules request
      unable to resolve module "react" with subpath "/jsx-dev-runtime"

    [next]/overlay/internal/container/RuntimeError.tsx
      Error resolving EcmaScript Modules request
      unable to resolve module "react"

      Error resolving EcmaScript Modules request
      unable to resolve module "react" with subpath "/jsx-dev-runtime"

      Error resolving EcmaScript Modules request
      unable to resolve uri "node:" "process"

    [next]/overlay/internal/container/TurbopackIssue.tsx
      Error resolving EcmaScript Modules request
      unable to resolve module "react" with subpath "/jsx-dev-runtime"

    [next]/overlay/internal/helpers/parseStack.ts
      Error resolving EcmaScript Modules request
      unable to resolve uri "node:" "process"

    [next]/overlay/internal/helpers/stack-frame.ts
      Error resolving EcmaScript Modules request
      unable to resolve uri "node:" "process"

    [next]/overlay/internal/hooks/context.tsx
      Error resolving EcmaScript Modules request
      unable to resolve module "react"

      Error resolving EcmaScript Modules request
      unable to resolve module "react" with subpath "/jsx-dev-runtime"

    [next]/overlay/internal/hooks/use-on-click-outside.ts
      Error resolving EcmaScript Modules request
      unable to resolve module "react"

    [next]/overlay/internal/hooks/usePagination.ts
      Error resolving EcmaScript Modules request
      unable to resolve module "react"

    [next]/overlay/internal/icons/AlertOctagon.tsx
      Error resolving EcmaScript Modules request
      unable to resolve module "react" with subpath "/jsx-dev-runtime"

    [next]/overlay/internal/icons/AlertTriangle.tsx
      Error resolving EcmaScript Modules request
      unable to resolve module "react" with subpath "/jsx-dev-runtime"

    [next]/overlay/internal/icons/BaseIcon.tsx
      Error resolving EcmaScript Modules request
      unable to resolve module "react" with subpath "/jsx-dev-runtime"

    [next]/overlay/internal/icons/CloseIcon.tsx
      Error resolving EcmaScript Modules request
      unable to resolve module "react" with subpath "/jsx-dev-runtime"

    [next]/overlay/internal/icons/ExternalLink.tsx
      Error resolving EcmaScript Modules request
      unable to resolve module "react" with subpath "/jsx-dev-runtime"

    [next]/overlay/internal/icons/PackageX.tsx
      Error resolving EcmaScript Modules request
      unable to resolve module "react" with subpath "/jsx-dev-runtime"

    [next]/overlay/internal/styles/Base.tsx
      Error resolving EcmaScript Modules request
      unable to resolve module "react" with subpath "/jsx-dev-runtime"

    [next]/overlay/internal/styles/ComponentStyles.tsx
      Error resolving EcmaScript Modules request
      unable to resolve module "react" with subpath "/jsx-dev-runtime"

    [next]/overlay/internal/styles/CssReset.tsx
      Error resolving EcmaScript Modules request
      unable to resolve module "react" with subpath "/jsx-dev-runtime"

  [typescript]
    tsconfig.json
      An issue occurred while parsing a tsconfig.json file.
      extends doesn't resolve correctly

warning - [other] 
  Could not resolve React Refresh runtime
  React Refresh will be disabled.
  To enable React Refresh, install the `react-refresh` and `@next/react-refresh-utils` modules.

[500] / (877ms)
error - [resolve]
  .env.js
    Error resolving EcmaScript Modules request
    unable to resolve uri "node:" "process"

  [next]/entry/next-hydrate.tsx
    Error resolving EcmaScript Modules request
    unable to resolve module "next" with subpath "/dist/client"

    Error resolving EcmaScript Modules request
    unable to resolve module "next" with subpath "/dist/shared/lib/router/utils/format-url"

    Error resolving EcmaScript Modules request
    unable to resolve module "next" with subpath "/dist/shared/lib/router/utils/querystring"

  apiRoutes/index.ts
    Error resolving EcmaScript Modules request
    unable to resolve module "@ecominate/utils"

    Error resolving EcmaScript Modules request
    unable to resolve module "axios"

    Error resolving EcmaScript Modules request
    unable to resolve uri "node:" "process"

  src/components/appLayout/index.tsx
    Error resolving EcmaScript Modules request
    unable to resolve module "@ecominate/shared-ui"

    Error resolving EcmaScript Modules request
    unable to resolve module "@ecominate/ui-common" with subpath "/src/components/loading-screen"

    Error resolving EcmaScript Modules request
    unable to resolve module "@ecominate/ui-common" with subpath "/src/layouts/dashboard/DashboardLayout"

    Error resolving EcmaScript Modules request
    unable to resolve module "@ecominate/ui-common" with subpath "/src/pages/_app"

    Error resolving EcmaScript Modules request
    unable to resolve module "next" with subpath "/router"

    Error resolving EcmaScript Modules request
    unable to resolve module "react"

    Error resolving EcmaScript Modules request
    unable to resolve module "react" with subpath "/jsx-dev-runtime"

    Error resolving EcmaScript Modules request
    unable to resolve module "react-redux"

  src/components/header/index.tsx
    Error resolving EcmaScript Modules request
    unable to resolve module "@ecominate/shared-ui"

    Error resolving EcmaScript Modules request
    unable to resolve module "react"

    Error resolving EcmaScript Modules request
    unable to resolve module "react" with subpath "/jsx-dev-runtime"

    Error resolving EcmaScript Modules request
    unable to resolve module "react-redux"

  src/components/sisu/EmailVerificationModal.tsx
    Error resolving EcmaScript Modules request
    unable to resolve module "@ecominate/shared-ui"

    Error resolving EcmaScript Modules request
    unable to resolve module "@mui/material"

    Error resolving EcmaScript Modules request
    unable to resolve module "react"

    Error resolving EcmaScript Modules request
    unable to resolve module "react" with subpath "/jsx-dev-runtime"

    Error resolving EcmaScript Modules request
    unable to resolve module "react-redux"

  src/pages/_app.tsx
    Error resolving EcmaScript Modules request
    unable to resolve module "react" with subpath "/jsx-dev-runtime"

    Error resolving EcmaScript Modules request
    unable to resolve module "react-redux"

    Error resolving EcmaScript Modules request
    unable to resolve module "redux-persist" with subpath "/integration/react"

  src/pages/_document.tsx
    Error resolving EcmaScript Modules request
    unable to resolve module "@ecominate/ui-common" with subpath "/src/pages/_document"

  src/pages/email-verification/index.tsx
    Error resolving EcmaScript Modules request
    unable to resolve module "@ecominate/shared-ui"

    Error resolving EcmaScript Modules request
    unable to resolve module "@ecominate/ui-common" with subpath "/src/pages/_app"

    Error resolving EcmaScript Modules request
    unable to resolve module "next" with subpath "/head"

    Error resolving EcmaScript Modules request
    unable to resolve module "react"

    Error resolving EcmaScript Modules request
    unable to resolve module "react" with subpath "/jsx-dev-runtime"

    Error resolving EcmaScript Modules request
    unable to resolve module "react-redux"

  src/pages/index.tsx
    Error resolving EcmaScript Modules request
    unable to resolve module "@ecominate/ui-common" with subpath "/src/pages/_app"

    Error resolving EcmaScript Modules request
    unable to resolve module "next" with subpath "/head"

    Error resolving EcmaScript Modules request
    unable to resolve module "next" with subpath "/router"

    Error resolving EcmaScript Modules request
    unable to resolve module "react"

    Error resolving EcmaScript Modules request
    unable to resolve module "react" with subpath "/jsx-dev-runtime"

    Error resolving EcmaScript Modules request
    unable to resolve module "react-redux"

  src/pages/maintenance/index.tsx
    Error resolving EcmaScript Modules request
    unable to resolve module "@ecominate/ui-common" with subpath "/src/pages/_app"

    Error resolving EcmaScript Modules request
    unable to resolve module "@ecominate/ui-common" with subpath "/src/pages/maintenance"

    Error resolving EcmaScript Modules request
    unable to resolve module "next" with subpath "/head"

    Error resolving EcmaScript Modules request
    unable to resolve module "react"

    Error resolving EcmaScript Modules request
    unable to resolve module "react" with subpath "/jsx-dev-runtime"

  src/redux/actions/globalActions.ts
    Error resolving EcmaScript Modules request
    unable to resolve module "lodash"

    Error resolving EcmaScript Modules request
    unable to resolve module "moment-timezone"

  src/redux/reducers/index.ts
    Error resolving EcmaScript Modules request
    unable to resolve module "redux"

  src/redux/selectors/routesSelectors.tsx
    Error resolving EcmaScript Modules request
    unable to resolve module "@ecominate/ui-common" with subpath "/src/utils/routing"

    Error resolving EcmaScript Modules request
    unable to resolve module "@mui/icons-material"

    Error resolving EcmaScript Modules request
    unable to resolve module "@reduxjs/toolkit"

    Error resolving EcmaScript Modules request
    unable to resolve module "react" with subpath "/jsx-dev-runtime"

  src/redux/store.ts
    Error resolving EcmaScript Modules request
    unable to resolve module "@reduxjs/toolkit"

    Error resolving EcmaScript Modules request
    unable to resolve module "next-redux-wrapper"

    Error resolving EcmaScript Modules request
    unable to resolve module "redux-persist"

    Error resolving EcmaScript Modules request
    unable to resolve module "redux-persist" with subpath "/lib/storage"

    Error resolving EcmaScript Modules request
    unable to resolve module "redux-thunk"

    Error resolving EcmaScript Modules request
    unable to resolve uri "node:" "process"

  src/theme/overrides.ts
    Error resolving EcmaScript Modules request
    unable to resolve module "@ecominate/ui-common" with subpath "/src/theme/palette"

event - 13 requests (e. g. GET /) 877ms

It seems to not be able to resolve any modules

tsconfig below:

{
  "compilerOptions": {
    "incremental": true,
    "isolatedModules": true,
    "jsx": "preserve",
    "paths": {
      // Required because ui-common contains multiple entry points
      "@ecominate/ui-common/*": ["../ui-common/src/*"],
      // Use the MUI from ui-common
      "@mui/*": ["../ui-common/node_modules/@mui/*"]
    }
  },
  "extends": "../../../tsconfig.react.json",
  "include": ["next-env.d.ts", "**/*.ts", "**/*.tsx"]
}

Expected Behavior

No errors :)

To Reproduce

Start server. I can help with private repo access privately if someone is able to help.

Reproduction Repo

No response

WEB-1043

@jakeleventhal jakeleventhal added area: turbopack kind: bug Something isn't working needs: triage New issues get this label. Remove it after triage labels May 1, 2023
@padmaia
Copy link
Member

padmaia commented May 2, 2023

Are you using pnpm workspaces? We still need to document this, but you can add --root ../path/to/root_of_monorepo which may resolve your issue.

@jakeleventhal
Copy link
Contributor Author

jakeleventhal commented May 4, 2023

I updated to the latest version of turbo pack. The problem is now relegated to only errors with @ecominate/ui-common and @mui packages (related to the tsconfig paths field).
Screenshot 2023-05-04 at 12 37 42 PM

@jridgewell
Copy link
Contributor

Can you give us the result of running ls -la node_modules/@mui (and node_modules/@ecominate) in your project?

@jakeleventhal
Copy link
Contributor Author

▶ ls -la node_modules/@mui
total 0
drwxr-xr-x   5 jakeleventhal  staff  160 May 10 23:55 .
drwxr-xr-x  26 jakeleventhal  staff  832 May 10 23:59 ..
lrwxr-xr-x   1 jakeleventhal  staff  148 May 10 23:55 icons-material -> ../../../../../node_modules/.pnpm/@mui+icons-material@5.11.16_@mui+material@5.12.2_@types+react@18.2.0_react@18.2.0/node_modules/@mui/icons-material
lrwxr-xr-x   1 jakeleventhal  staff  176 May 10 23:55 lab -> ../../../../../node_modules/.pnpm/@mui+lab@5.0.0-alpha.47_@emotion+react@11.10.8_@emotion+styled@11.10.8_@mui+material@5.12.2_@_ulybayhpjroiq4w6bboidbvbya/node_modules/@mui/lab
lrwxr-xr-x   1 jakeleventhal  staff  178 May 10 23:55 material -> ../../../../../node_modules/.pnpm/@mui+material@5.12.2_@emotion+react@11.10.8_@emotion+styled@11.10.8_@types+react@18.2.0_react-dom@18.2.0_react@18.2.0/node_modules/@mui/material
▶ ls -la node_modules/@ecominate
total 0
drwxr-xr-x   7 jakeleventhal  staff  224 May 10 23:55 .
drwxr-xr-x  26 jakeleventhal  staff  832 May 10 23:59 ..
lrwxr-xr-x   1 jakeleventhal  staff   39 May 10 23:55 emailer -> ../../../../../packages/ecominate/emailer
lrwxr-xr-x   1 jakeleventhal  staff   42 May 10 23:55 minimal-ui -> ../../../../../packages/ecominate/minimal-ui
lrwxr-xr-x   1 jakeleventhal  staff   41 May 10 23:55 shared-ui -> ../../../../../packages/ecominate/shared-ui
lrwxr-xr-x   1 jakeleventhal  staff   29 May 10 23:55 tsconfig -> ../../../../../tools/tsconfig
lrwxr-xr-x   1 jakeleventhal  staff   37 May 10 23:55 utils -> ../../../../../packages/ecominate/utils

@padmaia
Copy link
Member

padmaia commented Nov 21, 2023

@jakeleventhal are you still experiencing this issue?

@jakeleventhal
Copy link
Contributor Author

jakeleventhal commented Nov 21, 2023

yes next@14.0.2

  ⚠ _app error - [project]/apps/artelo/client/src/pages/_app.tsx - Error resolving EcmaScript Modules request
unable to resolve module "@mui/x-date-pickers-pro" with subpath "/AdapterMoment"

 error - apps/artelo/client/src/pages/_app.tsx:4:0  Error resolving EcmaScript Modules request

  2 |
  3 | import { LocalizationProvider } from '@mui/x-date-pickers-pro';
> 4 | import { AdapterMoment } from '@mui/x-date-pickers-pro/AdapterMoment';
    | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^
  5 | import { AppProps } from 'next/app';
  6 | import React, { FC } from 'react';
  7 | import { Provider } from 'react-redux';
unable to resolve module "@mui/x-date-pickers-pro" with subpath "/AdapterMoment"
It was not possible to find the requested file.
    Parsed request as written in source code: module "@mui/x-date-pickers-pro" with subpath "/AdapterMoment"
    Path where resolving has started: [project]/apps/artelo/client/src/pages/_app.tsx
    Type of request: EcmaScript Modules request
    Import map: aliased to relative "../minimal-ui/node_modules/@mui/x-date-pickers-pro/AdapterMoment" inside of [project]/apps/artelo/client

notably, tsconfig:

{
  "compilerOptions": {
    "incremental": true,
    "isolatedModules": true,
    "noEmit": true,
    "paths": {
      // Required because minimal-ui contains multiple entry points
      "@riptech/minimal-ui/*": ["../minimal-ui/src/*"],
      // Use the MUI from minimal-ui
      "@mui/*": ["../minimal-ui/node_modules/@mui/*"]
    }
  },
  "exclude": ["dist", "node_modules"],
  "extends": "@riptech/tsconfig/tsconfig.react.json",
  "include": ["next-env.d.ts", "**/*.ts", "**/*.tsx"]
}

the tsconfig being extended is:

{
  "compilerOptions": {
    "allowJs": false,
    "declaration": false,
    "esModuleInterop": true,
    "forceConsistentCasingInFileNames": true,
    "jsx": "preserve",
    "lib": ["dom", "ESNext"],
    "module": "CommonJS",
    "moduleResolution": "node",
    "noEmitOnError": true,
    "outDir": "./dist",
    "inlineSources": true,
    "resolveJsonModule": true,
    "sourceRoot": "/",
    "skipLibCheck": true,
    "sourceMap": true,
    "strict": true,
    "target": "ES6"
  },
  "files": ["./declarations.d.ts"],
  "extends": "./tsconfig.json",
  "exclude": ["dist", "node_modules"]
}

@ForsakenHarmony
Copy link
Member

@jakeleventhal could you create a minimal repro in a public github repo or a codesandbox according to the bug template in the next.js repo?

https://github.com/vercel/next.js/issues/new?assignees=&labels=template%3A+bug&projects=&template=1.bug_report.yml

@collinversluis
Copy link

I am having the same issue with turbopack not resolving modules

@jakeleventhal
Copy link
Contributor Author

@ForsakenHarmony its going to require several hours of my time that I don't have to reproduce this (and potentially fail to do so).

If you are willing, I can invite you to my team's repository to use that as a reproduction.

@i-am-the-slime
Copy link

In my case the problem was the following:

I had:

 "paths": {
      "@*": [
        "./output/*"
      ]
    }

In my tsconfig.json

Of course this overlaps with imports from node_modules that start with an @ sign.
This is no problem in webpack where apparently it first tries to locate the local file and falls back to node_modules otherwise.

I changed the import alias to @/ and now it's ugly everywhere but at least turbopack stops working in a different place now.

@kapsule-studio
Copy link

I changed the import alias to @/ and now it's ugly everywhere but at least turbopack stops working in a different place now.

I deeply second you on the "ugly everywhere" bit. I was very fond of using @*... I hope it gets sorted out in the future.
Anyway, thanks for your feedback, it was the solution for me.

@timneutkens
Copy link
Member

Going to close this issue as there is no full reproduction included that allows us to investigate further. Feel free to open a new issue if you're still running into problems please open a new issue so that we can investigate it. Thanks!

@vercel vercel locked and limited conversation to collaborators May 20, 2024
Sign up for free to subscribe to this conversation on GitHub. Already have an account? Sign in.
Labels
kind: bug Something isn't working linear: turbopack needs: triage New issues get this label. Remove it after triage owned-by: turbopack
Projects
None yet
Development

No branches or pull requests

10 participants