next.js 相关问题

为什么刷新后本地存储会被删除？

在 Next.js 中我使用以下代码： const [card, setcard] = useState([]); 使用效果（（）=> { localStorage.setItem('items', JSON.stringify(card)); }， [卡片]）; 使用效果（（）=> { 合作...

[project]/src/styles/globals.css 中出现意外标记 Delim('$')

我正在使用 Nextjs 和 TailwindCSS。我尝试使用 AceternityUI 库组件，并认为这会导致此错误。或者可能不是？ 您可以参考 AceternityUI 的安装文档

如何在NextJS的应用程序目录中创建加载指示器或进度条？

我用 NextJS 13 开发了一个大型 Web 应用程序，第一个版本是使用 Pages Router。 完成几乎整个网站后，我设法迁移到应用程序目录。 这个

处理完成后从服务器检索数据

正如标题所述，我正在尝试在处理完成后从服务器检索数据。更具体地说，我试图将处理后的数据传输到我的前端。 背景：文档...

NextJS 和 Firebase 托管 - 直接访问动态路由，在生产环境中重定向到 index.js

我还没有找到任何关于此行为的文档，但这里是...... 基本上我已经建立了一个index.js页面和一个动态[address].js页面。 我在这里面临的问题是，每当我访问...

Nextjs 动态路由在 Firebase 托管中不起作用

我有一个动态路由器作业/[jobId]，但托管后它不起作用。我也不知道如何为此在 firebase.json 中编写重写。这是我的重写。 目前，如果我

NextJS 与 App Router：返回 403/500 错误的正确方法是什么

我在文档中可以找到的最好的方法是使用这个： return NextResponse.json({ error: 'Internal Server Error' }, { status: 500 })。然而，在使用中，这只是返回字符串“{”error”：&q...

如何在 Next.js 应用程序路由器中使用媒体查询？

我将 Next.js 13 与 App Router 结合使用，并具有以下客户端组件，该组件使用 JavaScript 内的媒体查询为小/大屏幕以不同方式显示侧边栏。 “使用c...

嵌入式 Unity 游戏未构建，错误消息：HTTP 连接可能不支持 Brotli 压缩

为了测试未来的项目，我创建了一个 Unity 游戏，我想将其托管在我的 Next.js 网站上。我从 Unity 下载了 WebGL，并将游戏文件放在 Public 中......

Next.js 14 favicon.ico 文件未显示在 chrome 中

只需替换 favicon.ico 即可，chrome 无法显示。这似乎是一个错误。我使用应用程序路由器。 /-应用程序 /-favicon.ico 我发现很多人都遇到过这个问题，我找到了如何解决这个问题...

服务器对客户端组件的操作作为 prop TS 警告

当我将服务器操作传递到客户端组件时，我收到 TS 警告。它不会给出编译错误，因此我可以忽略，但我更愿意摆脱警告。 TS71007：道具必须是

如何在服务器操作中访问国际化

我已按照此处提供的官方指南在 Next.js 14 应用程序中实现了国际化：https://nextjs.org/docs/app/building-your-application/routing/internationalization。

如何在 NextJS 中将 svgr 与 webpack 和 TypeScript 一起使用

我将 svg 文件存储在单独的文件中。我想将它们加载到 React 中并用作 React 组件，如下所示： 从 '@/components/editor/icons/add-column-after.svg' 导入 SampleIcon； 我有 svg 文件存储在单独的文件中。我想将它们加载到 React 中并用作 React 组件，如下所示： import SampleIcon from '@/components/editor/icons/add-column-after.svg'; <SampleIcon className="my-icon" /> 我安装了svgr并在next.config.js中使用，如下： webpack: (config) => { // SVG // Grab the existing rule that handles SVG imports const fileLoaderRule = config.module.rules.find((rule) => rule.test?.test?.('.svg') ); config.module.rules.push( // Reapply the existing rule, but only for svg imports ending in ?url { ...fileLoaderRule, test: /\.svg$/i, resourceQuery: /url/, // *.svg?url }, // Convert all other *.svg imports to React components { test: /\.svg$/i, issuer: fileLoaderRule.issuer, resourceQuery: { not: [...fileLoaderRule.resourceQuery.not, /url/] }, // exclude if *.svg?url use: [ { loader: '@svgr/webpack', options: { typescript: true, ext: 'tsx', }, }, ], } ); // Modify the file loader rule to ignore *.svg, since we have it handled now. fileLoaderRule.exclude = /\.svg$/i; return config; }, 它可以工作，但智能感知不起作用，即 SampleIcon 具有 any 类型。我尝试在根目录中创建 declarations.d.ts 文件并将其添加到 tsconfig.json 列表中的 include 中，但效果不佳。这是我的宣言： declare module '*.svg' { import React from 'react'; const SVG: React.VFC<React.SVGProps<SVGSVGElement>>; export default SVG; } 有什么想法吗？ 这很尴尬，但经过 2 小时的搜索后，我解决了这个问题： 确保 declarations.d.ts 文件位于 globals.d.ts 中的全局 tsconfig.json 文件之前： 错❌： "include": [ "next-env.d.ts", "declarations.d.ts", ... ] 正确✅： "include": [ "declarations.d.ts", "next-env.d.ts", ... ]

在 Next.js 电子商务应用程序中存储图像的最佳实践是什么

我正在为一个电子商务网站开发 Next.js 项目，并且正在探索存储产品图像的最佳选项。我想到了两种主要方法，我很想得到一些建议......

我需要在基于 cookie 的 API 中使用 CSRF 令牌吗？

如果您正在寻找原始帖子，请点击下面我的个人资料图片旁边的蓝色“编辑[日期]”按钮。 由于 Stack Overflow 决定合作，我删除了这篇文章...

Nextjs 公共文件夹

nextjs 项目的公共文件夹在哪里？ 我的意思是，有没有地方可以放置 favicon.png、google 站点验证、manifest.json、robots.txt 等？

“url”参数有效，但上游响应无效

我正在为下一个js项目使用remotive api（https://remotive.com/api/remote-jobs）。在此api中，有一个指向公司徽标的URL。 我这样用它 我正在为下一个js项目使用remotive api（https://remotive.com/api/remote-jobs）。在此api中，有一个指向公司徽标的URL。 我就是这样用的 <Image src={'https://remotive.com/job/1912073/logo'} className="w-6 aspect-square" alt="" width={18} height={18} /> 并在配置文件中 /** @type {import('next').NextConfig} */ const nextConfig = { images: { remotePatterns: [ { protocol: 'https', hostname: 'remotive.com', port: '', pathname: '/job/**', // Matches any path under /job/ }, ], }, }; export default nextConfig; 但是出现错误.. ⨯ 上游图像响应失败 https://remotive.com/job/1912073/logo 403.. 我正在使用“下一个”：“^14.2.3”， “反应”：“^18.3.1” 任何解决方案。 查了很多网站都没有找到解决办法 此网址首先由 cloudflare 进行安全验证。这就是它返回 403 的原因。检查主机不需要任何验证的任何其他图像链接。

Next.js CSS 文件冲突

我是 Next.js 的新手，所以我正在寻找解决我的问题的方法并同时寻求建议。 问题： -在空 URL（只是 localhost:8081）上，我有一个登录表单，可以选择切换到

无法在 Next.js 14 中使用 GitHub OAuth 提供程序使 Auth.js 正常工作

我使用的是 Next.js 14.2.1 和最新版本的 Auth.js。 我正在遵循 GitHub 提供商的文档指南：https://authjs.dev/guides/configuring-github 根据文档，我添加了 j...

接下来的 14 个中间件保护登录页面在经过身份验证时不起作用

我想在用户通过身份验证时保护登录页面 URL：http://localhost:3000/authentication/signin。但是，在我的中间件中，当我有权访问并刷新时，我想重定向 u...