tailwind.config.js配置文件添加代码: import{nextui}from'@nextui-org/react';importtype{Config}from'tailwindcss';constconfig:Config={darkMode:'class',content:['./node_modules/@nextui-org/theme/dist/**/*.{js,ts,jsx,tsx}',],theme:{extend:{}},plugins:[nextui()],};exportdefaultconfig; 在...
Metadata:在Next.js项目中优化SEO 在当今这个信息爆炸的时代,拥有一个高可见度的网站已成为许多企业和个人的追求。搜索引擎优化(SEO)是实现这一目标的重要手段。为了让你的Next.js应用更好地被搜索引擎发现,Next.js引入了一个非常实用的功能——元数据API。通过这个API,你可以为每个页面定义元数据,确保当你的页面被...
// app/layout.jsimport'./globals.css'import{Inter}from'next/font/google'constinter=Inter({subsets:['latin']})exportconstmetadata={title:'Create Next App',description:'Generated by create next app',}exportdefaultfunctionRootLayout({children}){return({children})} 其中: app目录必须包含根布局,也...
// layout.tsxexportconstmetadata={title:{default:'Brand',template:'%s | Brand',},};// page.tsxexportconstmetadata={title:"Home | Brand";};// about/page.tsxexportconstmetadata={title:"About";} Which ultimately kind of defeats the purpose of title templates. I don't see any way you c...
├── layout.js ├── template.js ├── loading.js ├── error.js └── not-found.js ├── about │ └── page.js └── more └── page.js 1、定义路由 文件夹被用来定义路由。每个文件夹都代表一个对应到 URL 片段的路由片段。创建嵌套的路由,只需要创建嵌套的文件夹。
import'./globals.scss';import{NextUIProvider}from'@nextui-org/react';importtype{Metadata}from'next';import{Inter}from'next/font/google';constinter=Inter({subsets:['latin']});exportconstmetadata:Metadata={title:'next-admin',description:'基于 Next.js 开发的后台模板',};exportdefaultfunctionRootLa...
Next.js 是基于文件系统的路由器;文件夹用于定义路由,路由是嵌套文件夹的单一路径,遵循文件系统层次结构,从根文件一直到包含page.tsx或者page.jsx的文件。 page.tsx或者page.jsx是 Next.js 中一个特殊的文件,它导出一个 React 组件,作为该路由呈现的页面。
import'./globals.scss';import{NextUIProvider}from'@nextui-org/react';importtype{Metadata}from'next';import{Inter}from'next/font/google';constinter=Inter({subsets:['latin']});exportconstmetadata:Metadata={title:'next-admin',description:'基于 Next.js 开发的后台模板',};exportdefaultfunctionRootLa...
'use client'importtype{Metadata}from'next'import{Modal}from"antd";import{Inter}from'next/font/google'importReactfrom"react";import{useSelectedLayoutSegments,useRouter}from'next/navigation'import{useAtomValue}from'jotai';import{loginModalAtom}from"./store";constinter=Inter({subsets:['latin']})funct...
import type { Metadata } from "next"; import { Inter } from "next/font/google"; import "./globals.css"; const inter = Inter({ subsets: ["latin"] }); export const metadata: Metadata = { title: "Cactus AI", description: "Generated by create next app", }; export default function ...