由于某种原因,当我运行npm run build
时,npm无法创建next.js应用程序的构建。当它试图获取logo.png
时,它崩溃了,logo.png
最初位于public
目录中,我在那里提供所有静态资产,如图像和图标。我真的不明白发生了什么,为什么我会得到这个错误:\
info - Linting and checking validity of types
info - Creating an optimized production build
Failed to compile.
HookWebpackError: File C:\Users\Daniil\MY_PROJECT_DIR\.next\static\media\logo.ecfa485c.PNG does not exist.
at makeWebpackError (C:\Users\Daniil\MY_PROJECT_DIR\node_modules\next\dist\compiled\webpack\bundle5.js:28:308185)
at C:\Users\Daniil\MY_PROJECT_DIR\node_modules\next\dist\compiled\webpack\bundle5.js:28:105236
at eval (eval at create (C:\Users\Daniil\MY_PROJECT_DIR\node_modules\next\dist\compiled\webpack\bundle5.js:13:28771), <anonymous>:27:1)
at C:\Users\Daniil\MY_PROJECT_DIR\node_modules\next\dist\compiled\webpack\bundle5.js:28:68649
at C:\Users\Daniil\MY_PROJECT_DIR\node_modules\next\dist\build\webpack\plugins\next-trace-entrypoints-plugin.js:414:143
-- inner error --
Error: File C:\Users\Daniil\MY_PROJECT_DIR\.next\static\media\logo.ecfa485c.PNG does not exist.
at Job.emitDependency (C:\Users\Daniil\MY_PROJECT_DIR\node_modules\next\dist\compiled\@vercel\nft\index.js:1:39473)
at async Promise.all (index 5)
at async Object.nodeFileTrace (C:\Users\Daniil\MY_PROJECT_DIR\node_modules\next\dist\compiled\@vercel\nft\index.js:1:35430)
at async C:\Users\Daniil\MY_PROJECT_DIR\node_modules\next\dist\build\webpack\plugins\next-trace-entrypoints-plugin.js:135:28
at async Span.traceAsyncFn (C:\Users\Daniil\MY_PROJECT_DIR\node_modules\next\dist\trace\trace.js:79:20)
at async TraceEntryPointsPlugin.createTraceAssets (C:\Users\Daniil\MY_PROJECT_DIR\node_modules\next\dist\build\webpack\plugins\next-trace-entrypoints-plugin.js:89:9)
caused by plugins in Compilation.hooks.processAssets
Error: File C:\Users\Daniil\MY_PROJECT_DIR\.next\static\media\logo.ecfa485c.PNG does not exist.
at Job.emitDependency (C:\Users\Daniil\MY_PROJECT_DIR\node_modules\next\dist\compiled\@vercel\nft\index.js:1:39473)
at async Promise.all (index 5)
at async Object.nodeFileTrace (C:\Users\Daniil\MY_PROJECT_DIR\node_modules\next\dist\compiled\@vercel\nft\index.js:1:35430)
at async C:\Users\Daniil\MY_PROJECT_DIR\node_modules\next\dist\build\webpack\plugins\next-trace-entrypoints-plugin.js:135:28
at async Span.traceAsyncFn (C:\Users\Daniil\MY_PROJECT_DIR\node_modules\next\dist\trace\trace.js:79:20)
at async TraceEntryPointsPlugin.createTraceAssets (C:\Users\Daniil\MY_PROJECT_DIR\node_modules\next\dist\build\webpack\plugins\next-trace-entrypoints-plugin.js:89:9)
> Build failed because of webpack errors
我的项目结构如下所示
C:.
├───.next
│ ├───cache
│ │ ├───eslint
│ │ ├───swc
│ │ │ └───plugins
│ │ │ └───v4
│ │ └───webpack
│ │ ├───client-development
│ │ ├───server-development
│ │ └───server-production
│ └───server
├───components
├───node_modules
├───pages
│ ├───catalog
│ │ └───product
│ └───news
├───public
│ ├───about_us
│ ├───catalog
│ ├───contacts
│ ├───footer
│ ├───gallery
│ ├───our_works
│ ├───reviews
│ └───why_we
└───styles
我真的很感激任何帮助!
1条答案
按热度按时间wz3gfoph1#
所以问题出在我导入图像的方式上。出于某种原因,我是这样做的:
但正确的方法是直接将path指向
img
元素中的image: