`npm run build` не работает в Next.js 14

Проблема со сборкой Next.js: «следующий: не найден» на сервере развертывания

Описание:

В процессе сборки я столкнулся с проблемой в проекте Next.js. Журналы локальной сборки и сервера развертывания показаны ниже.

Локальные журналы сборки:

$ next build

   ▲ Next.js 14.1.0

   Creating an optimized production build ...
 ✓ Compiled successfully
 ✓ Linting and checking validity of types
 ✓ Collecting page data
 ✓ Generating static pages (5/5)
 ✓ Collecting build traces
 ✓ Finalizing page optimization

Route (app)                              Size     First Load JS
┌ ○ /                                    76.3 kB         160 kB
└ ○ /_not-found                          882 B          85.1 kB
+ First Load JS shared by all            84.2 kB
  ├ chunks/69-28f79be715c06873.js        28.9 kB
  ├ chunks/fd9d1056-f6b668df0b3d2561.js  53.4 kB
  └ other shared chunks (total)          1.96 kB


○  (Static)  prerendered as static content

Приведенные выше выходные данные свидетельствуют о том, что сборка прошла успешно локально.

Ошибка сервера развертывания:

Run (npm run build)

  shell: /usr/bin/bash -e ***0***

> [email protected] build
> next build

sh: 1: next: not found
Error: Process completed with exit code 127.

На сервере развертывания я столкнулся с проблемой, из-за которой не распознается next. Сборка завершается с ошибкой 127.

Вещи, которые я пробовал:

  1. Удалил node_modules, очистил кеш npm и переустановил -> npm i
  2. Далее удалил и переустановил -> npm i next
  3. Добавлен перекрестный интерфейс -> npm и перекрестный интерфейс.
  4. Добавлена ​​зависимость -> «dev»: «cross-env NODE_OPTIONS='--inspect' next dev»

Пакет.json:

    {
  "name": "personal-portfolio",
  "version": "0.1.0",
  "private": true,
  "scripts": {
    "dev": "next dev",
    "build": "next build",
    "start": "next start",
    "lint": "next lint"
  },
  "dependencies": {
    "@tabler/icons-react": "^2.47.0",
    "@tsparticles/engine": "^3.2.1",
    "@tsparticles/react": "^3.0.0",
    "@tsparticles/slim": "^3.2.1",
    "classnames": "^2.5.1",
    "clsx": "^2.1.0",
    "cross-env": "^7.0.3",
    "framer-motion": "^11.0.5",
    "next": "^14.1.0",
    "react": "^18",
    "react-dom": "^18",
    "react-element-to-jsx-string": "^15.0.0",
    "react-hot-toast": "^2.4.1",
    "react-icons": "^5.0.1",
    "react-player": "^2.14.1",
    "sonner": "^1.4.0",
    "tailwind-merge": "^2.2.1",
    "tsparticles-engine": "^2.12.0"
  },
  "devDependencies": {
    "@types/node": "20.11.18",
    "@types/react": "18.2.55",
    "autoprefixer": "^10.0.1",
    "eslint": "^8",
    "eslint-config-next": "14.1.0",
    "postcss": "^8",
    "tailwindcss": "^3.4.1",
    "typescript": "^5.3.3"
  }
}

Будем очень признательны за любые идеи или рекомендации по решению этой проблемы. Спасибо!

обновите свой вопрос, включив в него дополнительную информацию о процессе развертывания, где развертывать? конфигурация? обычно ошибка заключается в том, что он ожидает запуска npm install перед запуском npm run build

Ahmed Abdelbaset 20.02.2024 19:59

Спасибо @AhmedAbdelbaset за ответ, я развертываю его на Firebase через автоматическое слияние github. Кроме того, он не работает локально в рабочей среде. Вы уверены, что это ошибка процесса развертывания?

Manu Bhardwaj 21.02.2024 06:06

Эта ошибка буквально означает: «Я не могу найти каталог node_modules/next. Вероятно, вы забыли запустить установку npm». Если вы можете поделиться репо, я мог бы взглянуть

Ahmed Abdelbaset 21.02.2024 06:36
Поведение ключевого слова "this" в стрелочной функции в сравнении с нормальной функцией
Поведение ключевого слова "this" в стрелочной функции в сравнении с нормальной функцией
В JavaScript одним из самых запутанных понятий является поведение ключевого слова "this" в стрелочной и обычной функциях.
Концепция локализации и ее применение в приложениях React ⚡️
Концепция локализации и ее применение в приложениях React ⚡️
Локализация - это процесс адаптации приложения к различным языкам и культурным требованиям. Это позволяет пользователям получить опыт, соответствующий...
Навигация по приложениям React: Исчерпывающее руководство по React Router
Навигация по приложениям React: Исчерпывающее руководство по React Router
React Router стала незаменимой библиотекой для создания одностраничных приложений с навигацией в React. В этой статье блога мы подробно рассмотрим...
Массив зависимостей в React
Массив зависимостей в React
Все о массиве Dependency и его связи с useEffect.
2
3
1 892
1
Перейти к ответу Данный вопрос помечен как решенный

Ответы 1

Ответ принят как подходящий

Вы получаете сообщение «Далее: не найдено» на сервере развертывания, поскольку команда npm install не была выполнена на сервере развертывания и зависимости там не были установлены. Принимая во внимание, что команда сборки успешна в локальной системе, поскольку зависимости там уже доступны.

Чтобы это исправить, замените приведенную ниже строку в package.json.

"build": "next build",

с

"build": "npm i && next build",

Это гарантирует, что команда npm i (install) будет выполняться на сервере развертывания всякий раз, когда вы развертываете новые изменения.

Другие вопросы по теме