Global CSS cannot be imported from within node_modules.

[pldrouin]

Hi, I get the following error with 2.35.2 when I try building with npm run build. It seems to be related to #7139 and #7145. What do I need to change to fix this error?

Thanks!

▲ Next.js 14.2.11

✓ Linting and checking validity of types
Creating an optimized production build ... (node:8736) [DEP_WEBPACK_MODULE_ISSUER] DeprecationWarning: Module.issuer: Use new ModuleGraph API (Use node --trace-deprecation ... to show where the warning was created) Failed to compile.

./node_modules/maplibre-gl/dist/maplibre-gl.css Global CSS cannot be imported from within node_modules. Read more: https://nextjs.org/docs/messages/css-npm Location: node_modules/plotly.js/src/registry.js

Import trace for requested module: ./node_modules/maplibre-gl/dist/maplibre-gl.css ./node_modules/plotly.js/src/registry.js ./node_modules/plotly.js/src/core.js ./node_modules/plotly.js/lib/core.js ./src/plotly-custom.js ./components/PlotlyChartDynamicLoad.js ./components/PlotlyChart.js

./node_modules/maplibre-gl/dist/maplibre-gl.css

[archmoj]

Which version of node and npm you are on?

[pldrouin]

npm: 10.8.2 node: v20.17.0

Thanks!

[mkue]

I'm running into the same issue when trying to build a Next.js application:

I have the following dependencies installed (node: v20.18.0, npm: 10.8.2, pnpm: 8.15.9) :

    "next": "14.2.10",
    "plotly.js": "^2.35.2",
    "plotly.js-strict-dist-min": "^2.35.2",

(node:75162) [DEP_WEBPACK_MODULE_ISSUER] DeprecationWarning: Module.issuer: Use new ModuleGraph API
(Use `node --trace-deprecation ...` to show where the warning was created)
Failed to compile.

../../node_modules/.pnpm/[email protected]/node_modules/maplibre-gl/dist/maplibre-gl.css
Global CSS cannot be imported from within node_modules.
Read more: https://nextjs.org/docs/messages/css-npm
Location: ../../node_modules/.pnpm/[email protected][email protected][email protected]/node_modules/plotly.js/src/registry.js

Import trace for requested module:
../../node_modules/.pnpm/[email protected]/node_modules/maplibre-gl/dist/maplibre-gl.css
../../node_modules/.pnpm/[email protected][email protected][email protected]/node_modules/plotly.js/src/registry.js
../../node_modules/.pnpm/[email protected][email protected][email protected]/node_modules/plotly.js/src/core.js
../../node_modules/.pnpm/[email protected][email protected][email protected]/node_modules/plotly.js/lib/core.js
../../node_modules/.pnpm/[email protected][email protected][email protected]/node_modules/plotly.js/lib/index.js
./src/components/lib/plotly/download.ts
./src/components/lib/plotly/PlotlyBlock.tsx

../../node_modules/.pnpm/[email protected]/node_modules/maplibre-gl/dist/maplibre-gl.css
Module build failed: Error: Final loader (../../node_modules/.pnpm/[email protected]_@[email protected]_@[email protected][email protected][email protected]/node_modules/next/dist/build/webpack/loaders/error-loader.js) didn't return a Buffer or String
    at processResult (/Users/mkue/example/node_modules/.pnpm/[email protected]_@[email protected]_@[email protected][email protected][email protected]/node_modules/next/dist/compiled/webpack/bundle5.js:28:400836)
    at /Users/mkue/example/node_modules/.pnpm/[email protected]_@[email protected]_@[email protected][email protected][email protected]/node_modules/next/dist/compiled/webpack/bundle5.js:28:402302
    at /Users/mkue/example/node_modules/.pnpm/[email protected]_@[email protected]_@[email protected][email protected][email protected]/node_modules/next/dist/compiled/loader-runner/LoaderRunner.js:1:8727
    at iterateNormalLoaders (/Users/mkue/example/node_modules/.pnpm/[email protected]_@[email protected]_@[email protected][email protected][email protected]/node_modules/next/dist/compiled/loader-runner/LoaderRunner.js:1:5565)
    at iterateNormalLoaders (/Users/mkue/example/node_modules/.pnpm/[email protected]_@[email protected]_@[email protected][email protected][email protected]/node_modules/next/dist/compiled/loader-runner/LoaderRunner.js:1:5650)
    at /Users/mkue/example/node_modules/.pnpm/[email protected]_@[email protected]_@[email protected][email protected][email protected]/node_modules/next/dist/compiled/loader-runner/LoaderRunner.js:1:5879
    at runSyncOrAsync (/Users/mkue/example/node_modules/.pnpm/[email protected]_@[email protected]_@[email protected][email protected][email protected]/node_modules/next/dist/compiled/loader-runner/LoaderRunner.js:1:4185)
    at iterateNormalLoaders (/Users/mkue/example/node_modules/.pnpm/[email protected]_@[email protected]_@[email protected][email protected][email protected]/node_modules/next/dist/compiled/loader-runner/LoaderRunner.js:1:5782)
    at /Users/mkue/example/node_modules/.pnpm/[email protected]_@[email protected]_@[email protected][email protected][email protected]/node_modules/next/dist/compiled/loader-runner/LoaderRunner.js:1:5142
    at runSyncOrAsync (/Users/mkue/example/node_modules/.pnpm/[email protected]_@[email protected]_@[email protected][email protected][email protected]/node_modules/next/dist/compiled/loader-runner/LoaderRunner.js:1:4293)
    at /Users/mkue/example/node_modules/.pnpm/[email protected]_@[email protected]_@[email protected][email protected][email protected]/node_modules/next/dist/compiled/loader-runner/LoaderRunner.js:1:4926
    at handleResult (/Users/mkue/example/node_modules/.pnpm/[email protected]_@[email protected]_@[email protected][email protected][email protected]/node_modules/next/dist/compiled/loader-runner/LoaderRunner.js:1:1424)
    at loadLoader (/Users/mkue/example/node_modules/.pnpm/[email protected]_@[email protected]_@[email protected][email protected][email protected]/node_modules/next/dist/compiled/loader-runner/LoaderRunner.js:1:963)
    at iteratePitchingLoaders (/Users/mkue/example/node_modules/.pnpm/[email protected]_@[email protected]_@[email protected][email protected][email protected]/node_modules/next/dist/compiled/loader-runner/LoaderRunner.js:1:4794)
    at iteratePitchingLoaders (/Users/mkue/example/node_modules/.pnpm/[email protected]_@[email protected]_@[email protected][email protected][email protected]/node_modules/next/dist/compiled/loader-runner/LoaderRunner.js:1:4764)
    at /Users/mkue/example/node_modules/.pnpm/[email protected]_@[email protected]_@[email protected][email protected][email protected]/node_modules/next/dist/compiled/loader-runner/LoaderRunner.js:1:4896
    at handleResult (/Users/mkue/example/node_modules/.pnpm/[email protected]_@[email protected]_@[email protected][email protected][email protected]/node_modules/next/dist/compiled/loader-runner/LoaderRunner.js:1:1424)
    at loadLoader (/Users/mkue/example/node_modules/.pnpm/[email protected]_@[email protected]_@[email protected][email protected][email protected]/node_modules/next/dist/compiled/loader-runner/LoaderRunner.js:1:963)
    at iteratePitchingLoaders (/Users/mkue/example/node_modules/.pnpm/[email protected]_@[email protected]_@[email protected][email protected][email protected]/node_modules/next/dist/compiled/loader-runner/LoaderRunner.js:1:4794)
    at runLoaders (/Users/mkue/example/node_modules/.pnpm/[email protected]_@[email protected]_@[email protected][email protected][email protected]/node_modules/next/dist/compiled/loader-runner/LoaderRunner.js:1:8590)
    at NormalModule._doBuild (/Users/mkue/example/node_modules/.pnpm/[email protected]_@[email protected]_@[email protected][email protected][email protected]/node_modules/next/dist/compiled/webpack/bundle5.js:28:401544)
    at NormalModule.build (/Users/mkue/example/node_modules/.pnpm/[email protected]_@[email protected]_@[email protected][email protected][email protected]/node_modules/next/dist/compiled/webpack/bundle5.js:28:403572)
    at /Users/mkue/example/node_modules/.pnpm/[email protected]_@[email protected]_@[email protected][email protected][email protected]/node_modules/next/dist/compiled/webpack/bundle5.js:28:82055
    at NormalModule.needBuild (/Users/mkue/example/node_modules/.pnpm/[email protected]_@[email protected]_@[email protected][email protected][email protected]/node_modules/next/dist/compiled/webpack/bundle5.js:28:407670)
    at Compilation._buildModule (/Users/mkue/example/node_modules/.pnpm/[email protected]_@[email protected]_@[email protected][email protected][email protected]/node_modules/next/dist/compiled/webpack/bundle5.js:28:81772)
    at /Users/mkue/example/node_modules/.pnpm/[email protected]_@[email protected]_@[email protected][email protected][email protected]/node_modules/next/dist/compiled/webpack/bundle5.js:28:1332896
    at Hook.eval [as callAsync] (eval at create (/Users/mkue/example/node_modules/.pnpm/[email protected]_@[email protected]_@[email protected][email protected][email protected]/node_modules/next/dist/compiled/webpack/bundle5.js:13:28858), <anonymous>:6:1)
    at AsyncQueue._startProcessing (/Users/mkue/example/node_modules/.pnpm/[email protected]_@[email protected]_@[email protected][email protected][email protected]/node_modules/next/dist/compiled/webpack/bundle5.js:28:1332767)
    at AsyncQueue._ensureProcessing (/Users/mkue/example/node_modules/.pnpm/[email protected]_@[email protected]_@[email protected][email protected][email protected]/node_modules/next/dist/compiled/webpack/bundle5.js:28:1332616)
    at process.processImmediate (node:internal/timers:483:21)

Import trace for requested module:
../../node_modules/.pnpm/[email protected]/node_modules/maplibre-gl/dist/maplibre-gl.css
../../node_modules/.pnpm/[email protected][email protected][email protected]/node_modules/plotly.js/src/registry.js
../../node_modules/.pnpm/[email protected][email protected][email protected]/node_modules/plotly.js/src/core.js
../../node_modules/.pnpm/[email protected][email protected][email protected]/node_modules/plotly.js/lib/core.js
../../node_modules/.pnpm/[email protected][email protected][email protected]/node_modules/plotly.js/lib/index.js
./src/components/lib/plotly/download.ts
./src/components/lib/plotly/PlotlyBlock.tsx

Any ideas how this can be resolved?