无法在 Next.js 项目中执行 npm run build（webpack 错误）？

Question

我已经开发这个应用程序几个月了，并且能够很好地运行 npm run dev。今天我第一次尝试做一个 npm run build 并且每次都收到这个奇怪的错误。我正试图在这个月发布，这真的很令人沮丧。

next.config.js 中使用了一些上下文 next-transpile-modules，但我删除了它，但仍然收到同样的错误。 我删除了我的.next 和node_modules，更新了依赖项并多次重新安装 尝试了多个节点版本。 尝试了多个下一个版本。

当前版本

节点：16.13.0， 下一个：12.0.7， 反应：17.0.2，

> HookWebpackError: Cannot read properties of undefined (reading 'length')

    at makeWebpackError (F:\PROJECTS DJANGO\A_Next_Community\next_server_code\node_modules\next\dist\compiled\webpack\bundle5.js:45539:9)
    at F:\PROJECTS DJANGO\A_Next_Community\next_server_code\node_modules\next\dist\compiled\webpack\bundle5.js:29467:12
    at eval (eval at create (F:\PROJECTS DJANGO\A_Next_Community\next_server_code\node_modules\next\dist\compiled\webpack\bundle5.js:140927:10), <anonymous>:34:1)
    at runMicrotasks (<anonymous>)
    at processTicksAndRejections (node:internal/process/task_queues:96:5) -- inner error --

> TypeError: Cannot read properties of undefined (reading 'length')

        at F:\PROJECTS DJANGO\A_Next_Community\next_server_code\static\css\cf0a424279fe9c8d.css:1622:3
        at p.exports (F:\PROJECTS DJANGO\A_Next_Community\next_server_code\node_modules\cssnano-preset-simple\dist\index.js:195:156203) 
        at F:\PROJECTS DJANGO\A_Next_Community\next_server_code\node_modules\cssnano-preset-simple\dist\index.js:195:52141
        at Array.forEach (<anonymous>)
        at F:\PROJECTS DJANGO\A_Next_Community\next_server_code\node_modules\cssnano-preset-simple\dist\index.js:195:52070
        at walk (F:\PROJECTS DJANGO\A_Next_Community\next_server_code\node_modules\cssnano-preset-simple\dist\index.js:195:156826)      
        at ValueParser.walk (F:\PROJECTS DJANGO\A_Next_Community\next_server_code\node_modules\cssnano-preset-simple\dist\index.js:195:152133)
        at optimise (F:\PROJECTS DJANGO\A_Next_Community\next_server_code\node_modules\cssnano-preset-simple\dist\index.js:195:51669)   
        at F:\PROJECTS DJANGO\A_Next_Community\next_server_code\node_modules\postcss\lib\container.js:91:18
        at F:\PROJECTS DJANGO\A_Next_Community\next_server_code\node_modules\postcss\lib\container.js:74:18
        at Rule.each (F:\PROJECTS DJANGO\A_Next_Community\next_server_code\node_modules\postcss\lib\container.js:60:16)
    

    **caused by plugins in Compilation.hooks.processAssets** <- This part interest's me

    

> TypeError: Cannot read properties of undefined (reading 'length')

        at F:\PROJECTS DJANGO\A_Next_Community\next_server_code\static\css\cf0a424279fe9c8d.css:1622:3
        at p.exports (F:\PROJECTS DJANGO\A_Next_Community\next_server_code\node_modules\cssnano-preset-simple\dist\index.js:195:156203) 
        at F:\PROJECTS DJANGO\A_Next_Community\next_server_code\node_modules\cssnano-preset-simple\dist\index.js:195:52141
        at Array.forEach (<anonymous>)
        at F:\PROJECTS DJANGO\A_Next_Community\next_server_code\node_modules\cssnano-preset-simple\dist\index.js:195:52070
        at walk (F:\PROJECTS DJANGO\A_Next_Community\next_server_code\node_modules\cssnano-preset-simple\dist\index.js:195:156826)      
        at ValueParser.walk (F:\PROJECTS DJANGO\A_Next_Community\next_server_code\node_modules\cssnano-preset-simple\dist\index.js:195:152133)
        at optimise (F:\PROJECTS DJANGO\A_Next_Community\next_server_code\node_modules\cssnano-preset-simple\dist\index.js:195:51669)   
        at F:\PROJECTS DJANGO\A_Next_Community\next_server_code\node_modules\postcss\lib\container.js:91:18
        at F:\PROJECTS DJANGO\A_Next_Community\next_server_code\node_modules\postcss\lib\container.js:74:18
        at Rule.each (F:\PROJECTS DJANGO\A_Next_Community\next_server_code\node_modules\postcss\lib\container.js:60:16)

> **Build failed because of webpack errors**

Answer 1

已解决：

问题似乎是我的 globals.css 文件中的一个类。我最终删除了一堆类并尝试进行构建，并且效果很好。我不知道 CSS 中究竟是什么导致了这个问题，但我知道在删除这个类和其他一些类之后它似乎运行良好。

.glass-container-dark{
  /* background: linear-gradient(to bottom left, rgba(14, 9, 11, 0.6), rgba(45,46,52,0.9)); */
  

  background: linear-gradient(to 98deg, rgba(224, 224, 224, 0.7), rgb(187, 187, 187));

  border-radius: 1rem;
  margin: 0.5rem 0rem;
  padding:1rem;

  /* width: 250px !important;
  height: 170px !important; */
  box-shadow: 2px 2px 10px rgba(12, 12, 12, 0.612);

  
}