2022年2月28日
资产 Next.js可以在顶级public目录下提供静态资产,如图像。内部文件可以从应用程序的根目录引用,类似于pages。public 该目录还可用于 、Google 站点验证和任何其他静态资产。查看静态文件服务文档以了解更多信息。public``````robots.txt 下载您的个……
阅读全文
2022年2月28日
下载入门代码(可选) 如果您不打算继续上一课,可以在下面下载、安装和运行本课程的入门代码。这将设置一个目录,使其与上一课的结果相同。nextjs-blog 同样,如果您刚刚完成上一课,则不需要这样做。 npx create-next-app nextjs-blog –use-npm –example “https://github.com/vercel/next-learn/tree/master/basics/assets-metadata-css-starter" 然后按照命令输出中的说明(进入目录并启动开发服务器)进行操作。cd……
阅读全文
2022年2月28日
我们添加的第二个页面当前没有样式。让我们添加一些 CSS 来设置页面样式。 Next.js内置了对 CSS 和 Sass 的支持。在本课程中,我们将使用 CSS。 本 节 课 还将 讨论 Next.js 如何处理静态资产(如图像)和页面metadata(如标记)。<title> 您将在本课中学到什么 在本课中,您将学习: 如何将……
阅读全文
2022年2月25日
客户端导航 "链接“组件支持在同一 Next.js 应用中的两个页面之间进行客户端导航。 客户端导航意味着_使用JavaScript_进行页面转换,这比浏览器完成的默认导航更快。 以下是验证它的简单方法: 使用浏览器的开发人员工具将 的 CSS 属性更改为 。background``````&……
阅读全文
2022年2月25日
链接组件 在网站上的页面之间链接时,请使用 HTML 标记。<a> 在"Next.js"中,使用"来自下一个组件/链接“来包装标记。 允许您执行客户端导航到应用程序中的其他页面。Link``````<a>``````<Lin……
阅读全文
2022年2月25日
**如果要继续上一课,**可以跳过此页面。单击下面的按钮转到下一页。 下载入门代码(可选) 如果您不打算继续上一课,可以在下面下载、安装和运行本课程的入门代码。这将设置一个目录,使其与上一课的结果相同。nextjs-blog 同样,如果您刚刚完成上一课,则不需要这样做。 npx create-next-app nextjs-blog –use-npm –example “https://github.com/vercel/next-learn/tree/master/basics/navigate-between-pages-starter" 然后……
阅读全文
2022年2月25日
到目前为止,我们创建的Next.js应用只有一个页面。网站和Web应用程序通常具有许多不同的页面。 让我们探讨一下如何向应用程序添加更多页面。 您将在本课中学到什么 在本课中,您将: 使用集成文件系统路由创建新页面。 了解如何使用链接组件在页面之间启用客户端导航。 了解对代码拆分和预取的内置……
阅读全文
2022年2月25日
到目前为止,我们创建的Next.js应用只有一个页面。网站和Web应用程序通常具有许多不同的页面。 让我们探讨一下如何向应用程序添加更多页面。 您将在本课中学到什么 在本课中,您将: 使用集成文件系统路由创建新页面。 了解如何使用链接组件在页面之间启用客户端导航。 了解对代码拆分和预取的内置……
阅读全文
2022年2月25日
编辑页面 让我们尝试编辑初学者页面。 确保 Next.js 开发服务器仍在运行。 使用文本编辑器打开。pages/index.js 找到标签下显示**“欢迎加入”的文本,并将其更改为“学习”**。<h1> 保存文件。 保存文件后,浏览器会自动使用新……
阅读全文
2022年2月25日
欢迎来到 Next.js 当您访问 http://localhost:3000 时,您应该会看到这样的页面。这是初学者模板页面,其中显示了有关Next.js的一些有用信息。 **可获得帮助:**如果您遇到困难,可以在GitHub讨论中联系社区。 让我们尝试接下来编辑此页面!……
阅读全文