使用next.js特性将Next.js添加到组件库中
Next.js 是一个基于 React 的轻量级框架，用于构建具有服务端渲染（SSR）和静态网站生成（SSG）能力的现代 Web 应用程序。通过将 Next.js 添加到组件库中，可以使组件库中的组件能够充分利用 Next.js 的特性和优势。
Next.js 的特性包括：
- 服务端渲染（SSR）：Next.js 支持服务器端渲染，可以在服务器端生成完整的 HTML 页面，并将其发送给客户端，以提供更快的首次加载速度和更好的 SEO。
- 静态网站生成（SSG）：Next.js 提供了静态网站生成功能，可以在构建时预渲染页面，从而实现更快的页面加载速度和更佳的用户体验。
- 自动代码拆分：Next.js 可以自动将页面和组件拆分为较小的块，只加载当前页面所需的部分，以减少页面加载时间。
- 热模块替换（HMR）：Next.js 支持热模块替换，可以在开发过程中实时更新页面，无需手动刷新浏览器。
- 客户端路由：Next.js 内置了客户端路由，可以通过简单的 API 实现页面之间的导航，提供更好的用户体验。
- TypeScript 支持：Next.js 对 TypeScript 有良好的支持，可以使用 TypeScript 来开发项目，提供类型检查和更好的开发体验。
- 扩展性：Next.js 可以与各种库和框架集成，如 Redux、Apollo、Emotion 等，可以根据项目需求进行定制和扩展。
Next.js 的应用场景包括：
- 多页面应用（MPA）：Next.js 可以用于构建传统的多页面应用，提供快速的页面加载和良好的用户体验。
- 单页面应用（SPA）：Next.js 也可以用于构建单页面应用，通过自动代码拆分和客户端路由提供更好的性能和用户体验。
- 静态网站生成（SSG）：对于内容不经常变化的网站，可以使用 Next.js 的静态网站生成功能，预渲染页面并部署到 CDN，提供更快的访问速度和更佳的可扩展性。
推荐的腾讯云相关产品和产品介绍链接地址：
- 腾讯云云函数（SCF）：腾讯云云函数是一种事件驱动的无服务器计算服务，可以方便地在云端运行你的代码片段，无需关注服务器运维。了解更多：https://cloud.tencent.com/product/scf
- 腾讯云对象存储（COS）：腾讯云对象存储是一种海量、安全、低成本的云端对象存储服务，适用于图片、音视频、静态网页等各种数据类型的存储和访问。了解更多：https://cloud.tencent.com/product/cos
- 腾讯云云服务器（CVM）：腾讯云云服务器是一种灵活可扩展的云端虚拟服务器，提供高性能的计算能力和稳定可靠的网络环境，适用于各种应用场景。了解更多：https://cloud.tencent.com/product/cvm
请注意，以上推荐的腾讯云产品仅作为参考，具体选择应根据项目需求和个人喜好进行决策。
相关·内容
我将ES5包重写为现代语法，以避免使用不推荐的警告，并将其发布到npm。
大多数反应项目，包括基于next.js和create-react-app的项目，都使用uglify.js，它们在class关键字处中断。
{ Error: commons.js from UglifyJs
Unexpected token: name
...
如何正确地编写使用类并与uglify.js和npm一起工作的React组件？
浏览 5提问于2017-06-14得票数 0
回答已采纳
( a) Next.js在其主文件的名称中使用下划线，例如_app.js、_document.js =>参数用于使用snake_case。
( b)在GitLab存储库中，Next.js使用kebap-case作为文件夹名。
和PascalCase的文件名。
( c) Next.js support EsLint。下面是：
使用camelCase作为文件夹和文件名的默认设置(但也支持不同的约定)。
( d)对于node.js应用程序，kebap-case似乎是一种标准：
=>是否可以告诉next.js对_app.js、_document.js使用不同的名称?如果没有，我如
浏览 19提问于2022-11-11得票数 0
我正在制作一个将在Next.js项目中使用的React组件库。我想将Next.js的特性添加到我的组件中。 简单地将Next.js作为开发依赖项添加到组件库中就足够了吗？
浏览 15提问于2020-10-02得票数 0
回答已采纳
我对如何在Next.js 13中管理客户端组件的SEO感到困惑。
假设我想在/contact创建一个联系人页面
在新框架中，我应该在contact目录中创建一个名为app的文件夹。在它中，我应该创建一个名为page.js by约定的页面。
现在我需要创建一个表单，它当然需要管理它的状态。因此，我应该使用useState或其他钩子的反应。
但是当我这样做时，Next.js编译器抱怨它是一个服务器组件，如果我想在客户端使用它，我应该在顶部用'use client'指令标记它。
但我不希望组件在客户端呈现。我需要我的/contact页面被搜索引擎索引。
我该怎么办？
浏览 23提问于2022-11-02得票数 1
1回答
我是相当舒服的反应和传递状态到组件和设置一个CSR应用程序，但我有点混淆了Next.js。我有时理解为SSR页面提供服务的好处，但我很难理解如何将这两者联系在一起。我正在制作一个基本的应用程序使用菲利普斯色调API。我认为我所处的位置：
I想提供一个SSR i getStaticProps()来更新仪表板上的版本，我希望允许用户与应用程序交互，并使用React的状态将信息传递给组件。
问题：
，我需要在此时呈现客户端页面吗？，我是否可以将状态添加到next.js文件中，让用户在同一页面上进行交互而不必呈现另一个页面？，如何将JSX添加到下一步，还是应该将Next.js更像节点服务器？
谢谢你的
浏览 2提问于2020-10-24得票数 1
我是Next.js的新手。目前，我正在建立一个使用库的站点。这个库必须像这样动态导入
import Head from "next/head";
import dynamic from "next/dynamic";
const Jarallax = dynamic(() => import("../components/Jarallax"), {
ssr: false,
});
import JarallaxImage from "../components/JarallaxImage";
export def
浏览 7提问于2022-09-04得票数 0
我正在为Next.js中的客户端设置重定向。我们在next.config.js中有类似这样的配置
{
source: '/page.aspx:urlstr*',
destination: 'https://someurl.com/page.aspx:urlstr*',
permanent: true,
},
实际的URL会有一个长的URL字符串，如下所示：page.aspx?woXxJNrRIMKVC109awwTopP+k2NmkvXf+MzijTEc3zIZ3pf4n+Yknq
这是被编码为be：https://someurl.com
浏览 6提问于2022-07-13得票数 0
1回答
我检查了Next.js存储库中的几个示例
并注意到示例在React组件中使用ES模块，在server.js文件中使用server.js模块。我想把我的代码写成一种风格，是否可以在Next.js项目中只使用ES模块？
浏览 0提问于2019-05-03得票数 3
我想在Next.js中使用GoogleCal历api作为库，而不使用_document.tsx。在这种情况下，我想出了两个可能的方法，如下所示；
在npm安装中使用google日历api进行JavaScript
在浏览器中在node.js中使用Next.js日历api
对于1，在官方网站npm install xxx上似乎没有办法使用，但是据说<script src="https://apis.google.com/js/api.js"></script>是使用的。这不是我想要的，因为我使用Next.js，所以我想使用来使用这个库。
至于
浏览 13提问于2022-03-28得票数 1
回答已采纳
我有一个Next.js应用程序
这是我的页面/组件之一
import React from "react";
import { SomeLocalStorageComponent } from "some-external-lib";
const MyComponent = () => {
const isBrowser = typeof window !== "undefined"
{
if (isBrowser) {
<SomeLocalStorageComponent></SomeLocal
浏览 5提问于2022-08-25得票数 0
回答已采纳
我正在尝试使用MSAL (react)库使用azure b2c来设置b2c。Msal提供了一个很好的组件<MsalAuthenticationTemplate />来处理auth。
我做了一个最小的next.js页面。
import { InteractionType } from "@azure/msal-browser";
import { MsalAuthenticationTemplate } from "@azure/msal-react";
import { NextPage } from "next";
const E
浏览 13提问于2022-06-21得票数 1
我希望根据请求页面的域呈现具有自定义内容/样式的动态next.js页面。基本上，在多个域下运行一个next.js应用程序。
我知道我必须进行某种自定义路由，但不知道如何以及如何将主机信息传递到请求的页面，因此它从数据库中获取匹配的数据。
浏览 5提问于2019-02-14得票数 2
回答已采纳
我想知道使用WebSockets页面连接到我的Next.js服务器的最佳方法是什么？我希望用户可以使用一个连接浏览页面，当他关闭页面时，他也会关闭WebSockets连接。我尝试使用React的上下文API：
const WSContext = createContext(null);
const Wrapper = ({ children }) => {
const instance = WebSocket("ws://localhost:3000/ws");
return <WSContext.Provider value={instance}>
浏览 4提问于2021-07-05得票数 19
回答已采纳
在我的npm pg应用程序中，我试图在中使用。
我刚开始使用池连接，但我发现，每当初始化Next.js服务器时，我就需要建立池连接，并且需要将该连接作为模块传递给我的应用程序。
来自pg-池文档：
关于实例的说明
池应该是应用程序中的长寿命对象。通常，在应用程序启动并在应用程序的整个生命周期中使用相同的池实例时，您希望实例化一个池。如果您经常在代码中创建一个新的池，那么您可能没有将池初始化代码放在正确的位置。
因此，我创建了文件my-app/lib/db.js来初始化我的连接，并希望在需要运行查询时在我的应用程序中传递它。
但是，当我尝试import { Pool } from '
浏览 9提问于2022-02-17得票数 2
回答已采纳
next-with-apollo npm库和 .中选择的“阿波罗-客户端在next.js”中的对比
next.js为阿波罗客户端选择的方法链接：
没有使用第三方库，下一个是阿波罗。
不使用从树获取数据的方法。
此外，我发现这种方法更有意义，更优雅的内部工作，客户端重新设计，以及next.js中的阿波罗-客户的SSR。我非常喜欢这个
next-with-apollo 中的几个缺点
在“下一个阿波罗文档”中，有人指出，在withApollo API中，intialState的参数getDataFromTree默认为未由实现者定义的参数，并声明“建议永远不要设置这个支柱，否
浏览 1提问于2021-08-19得票数 4
回答已采纳
各位，我是Next.js 13的新手。
我使用Next.js 13创建了一个项目，并使用新的app目录。
我正在尝试应用使用尾风CSS的样式。我遵循了下面的Next.js文档：
文档要求将global.css样式表导入根布局(app/layout.js)，以便将样式应用于应用程序中的每个路由。我试着遵循这个步骤，但是我得到了以下错误：
这是我的文件夹结构：
下面是我的代码片段：
app/layout.js
import React from "react";
import Link from "next/link";
import "
浏览 11提问于2022-11-11得票数 -1
2回答
我如何创建一个简单的路由菜单，它不会离开链接选择菜单-非常类似于React中BrowserRouter的默认操作？
我正在阅读Next.js中的路由，但简单的示例并不是很明显。仅涵盖用所选链路完全替换活动组件。我想在视图中添加一个组件，而不是替换屏幕上的所有内容。
这是在香草反应工作，我需要在Next.js中的等效功能，即简单的链接菜单加载到视图中的组件。
import { BrowserRouter as Router, Route, Link } from "react- router-dom";
export function MyNavbar(
浏览 1提问于2019-07-17得票数 1
我试图通过修复谷歌灯塔报告的所有问题来优化我的Next.js应用程序。
它目前面临的最重要的问题之一是图像：
根据，Next.js会自动对static文件夹中的媒体执行此操作。
Next.js自动将缓存头添加到来自/_next/静态的不可变资产，包括JavaScript、CSS、静态映像和其他媒体。
由于所有这些有问题的映像都来自一个API，该API从AWS CloudFront为它们提供服务，因此我无法找到解决问题的方法。
我想在CloudFront中添加建议的CloudFront策略可能会有帮助，但我不知道
1.)如果这是正确的解决方案2.)如何在AWS控制台中这样做
浏览 7提问于2022-10-07得票数 1
2回答
基于JWT的Next.js认证
、、、、
我正在将一个项目从React转移到Next.js，并想知道相同的身份验证过程是否正常。基本上，用户输入他们的用户名和密码，并通过API (Node.js/Express)对照数据库凭证进行检查。因此，我不是使用Next.js内部api功能，而是使用与我的Next.js项目完全解耦的API。
如果登录凭据正确，将向客户端发送一个JWT令牌。我想把它存储在本地存储中，然后重定向用户。任何未来的HTTP请求都将在报头中发送令牌，并通过API检查它是否有效。这样可以吗？我问这个问题是因为我看到很多Next.js使用cookies或会话，并且不知道这是否是我应该采用的“标准”方法。
浏览 2提问于2021-02-27得票数 18
回答已采纳
我已经问了一个问题，我不知道如何用Next.js中的对象列表(类似于Next.js)为它们创建自己的布局。()
然后有人告诉我一个解决方案：()
不幸的是，我现在总是收到一个错误：
未处理运行时错误
错误:对象作为React子对象无效(找到:键为{__typename的对象，通道})。如果您打算呈现一个子集合，请使用数组。)
我将链接Git存储库和下面的代码片段。
代码片段：
存储库：
浏览 6提问于2022-01-13得票数 2
我在我的next.js项目中使用了标记：
我有多个.md文件
我安装了:备注、备注-HTML和灰质
现在，我想更改段落/p标签的字体大小。我见过其他StackOverflow文章说内联-CSS应该在.md文件中工作，但在我的例子中不起作用。我试过这样的方法：
<p style="font-size: 14px">Lorem ipsum dolor</p>
和
<font size="3"> This is my text number 3</font>
有什么建议吗？
浏览 9提问于2022-01-07得票数 1
我正在尝试构建我的Next.js项目，但是它一直给我在终端中的错误：
Error: Build optimization failed: found page without a React Component as default export in
pages/components/context/Context
这是React上下文API文件，不应该有任何默认的导出。这是个窃听器还是什么？
浏览 22提问于2021-01-06得票数 32
回答已采纳
2回答
前端和后端资源
、、、、
我们正在开发一个小型市场网站。我正在用Java构建后端，我的同事正在用next.js构建一个前端，作为一个完全独立的项目。我们正处于这样一个阶段，我们希望部署它，并将其连接起来，以确定事情是否有效。这是我们都没有太多经验的地方。
目前，我们正面临一个问题。后端正在从各种来源下载数据。名称、价格等存储在数据库中，但计划将图像存储在服务器上。诀窍是，据我们所知，理想情况下应该将next.js部署到Vercel，但我们为后端提供了另一个托管服务。图像经常显示在正面。我觉得经常从后端发送图像是错误的。我想知道：
我们应该将next.js移动到我们的托管服务，而不是Vercel，并将其设置为可以访问
浏览 1提问于2021-08-27得票数 1
回答已采纳
根据next.js的当前文档，通过向getStaticProps和getStaticPaths提供路由数据来处理动态路由。
当在构建期间从数据库中获取路由数据时，什么概念将使我能够使用或不使用getStaticProps()和getStaticPaths()实现动态路由？
浏览 3提问于2020-10-03得票数 1
Next.JS布局可以用来持久化页面状态，但显然不能用来持久化调用。docs建议使用SWR或useEffect来获取页面布局上数据，但对于静态数据来说，这是一种糟糕的体验，例如放入页脚的数据。例如，获取页脚的街道地址不应该在客户端完成，而应该在服务器上完成。 说了这么多--是否可以在布局上调用getStaticProps？或者，有没有其他方法可以在服务器端为布局获取数据？
浏览 15提问于2021-10-20得票数 2
我在我的项目中使用Next.js库。当我试图在Link组件中放置任何图标时，会出现一个错误，我完全不理解它。有人能解释我为什么不能这么做吗？除了这个错误，app工作得很好--它重定向以更正页面。
错误(只显示浏览器控制台中的-终端中没有任何内容)：
[
]
代码：
import Link from 'next/link'
import { FontAwesomeIcon } from '@fortawesome/react-fontawesome'
import { faHeart } from '@fortawesome/free-regular-s
浏览 5提问于2021-10-28得票数 0
1回答
在Next.js中，有没有一种方法可以区分每个页面的关键CSS和非关键CSS，并异步加载非关键CSS？ 我在我的页面和组件中使用了样式组件+几个外部css库。 谢谢!
浏览 18提问于2021-01-12得票数 3
我刚刚创建了我的组件童话库(ES6等)。它被构造为一个Lerna项目(包/文件夹中隔离的所有组件)。然而，这是一个私人回购，没有真正的发布功能，所以，我认为Lerna将不会工作的私人(免费)帐户。我已经把故事书回购推到了我的比特桶里。
现在，我想使用来自主应用程序的组件的故事书库，这是一个在Next.js上构建的不同的repo (在Bitbucket上)。
我试图导入单独的故事书组件，如下所示
import MyComponent from 'storybook-repo/packages/my-component/my-component';
但它显然不起作用，返回以下错误：
浏览 1提问于2018-07-17得票数 2
目前我们有我们的主要领域www.example.com开发使用Angular 4，其中我们有巨大的性能和搜索引擎优化问题。我们使用Next.js开发了针对移动用户的m.example.com，最近我们成功地上线了。现在我们希望将我们的主域www.example.com迁移到Next.js，目前100%的代码在API消耗方面是相同的。只有设计会被改变，以适应桌面用户。将来我们可能会引入特定于移动/桌面的功能，所以一旦我们完成迁移，我们希望有两个独立的可部署项目。
您能告诉我解决这个问题的最好方法是什么，同时实现以下几点吗? 1.两个Next.js项目之间的代码可重用性2.两个Next.js项目之
浏览 1提问于2019-05-09得票数 0
我试图在withRouter库中使用Next.js临时助手。
import { withRouter } from 'next/router'
const MyComponent = withRouter(({ router }) => ())
这就产生了一个流错误：
[flow] property `router` is missing in props [1]. (References: [1])
尽管我已经为Next.js和withRouter函数安装了流类型，但它有以下签名：
withRouter: < T > (Component: React$C
浏览 2提问于2018-11-16得票数 1
回答已采纳
在Next.js中有一个配置文件/:id页面的组件中有这个链接：
<Typography style={linkStyles} variant='body2' color='text.secondary'>
<Link href={user.website}>
<a target='_blank'>{user.website}</a>
</Link>
</Typography>;
当前路径类似于https://localhost:3000/users/some
浏览 3提问于2022-05-20得票数 0
2回答
我来自SPA的和REST/GraphQl的世界。现在，我正在使用Next.js库构建个人项目，用于SSR(服务器端呈现)ReactiveApp。
由于我在所有的单页应用程序中都使用了Redux，所以现在我想知道当每个路由用户访问、加载一个新链接并刷新页面时，我应该如何管理用户状态。
我发现了一些关于会话和曲奇的信息，但这些都不是我所熟悉的。我看了一些关于将Redux与Next.js一起使用的在线文章，但这似乎很复杂。
浏览 1提问于2019-07-12得票数 26
我有一个next.js应用程序，现在正在本地开发开发环境。我在npm run dev上调用我的服务器，我用"dev": "next dev -p 3006 & npx prisma studio -p 3007",运行prisma工作室
我想知道，如果我的next.js应用已经部署在heroku上，我如何才能访问prisma工作室。Prisma提供了关于如何部署到heroku的指南，但是没有提到如何在部署后通过prisma访问数据库。
这里有人有经验吗？
浏览 4提问于2022-08-12得票数 1
回答已采纳
react i18ext：：您将需要使用initReactI18next传递一个i18next实例
我最近添加了这个包，并得到了这个错误。据我所知，我已经遵循了所有的步骤。
我将Next.js与通常自动初始化自身的next-i18next包一起使用。
浏览 0提问于2021-06-08得票数 35
回答已采纳
为了改进TTFB (时间到第一个字节)，“PageSpeed洞察”建议使用ReactDOMServer.renderToNodeStream()，但我不知道如何实现它。我读过的文章，但我不知道如何使用它。另外，我读了，但是在我的next.js应用程序中，没有webpack.config.js文件。如果我不能将react renderToNodeStream与Next.js一起使用，如何在Next.js中覆盖renderToNodeStream的影响？
浏览 10提问于2020-04-19得票数 9
回答已采纳
2回答
我试图添加一个标志图像(svg)到我的导航组件。我正在使用故事簿和next.js。
我遵循了来自的配置，但是映像没有加载到故事书组件中。
为什么会这样呢？
// .storybook/main.js
module.exports = {
stories: [],
addons: [],
staticDirs: ['../public/images'],
};
// Nav.stories.mdx
import {Nav} from './Nav'
import {Canvas, Meta, Story} from '@storybook/a
浏览 3提问于2021-12-12得票数 1
回答已采纳
我正在查看React框架Next.js，看看它是否与我的下一个应用程序SPA最匹配，ASP.NET核心将是后端。我以前使用过create-react-app，所以我想将Next.js与它进行比较。我们的目标不是Server Side Rendering(SSR)。我们的项目将是管理类的项目和SEO并不真的重要。我们肯定需要表演。我们不能使用静态生成，因为我们需要为每个页面加载最新的数据。我们也需要废品。
我所读到的关于Next.js的主要好处是：
SSRFile Routing全文堆栈开发--可以与it一起使用后端(Node.JS)。
从这些提到的功能，文件路由将只对我们有用，我相信，因为我们
浏览 7提问于2021-07-14得票数 7
回答已采纳
我很想用电子创建一个桌面应用程序！
由于我有使用Next.js (React)的经验，但以前没有使用过Electron.js (很久以前就对它进行了测试)，所以我想用样板/初学者/模板引导我的项目。但是，我对选择哪种选项感到有点困惑：
尼普隆
官方Next.js电子示例：
电子-下一步： (在上面的链接中提到作为博客文章！)
我知道这个问题似乎是以意见为基础的，但我在他们之间找不到技术上的比较。我还试着自己比较npm downloads、GitHub stars、Last commit date和其他类似的东西，但是由于它们是不同的东西(一个是一个--示例&
浏览 1提问于2021-11-07得票数 1
回答已采纳
我正在使用nextjs构建一个简单的应用程序。我的大多数组件都是功能组件。但是，我有一个处理表单的类组件。 我想在表单提交后重定向到主页。console.log(this.router)给出了未定义的。因为它是一个类组件，所以我不能使用useRouter()钩子。如何在next.js中获取对类中路由器组件的引用？
浏览 34提问于2021-01-22得票数 1
我们在我们的next.js 12应用程序中使用了react的上下文API。
我们想升级到next.js 13。
我们得到这个错误：
react__WEBPACK_IMPORTED_MODULE___.createContext不是一个函数
对于此代码：
import React from 'react'
const SiteContext = React.createContext()
export default SiteContext
我们现在应该做什么？我在网上找不到这个的资源。
另外，我们需要服务器上的上下文API，因为SEO很重要，我们不想在客户机上呈现。
浏览 7提问于2022-10-31得票数 1
6回答
Next.js dynamic()专用组件并不是真正简单的测试。我现在有两个问题；
第一个jest未能正确编译动态导入(require.resolveWeak is not a function -似乎是由下一个babel插件添加的)
第二，我无法很好地了解modules逻辑；在尝试呈现动态组件时，它似乎根本没有运行。
浏览 1提问于2017-10-24得票数 20
回答已采纳
2回答
如何在Next.js应用程序上填充intl？一些中国浏览器仍然没有它，我们使用的是react Intl，它需要Intl。
浏览 13提问于2020-08-07得票数 3
回答已采纳
我们可以通过使用app目录在Next.js v13中使用Redux吗？和以前一样，使用Next.js Redux包装器。或者如果我们可以使用，在Next.js 13中是否有使用服务器端Redux的例子？
我将使用新的Next.js v13，因为有了新的布局更新，所以我们可以使用app目录创建服务器端状态吗？
看起来他们已经在使用Redux了，但是如果我按照源代码实现了Redux，那么我就收到了React的错误。
我该怎么办？在线编辑器中的代码是什么？
浏览 37提问于2022-10-31得票数 0
回答已采纳
我使用next.js创建一个静态页面，该页面以SSG模式输出。
我想使用react设备检测库来根据屏幕大小来确定输出组件。
由于页面是作为SSG创建的，即使在访问页面后更改了屏幕大小，组件也不会实时更改。
当然，如果您更改屏幕大小并重新加载它，它将被反映出来，但是我想实时地反映它。
如果没有使用next.js，并且只使用了react，那么每次都会呈现它，所以没有问题。这一点有解决办法吗？
最好的尊重。
消息来源在下面。
import { isMobile, BrowserView, MobileView } from "react-device-detect";
const
浏览 5提问于2021-11-15得票数 0
回答已采纳
有人能向我解释在Next.js中设置页面之间的链接时使用Next.js和使用锚标记之间的区别吗？
例如：
<Link href={`/posts/${post.id}`} passHref>
<h2>
{post.id} {post.title}
</h2>
</Link>
和
<Link href={`/posts/${post.id}`}>
<a>
{post.id} {post.title}
</a>
</Link>
我试着在文档中读到这件事，但似乎找不到答案。
浏览 19提问于2022-05-16得票数 1
根据文档，Netlify通过支持next.js，并通过手动部署，但是我如何结合使用这两者来在我自己的CI中构建一个next.js项目，并仅将构建输出部署到Netlify？
插件页面提到了“链接”，即它假设项目是通过Git存储库连接的，并由netlify构建，而不是通过我自己的CI本地构建。
浏览 2提问于2021-04-27得票数 0
我有一个应用程序，它会在cookie中保存一些值。我知道还有其他的工具，如useState，useContext等.但是这个特定的应用程序与一个库一起工作，该库将信息存储在jwt中，因此我必须通过获取jwt来读取某些值。我正在把这个应用程序从next.js 12 (和webpack一起)移植到next.js 13 (用涡轮机)。
我已经在结构上移植了这个应用程序，以适应app风格的next.js 13路由。我的页面都在各自的文件夹中，在app目录中有子布局，我的主布局和主页直接在app目录中。
next.js 12中受保护页面的旧代码如下所示：
protected.tsx
import typ
浏览 21提问于2022-11-21得票数 1
回答已采纳
我想知道dynamic import (next.js特性)和await import之间的区别。
我在网上找不到关于这种差别的解释。
我知道，您只能使用dynamic import导入React Components，而不能使用库。
但是为什么我要使用dynamic import而不仅仅是await import呢？
谢谢
浏览 2提问于2020-12-19得票数 3
回答已采纳
我知道这个问题以前已经被问过很多次了，但似乎没有一个解决方案有效。
我正在尝试使用'react-chat-popup‘库，它只在SSR应用程序的客户端呈现(使用next.js框架构建)。使用这个库的正常方法是调用import {Chat} from 'react-chat-popup'，然后直接将其呈现为<Chat/>。
我为SSR应用程序找到的解决方案是在动态导入库之前检查componentDidMount方法中的typedef of window !=== 'undefined'，因为通常单独导入库已经导致window is not de
浏览 0提问于2018-08-09得票数 5
1回答
请您解释一下Next.js中客户端和服务器端的概念，就像他们在文档中提到的那样。我所知道的是，Next.js工作在react上，它是客户端并在浏览器中运行，服务器端是指api (后端)。任何帮助都将不胜感激。谢谢
来自Next.js文档：
在服务器端构建时调用此函数.它不会在客户端被调用，所以您甚至可以直接进行数据库查询。见“技术细节”一节。
export async function getStaticProps() {
const postsDirectory = path.join(process.cwd(), 'posts')
co
浏览 4提问于2021-01-31得票数 0
扫码
添加站长 进交流群
领取专属 10元无门槛券
手把手带您无忧上云
相关资讯
热门标签
云服务器
ICP备案
实时音视频
对象存储
云直播活动推荐
腾讯云开发者
