我需要在应用程序中使用Next.js进行多个导游 我试着在父组件中使用joyride来显示导游 它会出现一秒钟，然后向下滚动到不可见的地方，即使我滚动到底部 我尝试了一些修复方法，如： 车身{最小高度：100%；} 但它仍然不起作用 以下是配置步骤： steps: [ { target: document.getElementById('step-1'), content: 'This is my awesome feature!', title: '

我正在尝试将next.js应用程序部署到netlify并尝试获取输出文件夹，但当我运行“npm run build”时，会出现如下错误：错误：>由于网页包错误，生成失败 在构建时（C:\Users\Owner\Desktop\port\u frontend\node\u modules\next\dist\build\index.js:15:918）再次尝试安装软件包，您无法更新最新版本 npm install npm run build 或 将import next/App更改为小写，它对我

通过执行以下操作，我有了基本的Prism.js功能，可以使用我的Next.js站点： package.json "dependencies": { ... "next": "9.5.3", "react": "16.13.1", "typescript": "3.9.4", "prismjs":

我在使用keystonejs为下一个js应用程序提供服务时遇到问题。我想在创建keystone项目时获得类似于to do nuxt示例的东西，您可以选择它。我在index.js文件中使用了此链接中的代码，但在尝试运行应用程序时出错： ReferenceError:对象上未定义distDir 我该怎么办？这是我的设置 创建app文件夹（下一个js代码） 在app文件夹中创建next.config.js 我的next.js.config文件包含以下代码 const distDir = 'dist';

我是Next.JS的新手，我想知道是否有可能优化一些CMS中的图像，在这些CMS中，帖子的内容以HTML形式发送，并且可以包含图像？如果是这样的话，你会怎么做呢？我想你应该用react markdown看看

我有一个关于Next.js静态生成的问题： 我正在为我的客户创建白标签网站；这意味着我正在读取请求来自的域，以加载一个配置文件和一些特定的CSS文件。这很好，看起来像这样： export const readConfig = async ({req}) => { const configs = await import('../configs.json') const domain = req ? req.headers['host'].split(':')[0] : window

我正在使用NextJS和Workbox创建PWA，以及我需要的此库的脱机支持：。我在上面的回购协议中需要一个例子：离线回退。我不需要应用程序在离线模式下完全工作，只需要一个显示连接丢失的回退页面 我阅读了关于全面回退的workbox部分： 有一个catchHandler，当任何其他路由无法生成响应时会触发，但问题是我在捕获XMLHttpRequests（XHR）错误时遇到了巨大的困难 例如，当客户端将请求发送到API时，如果没有internet连接，我希望呈现一个回退页面。如果失败的请求是“文档

有没有办法选择要部署的自定义分支？ 我似乎无法选择一个分支，它采用默认的主分支 提前感谢Vercel会自动部署您推送到分支的任何提交 您还可以在项目设置中自定义用作生产分支的分支： Vercel会自动部署推送到分支的任何提交 您还可以在项目设置中自定义用作生产分支的分支： 似乎无法通过手动功能触发此操作。只有支持将分支推送到github repos才能工作。无法理解此设计。似乎无法通过手动功能触发此操作。只有支持将分支推送到github repos才能工作。我不明白这个设计。

我尝试了strapi和next.js来创建一个博客网站。下面是next.js的前端代码 从“下一个/头部”导入头部 从“../styles/Home.module.css”导入样式 导出默认函数Home（{posts}）{ 返回( {职位&& posts.map（（posts）=>( {posts.title} ))} ); } 导出异步函数getstaticProps（）{ //从我们的API获取帖子 const res=等待获取（“http://localhost:1337/posts")

我正在尝试使用next auth为我的应用程序设置身份验证，现在我需要在pages目录的'-app'页面中包含{Providers}。代码应该是这样的，因为我将子元素包装在布局组件中： 从“../components/Layout”导入布局； 导入“../styles/globals.css”； 函数MyApp（{Component，pageProps}）{ 返回( ) } 导出默认MyApp 您遇到了什么错误？

我在next.js中有以下错误，我是一个初学者，无法理解这个问题，有人能帮我吗 我找不到我需要做什么来修复它，我已经尝试了很多方法，但仍然有相同的错误 我得到的错误： Server Error Error: Invalid src prop (blob:http://localhost:3000/850a9a8b-591d-42f9-8d9d-8bb3e6c7cd94) on `next/image`, hostname "" is not configured under

我正在尝试使用SanityAlgolia库（ref）将algolia搜索与SanityCMS集成 但是当我尝试使用pt:：text函数从可移植文本富文本内容中获取纯文本时。 我在对象体之后得到了预期的'}'，我真的不知道我在哪里遗漏了一个括号 （另一个注意事项：由于我使用sanitystart托管sanity，因此我使用nextjs（我的前端）来运行函数，而不是使用nextjs中的/api路由），因此sanity有一个指向此路由的webhook 有关错误的详细信息： details: {

我正在使用nextjs和这个示例 在next.config.js中，我有代码： module.exports = { async exportPathMap(defaultPathMap, { dev, dir, outDir, distDir, buildId, incremental }) { // we fetch our list of posts, this allow us to dynamically generate the exported pages co

我正在尝试在Next.js next.config.js const TsconfigPathsPlugin = require("tsconfig-paths-webpack-plugin"); const withSass = require('@zeit/next-sass'); module.exports = withSass({ target: 'serverless', env: { DEPLOY_STAGE: stage, // How can I set thi

大家好，有人能帮助我们进行NextJSV10构建吗？它构建时没有样式：| 这是我的package.json和next.config.js 我在_app.js中导入所有样式，它也在chrome network->preview中提供，没有样式 在vercel上一切正常，但当我尝试在我的计算机上构建时，它没有样式：| ** next.config.js ** package.json { "name": "mine", "version&qu

我正在尝试将Facebook messenger聊天机器人添加到我的NextJs应用程序中。在安装过程中，Facebook要求我将此代码段添加到我的网站 window.fbAsyninit=函数（）{ FB.init({ xfbml：是的， 版本：“v9.0”， }); }; （功能（d、s、id）{ var js， fjs=d.getElementsByTagName[0]； if（d.getElementById（id））返回； js=d.createElement； js.id=id；

因此，我基于NextJS示例构建了下一个应用程序，这意味着我有GraphQL路由和一个Apollo服务器，用于从应用程序中的API获取数据。该示例显示了如何获取getStaticProps（），这对我来说很好，但我需要实现getServerSideProps（），因为提供的内容取决于URL查询和参数，它们最多有6000个不同的URL，所以我不能使用getStaticPaths（）。该代码在开发模式下运行完全正常。。。然而，当部署到Vercel时，它在开始时工作，有时在以后工作，但在页面上显示50

我想从React切换到Next.js，但有一个问题。我正在使用react上下文创建一个全局状态，并用它包装我的应用程序 在Next.js中测试不起作用，包装_app.js组件会在页面切换中重新创建我的状态 基本示例： //provider export const Store = createContext(null); _app.js <Store.Provider value={{}}>...Component...</Store.Provider/> //提供程

我正在启动一个Hasura项目，并且看到应用程序的前端将使用Next.js，我还计划使用API路由来处理Hasura和 我遇到了一个非常好的NestJS库，名为，它为处理Hasura事件提供了一个起点，使您的API成为创建事件触发器时的真实来源 有没有人知道类似的库或样板可以让我在引导一些合理的、经过半战斗测试的东西方面有一个开端？在观看了@golevelup/nestjs-hasura-dev的视频后，我很想尝试一下nestjs，但我觉得这将是一个完全的兔子洞，我渴望开始使用Next.js A

已创建next.js完整堆栈应用程序。在生产构建之后，当我运行下一个start时，它返回500:internalserver。我使用环境变量来实现api env.development file BASE_URL=http://localhost:3000 它在开发中运行良好 服务台 import axios from 'axios'; const axiosDefaultConfig = { baseURL: process.env.BASE_URL, // is this line

我遵循了教程，进入了最后一节，你把博客文章放在一个页面上，页面最后只有一个H1标签，没有一篇文章，有人能看一下代码并告诉我为什么它可能不起作用吗 import Link from 'next/link' import groq from 'groq' import client from '../client' const Index = (props) => { const { posts = [] } = props return ( <div>

我正在从事一个项目，在这个项目中，我们使用带有NextJS的样式化组件进行服务器端渲染。我们使用一个包含在多个定制项目中的私有包。这个私有包包含样式，但在某些项目中，我们希望用自定义样式覆盖样式，如下面的代码所示。这似乎与组件选择器${H1}无法找到实际的H1组件有关。为什么会这样 私有包中的代码： const baseHeading = css` font-family: ${(props) => props.theme.fonts.sec}; display: bloc

我正在使用auth0库处理next.js应用程序的注册和身份验证。我还使用它来处理输入数据和验证。我希望通过Formik将电子邮件地址提交到Next.js api路由 当我使用Nextjs的useRouterhook通过router导航时。将推送到api路由，它会按预期工作，因此我的数据会传递到api路由，Nextjs-auth0会按预期重定向用户。但是，在重定向浏览器控制台之前，会闪烁以下错误： 我应该忽略这个错误吗？有没有可能，router.push只用于客户端重定向？我正在尝试导航到一个

我将next-i18next模块用于多语言应用程序。我不明白为什么会出现以下错误，因为我已经按照文档中显示的方式声明了名称空间 错误消息： 您尚未在页面级组件Home上声明名称空间所需的数组。 这将导致所有名称空间向下发送到客户端，可能会对应用程序的性能产生负面影响。 有关详细信息，请参阅：https://github.com/isaachinman/next-i18next#4-声明命名空间依赖项 index.ts 从“下一个/头部”导入头部 从“../styles/Home.module.

下一次生成发生错误 ReferenceError: location is not defined at Object.<anonymous> (/PATH/node_modules/next/dist/client/performance-relayer.js:1:135) at Module._compile (internal/modules/cjs/loader.js:1063:30) at Object.Module._extensions..js

我对nextJS有一个奇怪的问题 我在根文件夹中创建了新的目录components，并添加了一些测试组件文件 当我尝试导入它时，pass存在，但在localhost上我有一个错误： Module not found: Can't resolve '../../components/admin/AdminBoLayout' 路径正确，组件可以100%工作（用另一个nextJs项目测试了此代码） 为什么会出现问题？ 另据介绍，组件目录存在于nextJs项目结构中 已解决：只需在终端中执行Ctrl+

我一直在努力寻找一个可行的解决方案，但在谷歌上找不到任何可靠的东西。我正在Vercel上托管下一个.js应用程序 当我运行seo检查时，它抱怨我的网站在www和非www上都可用，并说我应该选择一个并让它重定向，所以在我的情况下，如果有人输入，我更希望它离开www 既然我没有htaccess文件，我可以在中执行此操作，我将如何执行此操作 不确定这是否重要，但我正在使用WordPress作为我的后端，也就是：Headless WordPress我建议您通读一下。@juliomalves谢谢您。但这是

我们可以在next.js中使用“METRONICS”UI框架吗？目前，next.js不支持它

如果我在我的next.js项目中生成生产js包，它就不会缩小 例如，不会删除白色字符 package.json { "name": "web", "version": "0.1.0", "private": true, "scripts": { "web": "cross-env NODE_ENV=development

如何在链接之前添加空格？当然没有CSS Please check if you agree with our <Link href="/[slug]" as="/privacy-policy/"> <a>Privacy policy</a> </Link> 您可以像这样插入一个空格： Please check if you agree with our {" "} <Link href="/[slug]" as="/privac

我有一个组件，它是应用程序中所有页面的默认布局。我希望此组件读取特定目录并链接组件中的现有文件。非常清楚，我正在使用目录中的可用文件动态生成页面 现在的问题是，我的这个组件不在/pages文件夹中，在这个目录之外使用getStaticProps是受到限制的 import { getSortedPageData } from '../lib/pages' export async function getStaticProps() { const allPagesData = getS

假设我有一个名为utils.js的文件，其中包含两个函数s和c。 s是一个服务器端函数（在/api端点处理程序上调用），使用mongodb包。 c是客户端功能（将被捆绑并发送到浏览器） 使用下一版本编译应用程序时，是否会导致任何问题？ webpack是否知道仅捆绑文件/模块的一部分？（将服务器端函数和导入视为“死代码”，因为它们仅从服务器端代码调用） 谢谢我认为会有错误，但不会出现在构建时。很可能会在运行时发生问题。您将无法访问客户端的文件系统，就像无法访问服务器端的窗口对象一样 在我当前的项目

我尝试在下一个js项目中实现动态导入 import dynamic from 'next/dynamic' import Link from 'next/link' import { GetStaticProps, GetStaticPaths, GetServerSideProps } from 'next' function getRandomInt(max) { return Math.floor(Math.random() * Math.floor(max)); } expo

我基本上遵循了这里的教程，使用了这个Next.js插件，但是当我尝试添加一个扩展名为.tsx或.ts的模板文件，或者引用模板文件中的另一个组件，即.tsx或.ts时，我会收到一个错误，说“找不到模块”。我可以不在模板中使用其他.tsx文件，例如，我可以将其用于页面或组件，而不是模板中的引用 next.config.js文件： constwithplugins=require（'next-compose-plugins'）； const rehypePrism=require（'@mapbox/r

我正在开发一个多页网站，前端使用Next.js，后端使用Strapi。在博客页面上，数据是从数据库动态获取的。我正在尝试使用砌体以自适应布局显示此数据 我遇到的问题是，在第一次加载时，页面在单个垂直列中显示每个网格项。重新加载时，砌体布局将生效，但会出现一些重叠项。在第二次重新加载时，所有内容都会正确显示，甚至响应良好。然而，如果我离开页面返回，它就会回到原点 以下是博客页面的代码： import React from 'react'; import Layout from '../compon

我尝试在next.js 9.x应用程序中设置GraphQL订阅。该应用程序完全是假的，只是为了尝试阿波罗服务器订阅。“数据库”只是一个数组，我把新用户推到其中 这是我到目前为止得到的密码 import { ApolloServer, gql, makeExecutableSchema } from "apollo-server-micro" import { PubSub } from "apollo-server" const typeDefs = gql` type User {

我目前在部署Next.js应用程序时遇到了一个问题。在遵循netlify博客中关于如何使用netlify for Next.js创建服务器端渲染应用程序的指南之后，我成功地构建了一个应用程序，但我的网站似乎无法正常工作 该网站目前位于。错误消息将粘贴在下面 { "errorType": "Runtime.UnhandledPromiseRejection", "errorMessage": "FetchError: reque

我是Next.js新手。我正在使用此命令创建我的应用程序： npx create-next-app 但它给出了一个错误，即： 错误：EPERM:不允许操作，mkdir'C:\Users\danyyal' 未找到命令：创建下一个应用程序 如何创建应用程序？p、 我已经安装了nodejs。您可以随时手动设置项目 步骤1： 在项目中安装next、react和react dom： npm install next react react-dom 步骤2： 打开package.json并添加以下脚本：

单击next.js中的按钮后，我想在url参数中添加数据 函数send（）{ 路由器推送( {路径名：“/”，查询：{n:“firstparam，secondparam”}， 未定义， { 肤浅：是的 } ); }%2C是，的url编码，Next.js所做的是正确的，因为，不是有效字符 console.log（encodeURIComponent（'，）%2C是，的url编码，Next.js所做的是正确的，因为，不是有效字符 console.log（encodeURIComponent（'

我得到了Uncaught（承诺中）错误的预处理响应：错误的预处理响应：：[{“url”：”https://myapp.vercel.app/_error“，“status”：404}]在vercel中部署我的应用程序时，我的下一个pwa应用程序和service worker不起作用，尽管它在localhost中运行良好，没有错误。 在这里，我遵循了基本用法，但我使用firebase-messaging-sw.js来使用云消息传递以及pwa的sw.js（服务工作者）。目前我还没有_error.js

我正在用next.js构建一个英语-阿拉伯语应用程序，希望用户能够在两种语言之间切换。 我在next.js中找到了这个示例：。它使用StylesRTPlugin，可翻转所有CSS样式以适应RTL布局： /\u document.js 它工作正常，但问题是我无法根据当前的区域设置有条件地删除StylesRTLplugin，因为我无法访问\u document.js中的useRouter（） 我希望能够做到的是： 将此配置添加到.babelrc以强制在服务器上呈现样式 "plugin

我有一个用例，在这个用例中，我必须向根元素添加一个类，它可能是body，也可能是SSR中的next。需要根据getInitialProps响应有条件/动态地添加该类。 我想知道在Next.js的当前状态下是否可以这样做 从“React”导入React； 从“next/document”导入NextDocument，{Html，Head，Main，NextScript}； 类文档扩展了下一个文档{ 静态异步getInitialProps（ctx）{ const initialProps=wait

能否为NextJS中的Head组件设置一个默认值，其他页面将从中扩展 在我的情况下，我需要在每个页面上加载字体： <Head> <link href="path-to-font" rel="stylesheet" /> </Head> 我可以用自定义文档文件来实现这一点，但是Head的默认值似乎更简单 如果标题不需要经常更改，可以采用自定义文档方法。但是，如果您希望事物是动态的，比如不同页面的不同标题，我建

我想在chakra ui中自定义全局样式，以便将我的所有元素框大小更改为边框框！ 这是对我的审判。但是什么也没发生 import { extendTheme } from '@chakra-ui/react'; const overrides: object = { styles: { global: { '*': { boxSizing: 'border-box', }, }, }, }; export default ex

我是新来的。每当我点击链接时，它都会更新URL，但页面不会显示任何数据。但元素数据是存在的 以下是导航文件的代码： 我更新了问题。数据存在于“Elements”chrome开发工具中，但未显示在页面上要澄清的是，当您单击导航中的“Blog”链接时，浏览器将导航到/Blog页面，但您无法看到Blog标题？你能分享你的页面文件夹结构吗？是的，没错。我如何在这里分享照片？还有一件事，更多的主页工作正常，只有博客、服务等其他页面没有显示。我再次更新了这个问题。你是否应用了一些CSS来隐藏一些元素

我正在尝试使用SSR在NextJS上运行一个简单的DOM脚本。 我知道DOM不能与SSR一起使用，并且我在变量“menu”上收到一个未定义的错误 只是想知道是否有人可以澄清这一点，我将如何使用挂钩？我不熟悉React和NextJS，但仍然没有完全掌握挂钩 <div className={styles.menuCon} onClick={menu()} > <div></div> <div></div> <div><

一项服务在云计算运行的最后12个小时内运行，但在第一个小时后未发送任何请求。我了解到，在FAQ中将服务缩放为零之前，没有可预测的时间范围，但我假设10小时后，云运行仪表板中的服务名称上的绿色勾号应该消失，因为它还表示过去10小时内的0请求/秒 服务位于新的自定义域后面 从日志中，我可以看到下面间歇性的请求——好像爬虫在发出一些请求——是服务没有扩展到零的原因吗 2019-05-04T01:57:10.661674ZGET200 764 B 4 ms Mozilla/5.0 (compatible

我正在寻找一种方法，根据另一个env变量的值引用一组不同的秘密（env变量） i、 e. if（process.env.STAGE==“test”）返回配置=process.env.test\u配置 我知道自动化github部署有 但是我如何正确地引用它们呢？例如： const config=process.env.NOW\u GITHUB\u COMMIT\u REF==='master'？prod:dev 不适合我 （NOW\u GITHUB\u COMMIT\u REF： 应用程序部署时使

我正在学习nextjs，我有一个问题 如何将应用程序部署到服务器中的子目录（如“/next”），而不是根目录 我尝试部署到名为“/next”的目录中 但在此之后，无法访问公用文件夹中的静态文件： 它请求的url不正确，应该是“/next/tell.png”而不是“/tell.png” 另一个问题是关于页面中的js文件 js文件url应该是“/pages/curise.js”，而不是“/page/next/curisejs” 哦，这是我的next.config.js，我定义了assetPrefix

感谢赛普拉斯团队。 我有一个关于e2e无头测试的问题 当我使用--watch选项运行测试时，它通过得很好。 但对于无头选项来说，它是失败的。 我需要在CI上运行此操作，因此它必须尽快解决此问题 下面是我运行的命令 纱线nx运行签出-e2e:e2e-观察 纱线nx运行检验-e2e:e2e——无头 我一共有3个测试文件，具体的是第一个测试在长时间延迟（大约60秒）后没有通过，但是其余的都通过了 这里有一个要运行的代码文件。 其他文件几乎相同 const classname = 'buybox--bu