medusajs / medusa

Building blocks for digital commerce
https://medusajs.com
MIT License
24.08k stars 2.33k forks source link

Module not found: Can't resolve 'child_process' #4279

Closed la-ruee-vers-le-bois closed 4 weeks ago

la-ruee-vers-le-bois commented 1 year ago

Bug report

Describe the bug

Hi :)

I had install the following packages:

npm install medusa-react @tanstack/react-query @medusajs/medusa

Configure the provider and use a method to get products:

'use client';

import LoadSpinner from '@/components/ui/LoadSpinner/LoadSpinner';
import { redirect, useRouter } from 'next/navigation';
import routes from '@/config/routes';
import SideBar from '@/components/ui/SideBar/SideBar';
import { MedusaProvider } from 'medusa-react';
import { QueryClient } from '@tanstack/react-query';
import React from 'react';
import { Product } from '@medusajs/medusa';
import { useProducts } from 'medusa-react';

import Auth from '../components/Auth';
import {
  useAuth,
  VIEWS,
} from '../components/AuthProvider/AuthProvider';

export const revalidate = 0;

export default function Home() {
  const queryClient = new QueryClient();
  const { products, isLoading } = useProducts();

  const router = useRouter();
  const { initial, user, view, organization } = useAuth();

  [...]

  if (user) {
    if (user.user_metadata.isDoneOnboarding) {
      return (
        <main className='main'>
          <SideBar />
          <section className='section'>
            <h2>Bonjour {user.email}</h2>
            <code className='highlight'>{user.role}</code>
            {isLoading ? (
              <div>Loading...</div>
            ) : (
              <ul>
                {products?.map((product) => (
                  <li key={product.id}>{product.title}</li>
                ))}
              </ul>
            )}
          </section>
        </main>
      );
    } else {
      redirect(routes.ONBOARDING);
    }
  }

  [...]
}

But use medusa-react with a nextjs project return the following error:

<w> [webpack.cache.PackFileCacheStrategy] Caching failed for pack: Error: ENOENT: no such file or directory, rename '/home/benjam/projects/lrvlb/portal/.next/cache/webpack/client-development-fallback/0.pack_' -> '/home/benjam/projects/lrvlb/portal/.next/cache/webpack/client-development-fallback/0.pack'
<w> [webpack.cache.PackFileCacheStrategy] Caching failed for pack: Error: ENOENT: no such file or directory, rename '/home/benjam/projects/lrvlb/portal/.next/cache/webpack/client-development-fallback/0.pack_' -> '/home/benjam/projects/lrvlb/portal/.next/cache/webpack/client-development-fallback/0.pack'
- error ./node_modules/@medusajs/medusa-cli/dist/commands/new.js:10:0
Module not found: Can't resolve 'child_process'

https://nextjs.org/docs/messages/module-not-found

Import trace for requested module:
./node_modules/@medusajs/medusa-cli/dist/create-cli.js
./node_modules/@medusajs/medusa-cli/dist/index.js
./node_modules/medusa-telemetry/dist/telemeter.js
./node_modules/medusa-telemetry/dist/index.js
./node_modules/@medusajs/medusa/dist/loaders/feature-flags/index.js
./node_modules/@medusajs/medusa/dist/utils/feature-flag-decorators.js
./node_modules/@medusajs/medusa/dist/models/analytics-config.js
./node_modules/@medusajs/medusa/dist/models/index.js
./node_modules/@medusajs/medusa/dist/index.js
./app/page.js
- wait compiling /favicon.ico/route (client and server)...
- error cloudflare:sockets
Module build failed: UnhandledSchemeError: Reading from "cloudflare:sockets" is not handled by plugins (Unhandled scheme).
Webpack supports "data:" and "file:" URIs by default.
You may need an additional plugin to handle "cloudflare:" URIs.
Import trace for requested module:
cloudflare:sockets
./node_modules/pg-cloudflare/dist/index.js
./node_modules/pg/lib/stream.js
./node_modules/pg/lib/connection.js
./node_modules/pg/lib/index.js
./node_modules/typeorm/platform/PlatformTools.js
./node_modules/typeorm/globals.js
./node_modules/typeorm/index.js
./node_modules/@medusajs/medusa/dist/interfaces/models/base-entity.js
./node_modules/@medusajs/medusa/dist/interfaces/index.js
./node_modules/@medusajs/medusa/dist/index.js
./app/page.js

System information

Next project:

"dependencies": {
    "@hookform/error-message": "^2.0.1",
    "@hookform/resolvers": "^3.1.0",
    "@internationalized/date": "^3.2.0",
    "@medusajs/medusa": "^1.12.0",
    "@radix-ui/react-accordion": "^1.1.1",
    "@radix-ui/react-alert-dialog": "^1.0.3",
    "@radix-ui/react-aspect-ratio": "^1.0.2",
    "@radix-ui/react-avatar": "^1.0.2",
    "@radix-ui/react-checkbox": "^1.0.3",
    "@radix-ui/react-collapsible": "^1.0.2",
    "@radix-ui/react-context-menu": "^2.1.3",
    "@radix-ui/react-dialog": "^1.0.3",
    "@radix-ui/react-dropdown-menu": "^2.0.4",
    "@radix-ui/react-hover-card": "^1.0.5",
    "@radix-ui/react-label": "^2.0.1",
    "@radix-ui/react-menubar": "^1.0.2",
    "@radix-ui/react-navigation-menu": "^1.1.2",
    "@radix-ui/react-popover": "^1.0.5",
    "@radix-ui/react-progress": "^1.0.2",
    "@radix-ui/react-radio-group": "^1.1.2",
    "@radix-ui/react-scroll-area": "^1.0.3",
    "@radix-ui/react-select": "^1.2.1",
    "@radix-ui/react-separator": "^1.0.2",
    "@radix-ui/react-slider": "^1.1.1",
    "@radix-ui/react-slot": "^1.0.1",
    "@radix-ui/react-switch": "^1.0.2",
    "@radix-ui/react-tabs": "^1.0.3",
    "@radix-ui/react-toast": "^1.1.3",
    "@radix-ui/react-toggle": "^1.0.2",
    "@radix-ui/react-tooltip": "^1.0.5",
    "@stripe/react-stripe-js": "^2.1.0",
    "@stripe/stripe-js": "^1.52.0",
    "@supabase/auth-helpers-nextjs": "^0.5.6",
    "@supabase/supabase-js": "^2.12.0",
    "@tanstack/react-query": "^4.29.12",
    "@tanstack/react-table": "^8.9.1",
    "child_process": "^1.0.2",
    "class-variance-authority": "^0.5.2",
    "classnames": "^2.3.2",
    "clsx": "^1.2.1",
    "cmdk": "^0.2.0",
    "date-fns": "^2.30.0",
    "encoding": "^0.1.13",
    "formik": "^2.2.9",
    "lucide-react": "^0.130.1",
    "medusa-react": "^9.0.0",
    "micro-cors": "^0.1.1",
    "net": "^1.0.2",
    "next": "^13.4.3",
    "raw-body": "^2.5.2",
    "react": "^18.2.0",
    "react-aria-components": "^1.0.0-alpha.3",
    "react-day-picker": "^8.7.1",
    "react-dom": "^18.2.0",
    "react-hook-form": "^7.43.9",
    "react-phone-number-input": "^3.2.21",
    "react-spinners": "^0.13.8",
    "server-only": "^0.0.1",
    "stripe": "^11.18.0",
    "tailwind-merge": "^1.12.0",
    "tailwindcss-animate": "^1.0.5",
    "validator": "^13.9.0",
    "yup": "^1.0.2",
    "zod": "^3.21.4"
  },
  "devDependencies": {
    "@swc-jotai/react-refresh": "^0.0.7",
    "@tailwindcss/forms": "^0.5.3",
    "@types/react": "18.0.33",
    "autoprefixer": "^10.4.14",
    "eslint": "^8.36.0",
    "eslint-config-next": "^13.4.3",
    "eslint-plugin-tailwindcss": "^3.10.1",
    "postcss": "^8.4.21",
    "prettier": "^2.8.5",
    "prettier-plugin-tailwindcss": "^0.2.5",
    "tailwindcss": "^3.2.7"
  },

Medusa version (including plugins):

"dependencies": {
    "@medusajs/cache-inmemory": "^1.8.7",
    "@medusajs/cache-redis": "^1.8.7",
    "@medusajs/event-bus-local": "^1.9.4",
    "@medusajs/event-bus-redis": "^1.8.7",
    "@medusajs/file-local": "^1.0.1",
    "@medusajs/medusa": "^1.12.0",
    "body-parser": "^1.19.0",
    "cors": "^2.8.5",
    "express": "^4.17.2",
    "medusa-fulfillment-manual": "^1.1.37",
    "medusa-interfaces": "^1.3.7",
    "medusa-payment-manual": "^1.0.23",
    "medusa-payment-stripe": "^6.0.0",
    "typeorm": "^0.3.16"
  },

Node.js version:

v19.9.0

Code snippets

BenjaminCloudIam commented 1 year ago

Hi,

Any idea ?

Thx :)

adrien2p commented 1 year ago

can you add medusa as part of the externals in your nextjs webpack config. I suspect that it comes from webpack

BenjaminCloudIam commented 1 year ago

Hi and thx for your response.

Can you provide an example please ?

adrien2p commented 1 year ago

could you try to add the following in yout next.config.js just to see what you get

experimental: {
    serverComponentsExternalPackages: [
      "@medusajs/medusa",
    ],
  },
la-ruee-vers-le-bois commented 1 year ago

Hi @adrien2p ,

It's the same:

# next.config.js

/** @type {import('next').NextConfig} */
const nextConfig = {
  experimental: {
    serverComponentsExternalPackages: ['@medusajs/medusa'],
    serverActions: true,
    // logging: 'verbose',
  },
  images: {
    remotePatterns: [...],
  },
};

module.exports = nextConfig;

When I start my project:

> Found a change in next.config.js. Restarting the server to apply the changes...
- ready started server on 0.0.0.0:3000, url: http://localhost:3000
- info Loaded env from /home/benjam/projects/lrvlb/portal/.env
- warn You have enabled experimental features (serverComponentsExternalPackages, serverActions) in next.config.js.
- warn Experimental features are not covered by semver, and may cause unexpected or broken application behavior. Use at your own risk.

- event compiled client and server successfully in 681 ms (306 modules)
- warn `export const config` in /home/benjam/projects/lrvlb/portal/app/middleware.js is deprecated. Please change `runtime` property to segment export config. See https://nextjs.org/docs/app/api-reference/file-conventions/route-segment-config
- wait compiling...
- event compiled client and server successfully in 188 ms (306 modules)
- wait compiling /_error (client and server)...
- event compiled client and server successfully in 505 ms (307 modules)
- warn Fast Refresh had to perform a full reload due to a runtime error.
- wait compiling /page (client and server)...
- error ./node_modules/@medusajs/medusa-cli/dist/commands/new.js:10:0
Module not found: Can't resolve 'child_process'

https://nextjs.org/docs/messages/module-not-found

Import trace for requested module:
./node_modules/@medusajs/medusa-cli/dist/create-cli.js
./node_modules/@medusajs/medusa-cli/dist/index.js
./node_modules/medusa-telemetry/dist/telemeter.js
./node_modules/medusa-telemetry/dist/index.js
./node_modules/@medusajs/medusa/dist/loaders/feature-flags/index.js
./node_modules/@medusajs/medusa/dist/utils/feature-flag-decorators.js
./node_modules/@medusajs/medusa/dist/models/analytics-config.js
./node_modules/@medusajs/medusa/dist/models/index.js
./node_modules/@medusajs/medusa/dist/index.js
./app/page.js
- wait compiling...
- error ./node_modules/@medusajs/medusa-cli/dist/commands/new.js:10:0
Module not found: Can't resolve 'child_process'

https://nextjs.org/docs/messages/module-not-found

Import trace for requested module:
./node_modules/@medusajs/medusa-cli/dist/create-cli.js
./node_modules/@medusajs/medusa-cli/dist/index.js
./node_modules/medusa-telemetry/dist/telemeter.js
./node_modules/medusa-telemetry/dist/index.js
./node_modules/@medusajs/medusa/dist/loaders/feature-flags/index.js
./node_modules/@medusajs/medusa/dist/utils/feature-flag-decorators.js
./node_modules/@medusajs/medusa/dist/models/analytics-config.js
./node_modules/@medusajs/medusa/dist/models/index.js
./node_modules/@medusajs/medusa/dist/index.js
./app/page.js
- warn `export const config` in /home/benjam/projects/lrvlb/portal/app/middleware.js is deprecated. Please change `runtime` property to segment export config. See https://nextjs.org/docs/app/api-reference/file-conventions/route-segment-config
- wait compiling /favicon.ico/route (client and server)...
- error ./node_modules/@medusajs/medusa-cli/dist/commands/new.js:10:0
Module not found: Can't resolve 'child_process'

https://nextjs.org/docs/messages/module-not-found

Import trace for requested module:
./node_modules/@medusajs/medusa-cli/dist/create-cli.js
./node_modules/@medusajs/medusa-cli/dist/index.js
./node_modules/medusa-telemetry/dist/telemeter.js
./node_modules/medusa-telemetry/dist/index.js
./node_modules/@medusajs/medusa/dist/loaders/feature-flags/index.js
./node_modules/@medusajs/medusa/dist/utils/feature-flag-decorators.js
./node_modules/@medusajs/medusa/dist/models/analytics-config.js
./node_modules/@medusajs/medusa/dist/models/index.js
./node_modules/@medusajs/medusa/dist/index.js
./app/page.js
oliwerhelsen commented 1 year ago

No news on this? Running in to the same issue :-(

adrien2p commented 1 year ago

Can you try to use the nextjs config to update directly the webpack config to exclude medusa? you can find that in the next documentation. I suspect that for the client it is still not ignoring the package and therefore, child_process is a server node API which is not available when using webpack for this purpose

oliwerhelsen commented 1 year ago

Ended up with running the project with NextJS new app structure.

hananiradzi commented 9 months ago

i have same issue, is the medusa-react is not compatible for nextjs pages routing?

sradevski commented 4 weeks ago

Hey, thanks for the report! Since v2 brought a lot of architectural and API changes on the backend, we will be closing this ticket since it no longer applies to our new setup, or the issue has already been fixed. If you are still facing issues with v1, please open a new ticket and we will address it as soon as possible. Thanks! 🙏