Global CSS in node_modules

Question

Global CSS in node_modules

haggen opened this issue 3 years ago · comments

Hi, I tried to enable webpack5 with this plugin but ended up getting this error:

[redacted] on webpack5 [$×!] via Node.js v15.4.0 took 8s 
➜ npm run build                

> [redacted]@0.1.1 build
> next build

warn  - React 17.0.1 or newer will be required to leverage all of the upcoming features in Next.js 11. Read more: https://nextjs.org/docs/messages/react-version
info  - Loaded env from [redacted]/.env.local
info  - Using webpack 5. Reason: future.webpack5 option enabled https://nextjs.org/docs/messages/webpack5
info  - Checking validity of types  
(node:2132) [DEP_WEBPACK_MODULE_ISSUER] DeprecationWarning: Module.issuer: Use new ModuleGraph API
(Use `node --trace-deprecation ...` to show where the warning was created)
info  - Creating an optimized production build ...<w> [webpack.cache.PackFileCacheStrategy] Skipped not serializable cache item 'Compilation/modules|[redacted]/node_modules/next/dist/compiled/css-loader/cjs.js??ruleSet[1].rules[2].oneOf[4].use[0]![redacted]/node_modules/next/dist/compiled/postcss-loader/cjs.js??ruleSet[1].rules[2].oneOf[4].use[1]![redacted]/node_modules/next/dist/compiled/resolve-url-loader/index.js??ruleSet[1].rules[2].oneOf[4].use[2]![redacted]/node_modules/less-loader/dist/cjs.js??ruleSet[1].rules[2].oneOf[4].use[3]![redacted]/src/pages/onboarding/style.module.less': No serializer registered for LessError
<w> while serializing webpack/lib/cache/PackFileCacheStrategy.PackContentItems -> webpack/lib/NormalModule -> webpack/lib/ModuleBuildError -> LessError
<w> [webpack.cache.PackFileCacheStrategy] Skipped not serializable cache item 'Compilation/modules|[redacted]/node_modules/next/dist/compiled/css-loader/cjs.js??ruleSet[1].rules[2].oneOf[4].use[0]![redacted]/node_modules/next/dist/compiled/postcss-loader/cjs.js??ruleSet[1].rules[2].oneOf[4].use[1]![redacted]/node_modules/next/dist/compiled/resolve-url-loader/index.js??ruleSet[1].rules[2].oneOf[4].use[2]![redacted]/node_modules/less-loader/dist/cjs.js??ruleSet[1].rules[2].oneOf[4].use[3]![redacted]/src/layouts/standard/style.module.less': No serializer registered for LessError
<w> while serializing webpack/lib/cache/PackFileCacheStrategy.PackContentItems -> webpack/lib/NormalModule -> webpack/lib/ModuleBuildError -> LessError
<w> [webpack.cache.PackFileCacheStrategy] Skipped not serializable cache item 'Compilation/modules|[redacted]/node_modules/next/dist/compiled/css-loader/cjs.js??ruleSet[1].rules[2].oneOf[4].use[0]![redacted]/node_modules/next/dist/compiled/postcss-loader/cjs.js??ruleSet[1].rules[2].oneOf[4].use[1]![redacted]/node_modules/next/dist/compiled/resolve-url-loader/index.js??ruleSet[1].rules[2].oneOf[4].use[2]![redacted]/node_modules/less-loader/dist/cjs.js??ruleSet[1].rules[2].oneOf[4].use[3]![redacted]/src/components/box/style.module.less': No serializer registered for LessError
<w> while serializing webpack/lib/cache/PackFileCacheStrategy.PackContentItems -> webpack/lib/NormalModule -> webpack/lib/ModuleBuildError -> LessError
<w> [webpack.cache.PackFileCacheStrategy] Skipped not serializable cache item 'Compilation/modules|[redacted]/node_modules/next/dist/compiled/css-loader/cjs.js??ruleSet[1].rules[2].oneOf[4].use[0]![redacted]/node_modules/next/dist/compiled/postcss-loader/cjs.js??ruleSet[1].rules[2].oneOf[4].use[1]![redacted]/node_modules/next/dist/compiled/resolve-url-loader/index.js??ruleSet[1].rules[2].oneOf[4].use[2]![redacted]/node_modules/less-loader/dist/cjs.js??ruleSet[1].rules[2].oneOf[4].use[3]![redacted]/src/components/container/style.module.less': No serializer registered for LessError
<w> while serializing webpack/lib/cache/PackFileCacheStrategy.PackContentItems -> webpack/lib/NormalModule -> webpack/lib/ModuleBuildError -> LessError
<w> [webpack.cache.PackFileCacheStrategy] Skipped not serializable cache item 'Compilation/modules|[redacted]/node_modules/next/dist/compiled/css-loader/cjs.js??ruleSet[1].rules[2].oneOf[4].use[0]![redacted]/node_modules/next/dist/compiled/postcss-loader/cjs.js??ruleSet[1].rules[2].oneOf[4].use[1]![redacted]/node_modules/next/dist/compiled/resolve-url-loader/index.js??ruleSet[1].rules[2].oneOf[4].use[2]![redacted]/node_modules/less-loader/dist/cjs.js??ruleSet[1].rules[2].oneOf[4].use[3]![redacted]/src/components/flex/style.module.less': No serializer registered for LessError
<w> while serializing webpack/lib/cache/PackFileCacheStrategy.PackContentItems -> webpack/lib/NormalModule -> webpack/lib/ModuleBuildError -> LessError
<w> [webpack.cache.PackFileCacheStrategy] Skipped not serializable cache item 'Compilation/modules|[redacted]/node_modules/next/dist/compiled/css-loader/cjs.js??ruleSet[1].rules[2].oneOf[4].use[0]![redacted]/node_modules/next/dist/compiled/postcss-loader/cjs.js??ruleSet[1].rules[2].oneOf[4].use[1]![redacted]/node_modules/next/dist/compiled/resolve-url-loader/index.js??ruleSet[1].rules[2].oneOf[4].use[2]![redacted]/node_modules/less-loader/dist/cjs.js??ruleSet[1].rules[2].oneOf[4].use[3]![redacted]/src/pages/sign-up/style.module.less': No serializer registered for LessError
<w> while serializing webpack/lib/cache/PackFileCacheStrategy.PackContentItems -> webpack/lib/NormalModule -> webpack/lib/ModuleBuildError -> LessError
<w> [webpack.cache.PackFileCacheStrategy] Skipped not serializable cache item 'Compilation/modules|[redacted]/node_modules/next/dist/compiled/css-loader/cjs.js??ruleSet[1].rules[2].oneOf[4].use[0]![redacted]/node_modules/next/dist/compiled/postcss-loader/cjs.js??ruleSet[1].rules[2].oneOf[4].use[1]![redacted]/node_modules/next/dist/compiled/resolve-url-loader/index.js??ruleSet[1].rules[2].oneOf[4].use[2]![redacted]/node_modules/less-loader/dist/cjs.js??ruleSet[1].rules[2].oneOf[4].use[3]![redacted]/src/pages/jobs/[id]/style.module.less': No serializer registered for LessError
<w> while serializing webpack/lib/cache/PackFileCacheStrategy.PackContentItems -> webpack/lib/NormalModule -> webpack/lib/ModuleBuildError -> LessError
<w> [webpack.cache.PackFileCacheStrategy] Skipped not serializable cache item 'Compilation/modules|[redacted]/node_modules/next/dist/compiled/css-loader/cjs.js??ruleSet[1].rules[2].oneOf[4].use[0]![redacted]/node_modules/next/dist/compiled/postcss-loader/cjs.js??ruleSet[1].rules[2].oneOf[4].use[1]![redacted]/node_modules/next/dist/compiled/resolve-url-loader/index.js??ruleSet[1].rules[2].oneOf[4].use[2]![redacted]/node_modules/less-loader/dist/cjs.js??ruleSet[1].rules[2].oneOf[4].use[3]![redacted]/src/components/step-box/style.module.less': No serializer registered for LessError
<w> while serializing webpack/lib/cache/PackFileCacheStrategy.PackContentItems -> webpack/lib/NormalModule -> webpack/lib/ModuleBuildError -> LessError
<w> [webpack.cache.PackFileCacheStrategy] Skipped not serializable cache item 'Compilation/modules|[redacted]/node_modules/next/dist/compiled/css-loader/cjs.js??ruleSet[1].rules[2].oneOf[4].use[0]![redacted]/node_modules/next/dist/compiled/postcss-loader/cjs.js??ruleSet[1].rules[2].oneOf[4].use[1]![redacted]/node_modules/next/dist/compiled/resolve-url-loader/index.js??ruleSet[1].rules[2].oneOf[4].use[2]![redacted]/node_modules/less-loader/dist/cjs.js??ruleSet[1].rules[2].oneOf[4].use[3]![redacted]/src/components/brand/style.module.less': No serializer registered for LessError
<w> while serializing webpack/lib/cache/PackFileCacheStrategy.PackContentItems -> webpack/lib/NormalModule -> webpack/lib/ModuleBuildError -> LessError
<w> [webpack.cache.PackFileCacheStrategy] Skipped not serializable cache item 'Compilation/modules|[redacted]/node_modules/next/dist/compiled/css-loader/cjs.js??ruleSet[1].rules[2].oneOf[4].use[0]![redacted]/node_modules/next/dist/compiled/postcss-loader/cjs.js??ruleSet[1].rules[2].oneOf[4].use[1]![redacted]/node_modules/next/dist/compiled/resolve-url-loader/index.js??ruleSet[1].rules[2].oneOf[4].use[2]![redacted]/node_modules/less-loader/dist/cjs.js??ruleSet[1].rules[2].oneOf[4].use[3]![redacted]/src/layouts/onboarding/style.module.less': No serializer registered for LessError
<w> while serializing webpack/lib/cache/PackFileCacheStrategy.PackContentItems -> webpack/lib/NormalModule -> webpack/lib/ModuleBuildError -> LessError
<w> [webpack.cache.PackFileCacheStrategy] Skipped not serializable cache item 'Compilation/modules|[redacted]/node_modules/next/dist/compiled/css-loader/cjs.js??ruleSet[1].rules[2].oneOf[4].use[0]![redacted]/node_modules/next/dist/compiled/postcss-loader/cjs.js??ruleSet[1].rules[2].oneOf[4].use[1]![redacted]/node_modules/next/dist/compiled/resolve-url-loader/index.js??ruleSet[1].rules[2].oneOf[4].use[2]![redacted]/node_modules/less-loader/dist/cjs.js??ruleSet[1].rules[2].oneOf[4].use[3]![redacted]/src/components/bullet-list/style.module.less': No serializer registered for LessError
<w> while serializing webpack/lib/cache/PackFileCacheStrategy.PackContentItems -> webpack/lib/NormalModule -> webpack/lib/ModuleBuildError -> LessError
<w> [webpack.cache.PackFileCacheStrategy] Skipped not serializable cache item 'Compilation/modules|[redacted]/node_modules/next/dist/compiled/css-loader/cjs.js??ruleSet[1].rules[2].oneOf[4].use[0]![redacted]/node_modules/next/dist/compiled/postcss-loader/cjs.js??ruleSet[1].rules[2].oneOf[4].use[1]![redacted]/node_modules/next/dist/compiled/resolve-url-loader/index.js??ruleSet[1].rules[2].oneOf[4].use[2]![redacted]/node_modules/less-loader/dist/cjs.js??ruleSet[1].rules[2].oneOf[4].use[3]![redacted]/src/components/min-max-input/style.module.less': No serializer registered for LessError
<w> while serializing webpack/lib/cache/PackFileCacheStrategy.PackContentItems -> webpack/lib/NormalModule -> webpack/lib/ModuleBuildError -> LessError
info  - Creating an optimized production build .<w> [webpack.cache.PackFileCacheStrategy] Skipped not serializable cache item 'Compilation/modules|[redacted]/node_modules/next/dist/build/webpack/plugins/mini-css-extract-plugin/src/loader.js??ruleSet[1].rules[2].oneOf[4].use[0]![redacted]/node_modules/next/dist/compiled/css-loader/cjs.js??ruleSet[1].rules[2].oneOf[4].use[1]![redacted]/node_modules/next/dist/compiled/postcss-loader/cjs.js??ruleSet[1].rules[2].oneOf[4].use[2]![redacted]/node_modules/next/dist/compiled/resolve-url-loader/index.js??ruleSet[1].rules[2].oneOf[4].use[3]![redacted]/node_modules/less-loader/dist/cjs.js??ruleSet[1].rules[2].oneOf[4].use[4]![redacted]/src/components/box/style.module.less': No serializer registered for LessError
<w> while serializing webpack/lib/cache/PackFileCacheStrategy.PackContentItems -> webpack/lib/NormalModule -> webpack/lib/ModuleBuildError -> webpack/lib/ModuleBuildError -> LessError
<w> [webpack.cache.PackFileCacheStrategy] Skipped not serializable cache item 'Compilation/modules|[redacted]/node_modules/next/dist/build/webpack/plugins/mini-css-extract-plugin/src/loader.js??ruleSet[1].rules[2].oneOf[4].use[0]![redacted]/node_modules/next/dist/compiled/css-loader/cjs.js??ruleSet[1].rules[2].oneOf[4].use[1]![redacted]/node_modules/next/dist/compiled/postcss-loader/cjs.js??ruleSet[1].rules[2].oneOf[4].use[2]![redacted]/node_modules/next/dist/compiled/resolve-url-loader/index.js??ruleSet[1].rules[2].oneOf[4].use[3]![redacted]/node_modules/less-loader/dist/cjs.js??ruleSet[1].rules[2].oneOf[4].use[4]![redacted]/src/layouts/standard/style.module.less': No serializer registered for LessError
<w> while serializing webpack/lib/cache/PackFileCacheStrategy.PackContentItems -> webpack/lib/NormalModule -> webpack/lib/ModuleBuildError -> webpack/lib/ModuleBuildError -> LessError
<w> [webpack.cache.PackFileCacheStrategy] Skipped not serializable cache item 'Compilation/modules|[redacted]/node_modules/next/dist/build/webpack/plugins/mini-css-extract-plugin/src/loader.js??ruleSet[1].rules[2].oneOf[4].use[0]![redacted]/node_modules/next/dist/compiled/css-loader/cjs.js??ruleSet[1].rules[2].oneOf[4].use[1]![redacted]/node_modules/next/dist/compiled/postcss-loader/cjs.js??ruleSet[1].rules[2].oneOf[4].use[2]![redacted]/node_modules/next/dist/compiled/resolve-url-loader/index.js??ruleSet[1].rules[2].oneOf[4].use[3]![redacted]/node_modules/less-loader/dist/cjs.js??ruleSet[1].rules[2].oneOf[4].use[4]![redacted]/src/components/flex/style.module.less': No serializer registered for LessError
<w> while serializing webpack/lib/cache/PackFileCacheStrategy.PackContentItems -> webpack/lib/NormalModule -> webpack/lib/ModuleBuildError -> webpack/lib/ModuleBuildError -> LessError
<w> [webpack.cache.PackFileCacheStrategy] Skipped not serializable cache item 'Compilation/modules|[redacted]/node_modules/next/dist/build/webpack/plugins/mini-css-extract-plugin/src/loader.js??ruleSet[1].rules[2].oneOf[4].use[0]![redacted]/node_modules/next/dist/compiled/css-loader/cjs.js??ruleSet[1].rules[2].oneOf[4].use[1]![redacted]/node_modules/next/dist/compiled/postcss-loader/cjs.js??ruleSet[1].rules[2].oneOf[4].use[2]![redacted]/node_modules/next/dist/compiled/resolve-url-loader/index.js??ruleSet[1].rules[2].oneOf[4].use[3]![redacted]/node_modules/less-loader/dist/cjs.js??ruleSet[1].rules[2].oneOf[4].use[4]![redacted]/src/pages/onboarding/style.module.less': No serializer registered for LessError
<w> while serializing webpack/lib/cache/PackFileCacheStrategy.PackContentItems -> webpack/lib/NormalModule -> webpack/lib/ModuleBuildError -> webpack/lib/ModuleBuildError -> LessError
<w> [webpack.cache.PackFileCacheStrategy] Skipped not serializable cache item 'Compilation/modules|[redacted]/node_modules/next/dist/build/webpack/plugins/mini-css-extract-plugin/src/loader.js??ruleSet[1].rules[2].oneOf[4].use[0]![redacted]/node_modules/next/dist/compiled/css-loader/cjs.js??ruleSet[1].rules[2].oneOf[4].use[1]![redacted]/node_modules/next/dist/compiled/postcss-loader/cjs.js??ruleSet[1].rules[2].oneOf[4].use[2]![redacted]/node_modules/next/dist/compiled/resolve-url-loader/index.js??ruleSet[1].rules[2].oneOf[4].use[3]![redacted]/node_modules/less-loader/dist/cjs.js??ruleSet[1].rules[2].oneOf[4].use[4]![redacted]/src/pages/jobs/[id]/style.module.less': No serializer registered for LessError
<w> while serializing webpack/lib/cache/PackFileCacheStrategy.PackContentItems -> webpack/lib/NormalModule -> webpack/lib/ModuleBuildError -> webpack/lib/ModuleBuildError -> LessError
<w> [webpack.cache.PackFileCacheStrategy] Skipped not serializable cache item 'Compilation/modules|[redacted]/node_modules/next/dist/build/webpack/plugins/mini-css-extract-plugin/src/loader.js??ruleSet[1].rules[2].oneOf[4].use[0]![redacted]/node_modules/next/dist/compiled/css-loader/cjs.js??ruleSet[1].rules[2].oneOf[4].use[1]![redacted]/node_modules/next/dist/compiled/postcss-loader/cjs.js??ruleSet[1].rules[2].oneOf[4].use[2]![redacted]/node_modules/next/dist/compiled/resolve-url-loader/index.js??ruleSet[1].rules[2].oneOf[4].use[3]![redacted]/node_modules/less-loader/dist/cjs.js??ruleSet[1].rules[2].oneOf[4].use[4]![redacted]/src/components/container/style.module.less': No serializer registered for LessError
<w> while serializing webpack/lib/cache/PackFileCacheStrategy.PackContentItems -> webpack/lib/NormalModule -> webpack/lib/ModuleBuildError -> webpack/lib/ModuleBuildError -> LessError
<w> [webpack.cache.PackFileCacheStrategy] Skipped not serializable cache item 'Compilation/modules|[redacted]/node_modules/next/dist/build/webpack/plugins/mini-css-extract-plugin/src/loader.js??ruleSet[1].rules[2].oneOf[4].use[0]![redacted]/node_modules/next/dist/compiled/css-loader/cjs.js??ruleSet[1].rules[2].oneOf[4].use[1]![redacted]/node_modules/next/dist/compiled/postcss-loader/cjs.js??ruleSet[1].rules[2].oneOf[4].use[2]![redacted]/node_modules/next/dist/compiled/resolve-url-loader/index.js??ruleSet[1].rules[2].oneOf[4].use[3]![redacted]/node_modules/less-loader/dist/cjs.js??ruleSet[1].rules[2].oneOf[4].use[4]![redacted]/src/pages/sign-up/style.module.less': No serializer registered for LessError
<w> while serializing webpack/lib/cache/PackFileCacheStrategy.PackContentItems -> webpack/lib/NormalModule -> webpack/lib/ModuleBuildError -> webpack/lib/ModuleBuildError -> LessError
<w> [webpack.cache.PackFileCacheStrategy] Skipped not serializable cache item 'Compilation/modules|[redacted]/node_modules/next/dist/build/webpack/plugins/mini-css-extract-plugin/src/loader.js??ruleSet[1].rules[2].oneOf[4].use[0]![redacted]/node_modules/next/dist/compiled/css-loader/cjs.js??ruleSet[1].rules[2].oneOf[4].use[1]![redacted]/node_modules/next/dist/compiled/postcss-loader/cjs.js??ruleSet[1].rules[2].oneOf[4].use[2]![redacted]/node_modules/next/dist/compiled/resolve-url-loader/index.js??ruleSet[1].rules[2].oneOf[4].use[3]![redacted]/node_modules/less-loader/dist/cjs.js??ruleSet[1].rules[2].oneOf[4].use[4]![redacted]/src/components/step-box/style.module.less': No serializer registered for LessError
<w> while serializing webpack/lib/cache/PackFileCacheStrategy.PackContentItems -> webpack/lib/NormalModule -> webpack/lib/ModuleBuildError -> webpack/lib/ModuleBuildError -> LessError
<w> [webpack.cache.PackFileCacheStrategy] Skipped not serializable cache item 'mini-css-extract-plugin [redacted]/node_modules/next/dist/compiled/css-loader/cjs.js??ruleSet[1].rules[2].oneOf[4].use[1]![redacted]/node_modules/next/dist/compiled/postcss-loader/cjs.js??ruleSet[1].rules[2].oneOf[4].use[2]![redacted]/node_modules/next/dist/compiled/resolve-url-loader/index.js??ruleSet[1].rules[2].oneOf[4].use[3]![redacted]/node_modules/less-loader/dist/cjs.js??ruleSet[1].rules[2].oneOf[4].use[4]![redacted]/src/components/box/style.module.less|0|Compilation/modules|[redacted]/node_modules/next/dist/compiled/css-loader/cjs.js??ruleSet[1].rules[2].oneOf[4].use[1]![redacted]/node_modules/next/dist/compiled/postcss-loader/cjs.js??ruleSet[1].rules[2].oneOf[4].use[2]![redacted]/node_modules/next/dist/compiled/resolve-url-loader/index.js??ruleSet[1].rules[2].oneOf[4].use[3]![redacted]/node_modules/less-loader/dist/cjs.js??ruleSet[1].rules[2].oneOf[4].use[4]![redacted]/src/components/box/style.module.less': No serializer registered for LessError
<w> while serializing webpack/lib/cache/PackFileCacheStrategy.PackContentItems -> webpack/lib/NormalModule -> webpack/lib/ModuleBuildError -> LessError
<w> [webpack.cache.PackFileCacheStrategy] Skipped not serializable cache item 'mini-css-extract-plugin [redacted]/node_modules/next/dist/compiled/css-loader/cjs.js??ruleSet[1].rules[2].oneOf[4].use[1]![redacted]/node_modules/next/dist/compiled/postcss-loader/cjs.js??ruleSet[1].rules[2].oneOf[4].use[2]![redacted]/node_modules/next/dist/compiled/resolve-url-loader/index.js??ruleSet[1].rules[2].oneOf[4].use[3]![redacted]/node_modules/less-loader/dist/cjs.js??ruleSet[1].rules[2].oneOf[4].use[4]![redacted]/src/components/flex/style.module.less|0|Compilation/modules|[redacted]/node_modules/next/dist/compiled/css-loader/cjs.js??ruleSet[1].rules[2].oneOf[4].use[1]![redacted]/node_modules/next/dist/compiled/postcss-loader/cjs.js??ruleSet[1].rules[2].oneOf[4].use[2]![redacted]/node_modules/next/dist/compiled/resolve-url-loader/index.js??ruleSet[1].rules[2].oneOf[4].use[3]![redacted]/node_modules/less-loader/dist/cjs.js??ruleSet[1].rules[2].oneOf[4].use[4]![redacted]/src/components/flex/style.module.less': No serializer registered for LessError
<w> while serializing webpack/lib/cache/PackFileCacheStrategy.PackContentItems -> webpack/lib/NormalModule -> webpack/lib/ModuleBuildError -> LessError
<w> [webpack.cache.PackFileCacheStrategy] Skipped not serializable cache item 'mini-css-extract-plugin [redacted]/node_modules/next/dist/compiled/css-loader/cjs.js??ruleSet[1].rules[2].oneOf[4].use[1]![redacted]/node_modules/next/dist/compiled/postcss-loader/cjs.js??ruleSet[1].rules[2].oneOf[4].use[2]![redacted]/node_modules/next/dist/compiled/resolve-url-loader/index.js??ruleSet[1].rules[2].oneOf[4].use[3]![redacted]/node_modules/less-loader/dist/cjs.js??ruleSet[1].rules[2].oneOf[4].use[4]![redacted]/src/layouts/standard/style.module.less|0|Compilation/modules|[redacted]/node_modules/next/dist/compiled/css-loader/cjs.js??ruleSet[1].rules[2].oneOf[4].use[1]![redacted]/node_modules/next/dist/compiled/postcss-loader/cjs.js??ruleSet[1].rules[2].oneOf[4].use[2]![redacted]/node_modules/next/dist/compiled/resolve-url-loader/index.js??ruleSet[1].rules[2].oneOf[4].use[3]![redacted]/node_modules/less-loader/dist/cjs.js??ruleSet[1].rules[2].oneOf[4].use[4]![redacted]/src/layouts/standard/style.module.less': No serializer registered for LessError
<w> while serializing webpack/lib/cache/PackFileCacheStrategy.PackContentItems -> webpack/lib/NormalModule -> webpack/lib/ModuleBuildError -> LessError
<w> [webpack.cache.PackFileCacheStrategy] Skipped not serializable cache item 'mini-css-extract-plugin [redacted]/node_modules/next/dist/compiled/css-loader/cjs.js??ruleSet[1].rules[2].oneOf[4].use[1]![redacted]/node_modules/next/dist/compiled/postcss-loader/cjs.js??ruleSet[1].rules[2].oneOf[4].use[2]![redacted]/node_modules/next/dist/compiled/resolve-url-loader/index.js??ruleSet[1].rules[2].oneOf[4].use[3]![redacted]/node_modules/less-loader/dist/cjs.js??ruleSet[1].rules[2].oneOf[4].use[4]![redacted]/src/pages/onboarding/style.module.less|0|Compilation/modules|[redacted]/node_modules/next/dist/compiled/css-loader/cjs.js??ruleSet[1].rules[2].oneOf[4].use[1]![redacted]/node_modules/next/dist/compiled/postcss-loader/cjs.js??ruleSet[1].rules[2].oneOf[4].use[2]![redacted]/node_modules/next/dist/compiled/resolve-url-loader/index.js??ruleSet[1].rules[2].oneOf[4].use[3]![redacted]/node_modules/less-loader/dist/cjs.js??ruleSet[1].rules[2].oneOf[4].use[4]![redacted]/src/pages/onboarding/style.module.less': No serializer registered for LessError
<w> while serializing webpack/lib/cache/PackFileCacheStrategy.PackContentItems -> webpack/lib/NormalModule -> webpack/lib/ModuleBuildError -> LessError
<w> [webpack.cache.PackFileCacheStrategy] Skipped not serializable cache item 'mini-css-extract-plugin [redacted]/node_modules/next/dist/compiled/css-loader/cjs.js??ruleSet[1].rules[2].oneOf[4].use[1]![redacted]/node_modules/next/dist/compiled/postcss-loader/cjs.js??ruleSet[1].rules[2].oneOf[4].use[2]![redacted]/node_modules/next/dist/compiled/resolve-url-loader/index.js??ruleSet[1].rules[2].oneOf[4].use[3]![redacted]/node_modules/less-loader/dist/cjs.js??ruleSet[1].rules[2].oneOf[4].use[4]![redacted]/src/pages/jobs/[id]/style.module.less|0|Compilation/modules|[redacted]/node_modules/next/dist/compiled/css-loader/cjs.js??ruleSet[1].rules[2].oneOf[4].use[1]![redacted]/node_modules/next/dist/compiled/postcss-loader/cjs.js??ruleSet[1].rules[2].oneOf[4].use[2]![redacted]/node_modules/next/dist/compiled/resolve-url-loader/index.js??ruleSet[1].rules[2].oneOf[4].use[3]![redacted]/node_modules/less-loader/dist/cjs.js??ruleSet[1].rules[2].oneOf[4].use[4]![redacted]/src/pages/jobs/[id]/style.module.less': No serializer registered for LessError
<w> while serializing webpack/lib/cache/PackFileCacheStrategy.PackContentItems -> webpack/lib/NormalModule -> webpack/lib/ModuleBuildError -> LessError
<w> [webpack.cache.PackFileCacheStrategy] Skipped not serializable cache item 'mini-css-extract-plugin [redacted]/node_modules/next/dist/compiled/css-loader/cjs.js??ruleSet[1].rules[2].oneOf[4].use[1]![redacted]/node_modules/next/dist/compiled/postcss-loader/cjs.js??ruleSet[1].rules[2].oneOf[4].use[2]![redacted]/node_modules/next/dist/compiled/resolve-url-loader/index.js??ruleSet[1].rules[2].oneOf[4].use[3]![redacted]/node_modules/less-loader/dist/cjs.js??ruleSet[1].rules[2].oneOf[4].use[4]![redacted]/src/pages/sign-up/style.module.less|0|Compilation/modules|[redacted]/node_modules/next/dist/compiled/css-loader/cjs.js??ruleSet[1].rules[2].oneOf[4].use[1]![redacted]/node_modules/next/dist/compiled/postcss-loader/cjs.js??ruleSet[1].rules[2].oneOf[4].use[2]![redacted]/node_modules/next/dist/compiled/resolve-url-loader/index.js??ruleSet[1].rules[2].oneOf[4].use[3]![redacted]/node_modules/less-loader/dist/cjs.js??ruleSet[1].rules[2].oneOf[4].use[4]![redacted]/src/pages/sign-up/style.module.less': No serializer registered for LessError
<w> while serializing webpack/lib/cache/PackFileCacheStrategy.PackContentItems -> webpack/lib/NormalModule -> webpack/lib/ModuleBuildError -> LessError
<w> [webpack.cache.PackFileCacheStrategy] Skipped not serializable cache item 'mini-css-extract-plugin [redacted]/node_modules/next/dist/compiled/css-loader/cjs.js??ruleSet[1].rules[2].oneOf[4].use[1]![redacted]/node_modules/next/dist/compiled/postcss-loader/cjs.js??ruleSet[1].rules[2].oneOf[4].use[2]![redacted]/node_modules/next/dist/compiled/resolve-url-loader/index.js??ruleSet[1].rules[2].oneOf[4].use[3]![redacted]/node_modules/less-loader/dist/cjs.js??ruleSet[1].rules[2].oneOf[4].use[4]![redacted]/src/components/container/style.module.less|0|Compilation/modules|[redacted]/node_modules/next/dist/compiled/css-loader/cjs.js??ruleSet[1].rules[2].oneOf[4].use[1]![redacted]/node_modules/next/dist/compiled/postcss-loader/cjs.js??ruleSet[1].rules[2].oneOf[4].use[2]![redacted]/node_modules/next/dist/compiled/resolve-url-loader/index.js??ruleSet[1].rules[2].oneOf[4].use[3]![redacted]/node_modules/less-loader/dist/cjs.js??ruleSet[1].rules[2].oneOf[4].use[4]![redacted]/src/components/container/style.module.less': No serializer registered for LessError
<w> while serializing webpack/lib/cache/PackFileCacheStrategy.PackContentItems -> webpack/lib/NormalModule -> webpack/lib/ModuleBuildError -> LessError
<w> [webpack.cache.PackFileCacheStrategy] Skipped not serializable cache item 'Compilation/modules|[redacted]/node_modules/next/dist/build/webpack/plugins/mini-css-extract-plugin/src/loader.js??ruleSet[1].rules[2].oneOf[4].use[0]![redacted]/node_modules/next/dist/compiled/css-loader/cjs.js??ruleSet[1].rules[2].oneOf[4].use[1]![redacted]/node_modules/next/dist/compiled/postcss-loader/cjs.js??ruleSet[1].rules[2].oneOf[4].use[2]![redacted]/node_modules/next/dist/compiled/resolve-url-loader/index.js??ruleSet[1].rules[2].oneOf[4].use[3]![redacted]/node_modules/less-loader/dist/cjs.js??ruleSet[1].rules[2].oneOf[4].use[4]![redacted]/src/components/brand/style.module.less': No serializer registered for LessError
<w> while serializing webpack/lib/cache/PackFileCacheStrategy.PackContentItems -> webpack/lib/NormalModule -> webpack/lib/ModuleBuildError -> webpack/lib/ModuleBuildError -> LessError
<w> [webpack.cache.PackFileCacheStrategy] Skipped not serializable cache item 'Compilation/modules|[redacted]/node_modules/next/dist/build/webpack/plugins/mini-css-extract-plugin/src/loader.js??ruleSet[1].rules[2].oneOf[4].use[0]![redacted]/node_modules/next/dist/compiled/css-loader/cjs.js??ruleSet[1].rules[2].oneOf[4].use[1]![redacted]/node_modules/next/dist/compiled/postcss-loader/cjs.js??ruleSet[1].rules[2].oneOf[4].use[2]![redacted]/node_modules/next/dist/compiled/resolve-url-loader/index.js??ruleSet[1].rules[2].oneOf[4].use[3]![redacted]/node_modules/less-loader/dist/cjs.js??ruleSet[1].rules[2].oneOf[4].use[4]![redacted]/src/layouts/onboarding/style.module.less': No serializer registered for LessError
<w> while serializing webpack/lib/cache/PackFileCacheStrategy.PackContentItems -> webpack/lib/NormalModule -> webpack/lib/ModuleBuildError -> webpack/lib/ModuleBuildError -> LessError
<w> [webpack.cache.PackFileCacheStrategy] Skipped not serializable cache item 'mini-css-extract-plugin [redacted]/node_modules/next/dist/compiled/css-loader/cjs.js??ruleSet[1].rules[2].oneOf[4].use[1]![redacted]/node_modules/next/dist/compiled/postcss-loader/cjs.js??ruleSet[1].rules[2].oneOf[4].use[2]![redacted]/node_modules/next/dist/compiled/resolve-url-loader/index.js??ruleSet[1].rules[2].oneOf[4].use[3]![redacted]/node_modules/less-loader/dist/cjs.js??ruleSet[1].rules[2].oneOf[4].use[4]![redacted]/src/components/step-box/style.module.less|0|Compilation/modules|[redacted]/node_modules/next/dist/compiled/css-loader/cjs.js??ruleSet[1].rules[2].oneOf[4].use[1]![redacted]/node_modules/next/dist/compiled/postcss-loader/cjs.js??ruleSet[1].rules[2].oneOf[4].use[2]![redacted]/node_modules/next/dist/compiled/resolve-url-loader/index.js??ruleSet[1].rules[2].oneOf[4].use[3]![redacted]/node_modules/less-loader/dist/cjs.js??ruleSet[1].rules[2].oneOf[4].use[4]![redacted]/src/components/step-box/style.module.less': No serializer registered for LessError
<w> while serializing webpack/lib/cache/PackFileCacheStrategy.PackContentItems -> webpack/lib/NormalModule -> webpack/lib/ModuleBuildError -> LessError
<w> [webpack.cache.PackFileCacheStrategy] Skipped not serializable cache item 'Compilation/modules|[redacted]/node_modules/next/dist/build/webpack/plugins/mini-css-extract-plugin/src/loader.js??ruleSet[1].rules[2].oneOf[4].use[0]![redacted]/node_modules/next/dist/compiled/css-loader/cjs.js??ruleSet[1].rules[2].oneOf[4].use[1]![redacted]/node_modules/next/dist/compiled/postcss-loader/cjs.js??ruleSet[1].rules[2].oneOf[4].use[2]![redacted]/node_modules/next/dist/compiled/resolve-url-loader/index.js??ruleSet[1].rules[2].oneOf[4].use[3]![redacted]/node_modules/less-loader/dist/cjs.js??ruleSet[1].rules[2].oneOf[4].use[4]![redacted]/src/components/bullet-list/style.module.less': No serializer registered for LessError
<w> while serializing webpack/lib/cache/PackFileCacheStrategy.PackContentItems -> webpack/lib/NormalModule -> webpack/lib/ModuleBuildError -> webpack/lib/ModuleBuildError -> LessError
<w> [webpack.cache.PackFileCacheStrategy] Skipped not serializable cache item 'Compilation/modules|[redacted]/node_modules/next/dist/build/webpack/plugins/mini-css-extract-plugin/src/loader.js??ruleSet[1].rules[2].oneOf[4].use[0]![redacted]/node_modules/next/dist/compiled/css-loader/cjs.js??ruleSet[1].rules[2].oneOf[4].use[1]![redacted]/node_modules/next/dist/compiled/postcss-loader/cjs.js??ruleSet[1].rules[2].oneOf[4].use[2]![redacted]/node_modules/next/dist/compiled/resolve-url-loader/index.js??ruleSet[1].rules[2].oneOf[4].use[3]![redacted]/node_modules/less-loader/dist/cjs.js??ruleSet[1].rules[2].oneOf[4].use[4]![redacted]/src/components/min-max-input/style.module.less': No serializer registered for LessError
<w> while serializing webpack/lib/cache/PackFileCacheStrategy.PackContentItems -> webpack/lib/NormalModule -> webpack/lib/ModuleBuildError -> webpack/lib/ModuleBuildError -> LessError
<w> [webpack.cache.PackFileCacheStrategy] Skipped not serializable cache item 'mini-css-extract-plugin [redacted]/node_modules/next/dist/compiled/css-loader/cjs.js??ruleSet[1].rules[2].oneOf[4].use[1]![redacted]/node_modules/next/dist/compiled/postcss-loader/cjs.js??ruleSet[1].rules[2].oneOf[4].use[2]![redacted]/node_modules/next/dist/compiled/resolve-url-loader/index.js??ruleSet[1].rules[2].oneOf[4].use[3]![redacted]/node_modules/less-loader/dist/cjs.js??ruleSet[1].rules[2].oneOf[4].use[4]![redacted]/src/components/brand/style.module.less|0|Compilation/modules|[redacted]/node_modules/next/dist/compiled/css-loader/cjs.js??ruleSet[1].rules[2].oneOf[4].use[1]![redacted]/node_modules/next/dist/compiled/postcss-loader/cjs.js??ruleSet[1].rules[2].oneOf[4].use[2]![redacted]/node_modules/next/dist/compiled/resolve-url-loader/index.js??ruleSet[1].rules[2].oneOf[4].use[3]![redacted]/node_modules/less-loader/dist/cjs.js??ruleSet[1].rules[2].oneOf[4].use[4]![redacted]/src/components/brand/style.module.less': No serializer registered for LessError
<w> while serializing webpack/lib/cache/PackFileCacheStrategy.PackContentItems -> webpack/lib/NormalModule -> webpack/lib/ModuleBuildError -> LessError
<w> [webpack.cache.PackFileCacheStrategy] Skipped not serializable cache item 'mini-css-extract-plugin [redacted]/node_modules/next/dist/compiled/css-loader/cjs.js??ruleSet[1].rules[2].oneOf[4].use[1]![redacted]/node_modules/next/dist/compiled/postcss-loader/cjs.js??ruleSet[1].rules[2].oneOf[4].use[2]![redacted]/node_modules/next/dist/compiled/resolve-url-loader/index.js??ruleSet[1].rules[2].oneOf[4].use[3]![redacted]/node_modules/less-loader/dist/cjs.js??ruleSet[1].rules[2].oneOf[4].use[4]![redacted]/src/layouts/onboarding/style.module.less|0|Compilation/modules|[redacted]/node_modules/next/dist/compiled/css-loader/cjs.js??ruleSet[1].rules[2].oneOf[4].use[1]![redacted]/node_modules/next/dist/compiled/postcss-loader/cjs.js??ruleSet[1].rules[2].oneOf[4].use[2]![redacted]/node_modules/next/dist/compiled/resolve-url-loader/index.js??ruleSet[1].rules[2].oneOf[4].use[3]![redacted]/node_modules/less-loader/dist/cjs.js??ruleSet[1].rules[2].oneOf[4].use[4]![redacted]/src/layouts/onboarding/style.module.less': No serializer registered for LessError
<w> while serializing webpack/lib/cache/PackFileCacheStrategy.PackContentItems -> webpack/lib/NormalModule -> webpack/lib/ModuleBuildError -> LessError
<w> [webpack.cache.PackFileCacheStrategy] Skipped not serializable cache item 'mini-css-extract-plugin [redacted]/node_modules/next/dist/compiled/css-loader/cjs.js??ruleSet[1].rules[2].oneOf[4].use[1]![redacted]/node_modules/next/dist/compiled/postcss-loader/cjs.js??ruleSet[1].rules[2].oneOf[4].use[2]![redacted]/node_modules/next/dist/compiled/resolve-url-loader/index.js??ruleSet[1].rules[2].oneOf[4].use[3]![redacted]/node_modules/less-loader/dist/cjs.js??ruleSet[1].rules[2].oneOf[4].use[4]![redacted]/src/components/bullet-list/style.module.less|0|Compilation/modules|[redacted]/node_modules/next/dist/compiled/css-loader/cjs.js??ruleSet[1].rules[2].oneOf[4].use[1]![redacted]/node_modules/next/dist/compiled/postcss-loader/cjs.js??ruleSet[1].rules[2].oneOf[4].use[2]![redacted]/node_modules/next/dist/compiled/resolve-url-loader/index.js??ruleSet[1].rules[2].oneOf[4].use[3]![redacted]/node_modules/less-loader/dist/cjs.js??ruleSet[1].rules[2].oneOf[4].use[4]![redacted]/src/components/bullet-list/style.module.less': No serializer registered for LessError
<w> while serializing webpack/lib/cache/PackFileCacheStrategy.PackContentItems -> webpack/lib/NormalModule -> webpack/lib/ModuleBuildError -> LessError
<w> [webpack.cache.PackFileCacheStrategy] Skipped not serializable cache item 'mini-css-extract-plugin [redacted]/node_modules/next/dist/compiled/css-loader/cjs.js??ruleSet[1].rules[2].oneOf[4].use[1]![redacted]/node_modules/next/dist/compiled/postcss-loader/cjs.js??ruleSet[1].rules[2].oneOf[4].use[2]![redacted]/node_modules/next/dist/compiled/resolve-url-loader/index.js??ruleSet[1].rules[2].oneOf[4].use[3]![redacted]/node_modules/less-loader/dist/cjs.js??ruleSet[1].rules[2].oneOf[4].use[4]![redacted]/src/components/min-max-input/style.module.less|0|Compilation/modules|[redacted]/node_modules/next/dist/compiled/css-loader/cjs.js??ruleSet[1].rules[2].oneOf[4].use[1]![redacted]/node_modules/next/dist/compiled/postcss-loader/cjs.js??ruleSet[1].rules[2].oneOf[4].use[2]![redacted]/node_modules/next/dist/compiled/resolve-url-loader/index.js??ruleSet[1].rules[2].oneOf[4].use[3]![redacted]/node_modules/less-loader/dist/cjs.js??ruleSet[1].rules[2].oneOf[4].use[4]![redacted]/src/components/min-max-input/style.module.less': No serializer registered for LessError
<w> while serializing webpack/lib/cache/PackFileCacheStrategy.PackContentItems -> webpack/lib/NormalModule -> webpack/lib/ModuleBuildError -> LessError
info  - Creating an optimized production build  
Failed to compile.

./node_modules/antd/lib/button/style/index.less
Global CSS cannot be imported from within node_modules.
Read more: https://nextjs.org/docs/messages/css-npm
Location: node_modules/antd/lib/button/style/index.js


> Build error occurred
Error: > Build failed because of webpack errors
    at [redacted]/node_modules/next/dist/build/index.js:17:924
    at async Span.traceAsyncFn ([redacted]/node_modules/next/dist/telemetry/trace/trace.js:6:584)

Which makes sense since we assert Less code is side effect free. But I was wondering how did you make it work on your project?

Elad Ossadon · Answer 1 · Sat May 01 2021 06:52:56 GMT+0800 (China Standard Time)

@haggen Next.js does not allow importing JS files in node_modules that end up importing CSS files for the reasons described in https://nextjs.org/docs/messages/css-npm

The file you are importing (directly or indirectly) is antd/lib/button/style/index.js
The contents of the file are here https://unpkg.com/antd@4.15.4/lib/button/style/index.js :

require("../../style/index.less");

require("./index.less");

and that's why Next.js throws an error.
It would be the same if it was a .css import and not .less import. So this is "expected" according to Next.

The solution is to import the .less files in your pages/_app instead of importing a JS file that imports them:

import 'antd/lib/style/index.less';
import 'antd/lib/button/style/index.less';

Hope this helps!

Arthur Corenzan · Answer 2 · Mon May 03 2021 19:51:29 GMT+0800 (China Standard Time)

Hey @elado thanks for the great answer! That confirms my understanding, but I still wonder, is that how you did on your projects using Antd?

Doing that would import those styles on every page, even ones not using any Antd components.

The way I'm doing it right now is bypassing this rule so I can import the style with the component when I use, where I use it, dramatically reducing the weight of the page.

Elad Ossadon · Answer 3 · Tue May 04 2021 02:41:49 GMT+0800 (China Standard Time)

The current project I'm migrating loads the entire antd less file so haven't gotten there yet.
This is an interesting question I'd raise to the Next.js team - it's not exclusive to Less/Ant.
Perhaps you can combine css-modules and :global to load global CSS in a scoped manner:

/* styles/home.module.less */

.container :global {
  @import "~ant/lib/button/style/index.less";
}

// pages/home.js

import styles from '../styles/home.module.less'

..

return <div className={styles.container}><Button>..

Krungleviciute · Answer 4 · Fri Nov 18 2022 00:33:15 GMT+0800 (China Standard Time)

The current project I'm migrating loads the entire antd less file so haven't gotten there yet.

Did you have any luck migrating?