-
Next.js CSS 文件
.moudle.css Next.js中CSS样式文件以.module.css后缀结尾。 使用 以.module.css结尾的文件可以导入styles对象。 import styles from "
2025-10-22, Views: 182 , Topics: Next.js
-
Next.js 全局样式与局部样式
全局样式 app/global.css 新建一个.css结尾的文件即可(不一定是global名字也可以)。 body { padding: 20px 20px 60px; max-width
2025-10-21, Views: 215 , Topics: Next.js
-
Next.js 使用 giscus 评论插件
注意 Next.js默认会将script脚本放在DOM渲染完成后执行。 不能像放在静态文件或模板引擎渲染的HTML中。 代码 使用.giscus类选择器,将指定的元素放在合适的位置即可。 React
-
Next.js 实现 SPA 单页面应用
方法 Link 组件 使用next/link下的<Link>组件,指定href。 <Link href="/about">关于</Link> useRouter() 使用next/navigati
2025-10-19, Views: 213 , Topics: Next.js
-
Next.js 设置统一加载页面
loading.tsx 与page.tsx同一层目录中新建loading.tsx组件。 Component import styles from './Loading.module.css'; e
2025-10-18, Views: 147 , Topics: Next.js
-
Next.js App Router 设置统一错误页面
error 页面 src/app目录下新建error.tsx。 且代码第一行必须指定'use client',否则会认定为服务端error接口。 代码 'use client' export de
2025-10-17, Views: 147 , Topics: Next.js
-
Next.js App Router 设置统一 404 页面
404 页面 src/app目录下新建not-found.tsx文件。 名称必须是not-found,后缀可以是jsx、tsx等。 代码 not-found.tsx文件内容 export defau
2025-10-16, Views: 152 , Topics: Next.js
-
Next.js 跳转到 not-found.tsx 和 error.tsx 定义的页面
not-found 跳转到not-found.tsx定义的页面。 使用notFound()方法即可。无需return。 import {notFound} from "next/navigation
2025-10-15, Views: 184 , Topics: Next.js
-
Node.js Drizzle PostgreSQL 数组类型
array() text().array()表示text[]。 import {integer, pgTable, text} from "drizzle-orm/pg-core"; const
-
Node.js Drizzle PostgreSQL timestamptz 带时区的时间戳类型
timestamp() timestamp({withTimezone: true}),传入withTimezone属性为true。 import {integer, pgTable, timest
-
Node.js Drizzle PostgreSQL bigserial 类型
bigserial() bigserial("record_page_view_id_seq", {mode: "bigint"}),第一个参数指定序列的名称,第二个参数传入mode属性,指定big
-
Node.js Drizzle PostgreSQL bigint 类型
bigint() bigint({mode: "bigint"}),传入mode属性,指定bigint或number import { bigint, pgTable, timestamp } fr
-
Node.js Drizzle orderBy 升序、降序、联合排序
orderBy() 使用typeof、$inferSelect提取表结构的类型。 升序 orderBy(columnName)等价于orderBy(asc(columnName)) const po
-
Node.js Drizzle 查询表结构返回的类型
$inferSelect 使用typeof、$inferSelect提取表结构的类型。 const posts = pgTable("post", { id: integer().prima
-
TypeScript Omit Pick Partial 的用法
Omit Omit<原类型, 要删除的键>,使用|选择多个键 interface User { name: string, age: number, password: st
2025-10-08, Views: 177 , Topics: TypeScript
-
TypeScript Record 特性
说明 类似于JavaScript中的Map。 与Map不同的是: Record遍历时先输出数字类型的字段,再输出字符类型的字段 Map遍历时按放入时的顺序输出。 Record<string, M
2025-10-07, Views: 207 , Topics: TypeScript
-
TypeScript 配置 script 脚本 CrossOrigin 从 .env 文件读取时报 TS2322 类型不匹配
原因 .env文件中配置的变量默认是string字符串类型。 TypeScript中script脚本标签中的CrossOrigin属性允许的值是anonymous、use-credentials、"
2025-10-06, Views: 198 , Topics: TypeScript 跨域
-
Vite 中编辑 vite.conf.ts process 报错
process 报错 原因:没有安装@types/node类型提示。 npm install @types/node -D 参考文档 https://vite.dev/config/
-
PostgreSQL 按月统计数据
需求 统计从年初到当前月的每月数据。 如果是历年数据则完整统计1-12月,如果是今年数据则统计1到当前月(如:1-10月)。 generate_series 使用PostgreSQL的内置方法gen
2025-10-04, Views: 211 , Topics: PostgreSQL
-
CSS 使用 flex-shrink 0 解决 flex 1 布局中元素设置的高度不生效问题
现象 代码 .container { flex: 1; overflow-y: scroll; } 原因 flex: 1依赖容器高度,没有容器高度,flex: 1会无限拉伸,把元素
2025-10-03, Views: 227 , Topics: CSS