如何克服 Next.JS 应用程序的相对路径和自定义导入导致的构建时错误？

Question

此问题已在 Python、PHP 等上下文中得到回答，但我找不到针对我正在创建的 Next.JS 博客的特定答案。每次构建时，我都会从 nodemon 收到以下错误：

These dependencies were not found:

* /api/posts in ./pages/index.js
* /components/Post in ./pages/index.js
* /layouts/Main in ./pages/index.js
* /routes in ./pages/index.js

正如您从我的项目文件夹的屏幕截图中看到的那样，所有自定义依赖项都来自我的项目文件夹。

我的 package.json 文件如下所示：

{
    "name": "revised-tottm",
    "version": "1.0.0",
    "description": "revised TOTTM website",
    "main": "_document.js",
    "dependencies": {
        "next": "^7.0.2",
        "next-routes": "^1.4.2",
        "nodemailer": "^4.7.0",
        "react": "^16.6.3",
        "react-dom": "^16.6.3",
        "reactdom": "^2.0.0",
        "static-server": "^2.2.1",
        "styled-components": "^4.1.2",
        "absolute-imports": "^1.0.1",
        "body-parser": "^1.18.3",
        "express": "^4.16.2",
        "get-form-data": "^2.0.0"
    },
    "devDependencies": {
        "babel-preset-env": "^1.5.2",
        "babel-preset-react": "6.24.1",
        "gulp": "^3.9.1",
        "gulp-babel": "^8.0.0",
        "gulp-concat": "^2.6.1",
        "gulp-imagemin": "^5.0.3",
        "gulp-livereload": "^4.0.1",
        "gulp-uglify": "^3.0.1",
        "gulp-uglify-es": "^1.0.4",
        "imagemin-jpeg-recompress": "^5.1.0",
        "imagemin-pngquant": "^6.0.0"
    },
    "scripts": {
        "test": "echo \"Error: no test specified\" && exit 1",
        "dev": "next",
        "build": "next build",
        "start": "next start"
    },
    "author": "Joel J. Warne",
    "license": "ISC"
}

而且我已经尝试过变体，例如"require('./api/posts')" 和 "require('api/posts/')" 但似乎找不到它们。例如，如果我将路径更改为 "require('./api/posts/')" 并使用 Next.JS "build" 脚本，我会收到以下错误：

> Failed to build

{ Error: (client) ./pages/index.js
Module not found: Error: Can't resolve './api/posts' in '/Users/USERNAME/Library/Mobile Documents/com~apple~CloudDocs/WebDevStudio/Revised TOTTM/pages'
 @ ./pages/index.js 10:0-39 37:19-27
 @ multi ./pages/index.js
    at /Users/USERNAME/Library/Mobile Documents/com~apple~CloudDocs/WebDevStudio/Revised TOTTM/node_modules/next/dist/build/index.js:144:31

入口点正确，项目文件夹结构正确等，但没有理由不能定位，比如我能看到的'/api/posts/' .

Answer 1

我很好奇你是否正确地导入了模块

例如：

如果您想将 components/Post 导入 pages/index.js，这应该如下所示：import Post from '../components/Post';

让我知道这是否有效，

此致

如何克服 Next.JS 应用程序的相对路径和自定义导入导致的构建时错误？

How do I overcome build-time errors due to relative paths and custom imports with Next.JS applications?

node.js

reactjs

next.js