nexjts 应用程序已部署,但在部署的服务器上损坏

问题描述 投票:0回答:1

我正在 Render 上运行 nextjs 14 应用程序。 我设法解决了所有问题,并且应用程序构建得很好。 在本地它构建得非常好并且工作得很好。

我现在遇到的问题如下。 无论我打开哪个页面,它似乎都不会加载 .next/ 文件夹中的任何静态资源。 我不知道下一步该做什么,我尝试了几乎所有我能想到的东西,但由于我是 Next 的新手,除了所有标准的东西之外,我能想到的东西并不多。

我检查了链接是否正常,似乎文件夹和链接路径是相关的。 此外,由于某种原因,它似乎不会加载 js 或 css 文件,而我确实可以看到它们正确地位于 .next/.../ 文件夹中。

部署网站的链接位于:https://united-media-dashboard.onrender.com

我不确定我应该在这里提供什么来更容易地确定为什么会发生这种情况,所以这就是我认为可能相关的内容。

package.json

{
  "name": "unitedmedia-dashboard-watch-statistics",
  "version": "0.1.0",
  "type": "module",
  "private": true,
  "scripts": {
    "dev:docker": "docker compose up",
    "dev:database": "docker compose up postgres",
    "dev:inspect": "NODE_OPTIONS='--inspect' pnpm dev",
    "dev": "next dev",
    "build": "next build",
    "start": "node .next/standalone/server.js",
    "lint": "next lint",
    "type-check": "tsc --pretty --noEmit",
    "prettier:check": "prettier --check .",
    "prettier:fix": "prettier --write .",
    "migrate:dev": "prisma migrate dev",
    "migrate:deploy": "prisma migrate deploy",
    "prisma:generate": "prisma generate",
    "prisma:studio": "prisma studio",
    "prisma:seed": "prisma db seed",
    "postinstall": "prisma generate",
    "prepare": "husky install"
  },
  "dependencies": {
    "@hookform/resolvers": "^3.3.4",
    "@prisma/client": "5.12.1",
    "@radix-ui/react-checkbox": "^1.0.4",
    "@radix-ui/react-dialog": "^1.0.5",
    "@radix-ui/react-dropdown-menu": "^2.0.6",
    "@radix-ui/react-icons": "^1.3.0",
    "@radix-ui/react-label": "^2.0.2",
    "@radix-ui/react-popover": "^1.0.7",
    "@radix-ui/react-select": "^2.0.0",
    "@radix-ui/react-slot": "^1.0.2",
    "@radix-ui/react-toast": "^1.1.5",
    "@t3-oss/env-nextjs": "^0.9.2",
    "@tailwindcss/typography": "^0.5.12",
    "@types/country-flag-icons": "^1.2.2",
    "chart.js": "^4.4.2",
    "chartjs-plugin-annotation": "^3.0.1",
    "chartjs-plugin-crosshair": "^2.0.0",
    "chartjs-plugin-zoom": "^2.0.1",
    "class-variance-authority": "^0.7.0",
    "clsx": "^2.1.0",
    "country-flag-icons": "^1.5.11",
    "csv-parser": "^3.0.0",
    "date-fns": "^3.6.0",
    "fs": "0.0.1-security",
    "lucide-react": "^0.364.0",
    "ms": "^2.1.3",
    "next": "14.1.4",
    "react": "^18",
    "react-chartjs-2": "^5.2.0",
    "react-day-picker": "^8.10.0",
    "react-dom": "^18",
    "react-hook-form": "^7.51.2",
    "sharp": "^0.33.3",
    "tailwind-merge": "^2.2.2",
    "tailwindcss-animate": "^1.0.7",
    "tsx": "^4.7.2",
    "zod": "^3.22.4",
    "prisma": "^5.12.1",
    "husky": "^8.0.0",
    "tailwindcss": "^3.4.3",
    "autoprefixer": "^10.4.19",
    "typescript": "^5.4.3",
    "@types/chartjs-plugin-crosshair": "^1.1.4",
    "@types/ms": "^0.7.34",
    "@types/node": "^20.11.30",
    "@types/react": "^18.2.73",
    "@types/react-dom": "^18.2.23",
    "eslint": "^8.57.0",
    "eslint-config-next": "14.1.4",
    "eslint-config-prettier": "^9.1.0",
    "postcss": "^8.4.38"
  },
  "devDependencies": {
    "lint-staged": "^15.2.2",
    "prettier": "3.2.5",
    "prettier-plugin-organize-imports": "^3.2.4",
    "prettier-plugin-tailwindcss": "^0.5.13"
  },
  "prisma": {
    "seed": "tsx prisma/seed.ts"
  },
  "lint-staged": {
    "*.{ts,tsx,js,jsx,cjs,json,css,md}": [
      "prettier --write",
      "git add"
    ]
  }
}

next.config.js

import './src/env.js';

/** @type {import("next").NextConfig} */
const config = {
  output: 'standalone',
};
export default config;

它现在让我发疯,因为我不知道下一步该做什么,而且在线文档在这种情况下没有多大帮助。

最后,这是我在控制台中收到的错误 - 它指的是徽标和其他一些资产。

WARNING[GET]404united-media-dashboard.onrender.com/_next/static/chunks/f923c8e2-299bfb92abce4211.jsclientIP="86.32.79.33" requestID="0919b7ec-2317-43e0" responseTimeMS=362 responseBytes=2901 userAgent="Mozilla/5.0 (Macintosh; Intel Mac OS X 10_15_7) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/123.0.0.0 Safari/537.36"
WARNING[GET]404united-media-dashboard.onrender.com/_next/static/chunks/992-a5ed438dcc2c3a39.jsclientIP="86.32.79.33" requestID="2d00e965-6c15-46f8" responseTimeMS=292 responseBytes=1008 userAgent="Mozilla/5.0 (Macintosh; Intel Mac OS X 10_15_7) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/123.0.0.0 Safari/537.36"
WARNING[GET]404united-media-dashboard.onrender.com/_next/static/chunks/app/dashboard/layout-865593bb7b068117.jsclientIP="86.32.79.33" requestID="f80b7d39-0dd9-4683" responseTimeMS=376 responseBytes=3158 userAgent="Mozilla/5.0 (Macintosh; Intel Mac OS X 10_15_7) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/123.0.0.0 Safari/537.36"
INFO[GET]304united-media-dashboard.onrender.com/dashboardclientIP="86.32.79.33" requestID="09b26e22-583f-4298" responseTimeMS=4 responseBytes=0 userAgent="Mozilla/5.0 (Macintosh; Intel Mac OS X 10_15_7) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/123.0.0.0 Safari/537.36"
WARNING[GET]404united-media-dashboard.onrender.com/_next/static/media/6d664cce900333ee-s.p.woff2clientIP="86.32.79.33" requestID="9d16e9bd-0d74-4a5a" responseTimeMS=299 responseBytes=1008 userAgent="Mozilla/5.0 (Macintosh; Intel Mac OS X 10_15_7) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/123.0.0.0 Safari/537.36"
WARNING[GET]404united-media-dashboard.onrender.com/_next/static/chunks/254-13e432276ffed8fc.jsclientIP="86.32.79.33" requestID="b0bbcabf-d7f8-474c" responseTimeMS=298 responseBytes=1008 userAgent="Mozilla/5.0 (Macintosh; Intel Mac OS X 10_15_7) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/123.0.0.0 Safari/537.36"
INFO ⨯ The requested resource isn't a valid image for /_next/static/media/united-logo.e568e235.png received text/html; charset=utf-8

这也是 shell 中的项目列表:

render@srv-coh93qf79t8c73fvc0hg-5d9f8d8765-26csb:~/project/src/.next$ cd static
render@srv-coh93qf79t8c73fvc0hg-5d9f8d8765-26csb:~/project/src/.next/static$ ls
K8DAbg69X2yxP6iIh4nBJ  chunks  css  media
render@srv-coh93qf79t8c73fvc0hg-5d9f8d8765-26csb:~/project/src/.next/static$ ls -la
total 24
drwxr-sr-x 6 render render 4096 Apr 20 00:19 .
drwxr-sr-x 7 render render 4096 Apr 20 00:20 ..
drwxr-sr-x 2 render render 4096 Apr 20 00:19 K8DAbg69X2yxP6iIh4nBJ
drwxr-sr-x 4 render render 4096 Apr 20 00:19 chunks
drwxr-sr-x 2 render render 4096 Apr 20 00:19 css
drwxr-sr-x 2 render render 4096 Apr 20 00:19 media
render@srv-coh93qf79t8c73fvc0hg-5d9f8d8765-26csb:~/project/src/.next/static$ cd css
render@srv-coh93qf79t8c73fvc0hg-5d9f8d8765-26csb:~/project/src/.next/static/css$ ls
feeef8ef8e91f5ae.css
render@srv-coh93qf79t8c73fvc0hg-5d9f8d8765-26csb:~/project/src/.next/static/css$ cd ..
render@srv-coh93qf79t8c73fvc0hg-5d9f8d8765-26csb:~/project/src/.next/static$ ls
K8DAbg69X2yxP6iIh4nBJ  chunks  css  media
render@srv-coh93qf79t8c73fvc0hg-5d9f8d8765-26csb:~/project/src/.next/static$ cd chunks/
render@srv-coh93qf79t8c73fvc0hg-5d9f8d8765-26csb:~/project/src/.next/static/chunks$ ls
214.1424e8057e362f8f.js       658-f84f4ecdec402293.js  90234aad-4ae0e29179386fa9.js  framework-c25027af42eb8c45.js  webpack-2fef9b73f9c71af9.js
254-13e432276ffed8fc.js       664-84f0fa31f1da2123.js  992-a5ed438dcc2c3a39.js       main-app-5583196019ffb52a.js
2b07ace6-226c48d4518d6d8e.js  672-c5b93566efc7c0fe.js  app                           main-d8a13b79515d4ca8.js
496-97fa8314988d35b6.js       730-50396ce1a6ab1f06.js  f0cfecc8-081f8fd0371214a0.js  pages
544-4b7d64b4bc18772a.js       770-4b8f34dcd0af2a77.js  f923c8e2-299bfb92abce4211.js  polyfills-c67a75d1b6f99dc8.js
render@srv-coh93qf79t8c73fvc0hg-5d9f8d8765-26csb:~/project/src/.next/static/chunks$ cd ..
render@srv-coh93qf79t8c73fvc0hg-5d9f8d8765-26csb:~/project/src/.next/static$ ls
K8DAbg69X2yxP6iIh4nBJ  chunks  css  media
render@srv-coh93qf79t8c73fvc0hg-5d9f8d8765-26csb:~/project/src/.next/static$ cd media
render@srv-coh93qf79t8c73fvc0hg-5d9f8d8765-26csb:~/project/src/.next/static/media$ ls
162938472036e0a8-s.woff2  4de1fea1a954a5b6-s.p.woff2  6d664cce900333ee-s.p.woff2  f1df658da56627d0-s.woff2  united-logo.e568e235.png

我尝试删除一些路线,认为我所做的事情导致了这种行为,但它没有帮助,问题仍然存在。 此外,我已将一些我认为可能与应用程序相关的部分从 devdEpendency 移至依赖项。

next.js deployment next.js13 render.com
1个回答
0
投票

如果您遇到像我一样的问题,解决方案是不要运行

next start

"start": "node .next/standalone/server.js",

但只需正常运行即可:

    "start": "next start",

它会在构建过程中抛出警告:

"next start" does not work with "output: standalone" configuration. Use "node .next/standalone/server.js" instead.

但你可以放心地忽略它,它会起作用的。 另外,如果您遇到困境,是否应该运行独立服务器(它在没有node_modules的情况下运行),那么您可以查看以下内容:https://nextjs.org/docs/app/api-reference/next-config-js/output #自动复制跟踪文件

© www.soinside.com 2019 - 2024. All rights reserved.