estel/estel_docs
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

修改页面导航栏样式,添加MD

Browse Source
This commit is contained in:
estel
2025-08-07 19:42:34 +08:00
parent bf0add6dc6
commit fdab0fd5bb
14 changed files with 2082 additions and 250 deletions
Download Patch File Download Diff File Expand all files Collapse all files

2
app/layouts/docs.vue
View File

@@ -16,7 +16,7 @@
<!-- Right Content Area -->
<div class="flex-1 lg:ml-64 flex flex-col min-w-0">
<!-- Fixed Header -->
<AppHeader
<DocsHeader
:is-sidebar-open="isSidebarOpen"
:toggle-sidebar="toggleSidebar"
/>

12
app/pages/blog/[...slug].vue
View File

@@ -103,7 +103,7 @@ const links = computed(() => {
<template>
<UPage
v-if="page"
:class="pageFontSizeClass"
:class="['lg:mr-30 sm:mt-6', pageFontSizeClass]"
>
<UPageHeader
:title="page.title"
@@ -162,21 +162,25 @@ const links = computed(() => {
<UContentSurround :surround="surround" />
</UPageBody>
<template
<template
v-if="page?.body?.toc?.links?.length"
#right
>
<div class="fixed top-24 right-15 w-auto">
<div class="">
<UContentToc
:title="appConfig.toc?.title"
:links="page.body?.toc?.links"
:ui="{
root: 'fixed w-full xl:right-12 xl:w-64 z-50 bg-white dark:bg-gray-900 lg:border border-gray-200 dark:border-gray-700 rounded-lg lg:shadow-lg lg:mt-5'
}"
>
<template
v-if="appConfig.toc?.bottom"
#bottom
>
<div
class="hidden lg:block space-y-6 "
class=""
:class="{ '!mt-5': page.body?.toc?.links?.length }"
>
<USeparator

12
app/pages/docs/[...slug].vue
View File

@@ -103,7 +103,7 @@ const links = computed(() => {
<template>
<UPage
v-if="page"
:class="pageFontSizeClass"
:class="['lg:mr-30 sm:mt-6', pageFontSizeClass]"
>
<UPageHeader
:title="page.title"
@@ -162,21 +162,25 @@ const links = computed(() => {
<UContentSurround :surround="surround" />
</UPageBody>
<template
<template
v-if="page?.body?.toc?.links?.length"
#right
>
<div class="fixed top-24 right-15 w-auto">
<div class="">
<UContentToc
:title="appConfig.toc?.title"
:links="page.body?.toc?.links"
:ui="{
root: 'fixed w-full xl:right-12 xl:w-64 z-50 bg-white dark:bg-gray-900 lg:border border-gray-200 dark:border-gray-700 rounded-lg lg:shadow-lg lg:mt-5'
}"
>
<template
v-if="appConfig.toc?.bottom"
#bottom
>
<div
class="hidden lg:block space-y-6 "
class=""
:class="{ '!mt-5': page.body?.toc?.links?.length }"
>
<USeparator

103
app/pages/index.vue
View File

@@ -1,5 +1,104 @@
<script setup lang="ts">
import { useSeoMeta } from '#imports'
definePageMeta({
layout: 'docs'
})
useSeoMeta({
title: 'Estel Docs',
description: '简约而强大的文档系统，为技术分享而生',
ogTitle: 'Estel Docs',
ogDescription: '简约而强大的文档系统，为技术分享而生',
})
</script>
<template>
<div>
<h1>首页</h1>
<div class="min-h-screen bg-gradient-to-br from-blue-50 via-white to-indigo-50 dark:from-gray-900 dark:via-gray-800 dark:to-gray-900">
<!-- Hero 区域 -->
<div class="max-w-6xl mx-auto px-4 py-20">
<!-- 主要内容 -->
<div class="text-center mb-16">
<h1 class="text-5xl md:text-7xl font-bold text-gray-900 dark:text-white mb-6">
Estel Hub
</h1>
<p class="text-xl md:text-2xl text-gray-600 dark:text-gray-300 mb-8 max-w-3xl mx-auto">
简约而强大的文档系统,衍生而出Blog系统,为技术分享而生
</p>
<p class="text-lg text-gray-500 dark:text-gray-400 mb-12 max-w-2xl mx-auto">
基于 Nuxt 4 构建，支持 Markdown 文档管理和博客发布，提供完整的现代化内容管理解决方案
</p>
</div>
<!-- 导航卡片 -->
<div class="grid md:grid-cols-2 gap-8 max-w-4xl mx-auto">
<!-- 文档系统 -->
<NuxtLink
to="/docs"
class="group bg-white dark:bg-gray-800 rounded-2xl p-8 shadow-lg hover:shadow-xl transition-all duration-300 border border-gray-200 dark:border-gray-700"
>
<div class="text-center">
<div class="w-16 h-16 bg-blue-100 dark:bg-blue-900 rounded-full flex items-center justify-center mx-auto mb-6 group-hover:scale-110 transition-transform duration-300">
<UIcon
name="lucide-book-open"
class="text-3xl text-blue-600 dark:text-blue-400"
/>
</div>
<h2 class="text-2xl font-bold text-gray-900 dark:text-white mb-4">
文档系统
</h2>
<p class="text-gray-600 dark:text-gray-300 mb-6">
技术文档、API 文档、使用指南，一切尽在掌握
</p>
<div class="flex items-center justify-center text-blue-600 dark:text-blue-400 group-hover:text-blue-700 dark:group-hover:text-blue-300 transition-colors">
<span class="mr-2">开始阅读</span>
<UIcon name="lucide-arrow-right" size="20" />
</div>
</div>
</NuxtLink>
<!-- 博客系统 -->
<NuxtLink
to="/blog"
class="group bg-white dark:bg-gray-800 rounded-2xl p-8 shadow-lg hover:shadow-xl transition-all duration-300 border border-gray-200 dark:border-gray-700"
>
<div class="text-center">
<div class="w-16 h-16 bg-green-100 dark:bg-green-900 rounded-full flex items-center justify-center mx-auto mb-6 group-hover:scale-110 transition-transform duration-300">
<UIcon
name="lucide-pen-tool"
class="text-3xl text-green-600 dark:text-green-400"
/>
</div>
<h2 class="text-2xl font-bold text-gray-900 dark:text-white mb-4">
博客系统
</h2>
<p class="text-gray-600 dark:text-gray-300 mb-6">
技术分享、心得体会、生活感悟，记录每一个精彩瞬间
</p>
<div class="flex items-center justify-center text-green-600 dark:text-green-400 group-hover:text-green-700 dark:group-hover:text-green-300 transition-colors">
<span class="mr-2">开始阅读</span>
<UIcon name="lucide-arrow-right" size="20" />
</div>
</div>
</NuxtLink>
</div>
<!-- 底部信息 -->
<div class="text-center mt-16">
<div class="flex items-center justify-center gap-8 text-sm text-gray-500 dark:text-gray-400">
<div class="flex items-center gap-2">
<UIcon name="lucide-github" size="16" />
<a href="https://github.com/estel-li/estel-docs" target="_blank" class="hover:text-gray-700 dark:hover:text-gray-200 transition-colors">
GitHub
</a>
</div>
<div class="flex items-center gap-2">
<UIcon name="lucide-globe" size="16" />
<a href="https://lijue.me" target="_blank" class="hover:text-gray-700 dark:hover:text-gray-200 transition-colors">
个人博客
</a>
</div>
</div>
</div>
</div>
</div>
</template>

883
content/blog/1.技术栈/01.GROK3-and-Deepseek.md Normal file
View File

@@ -0,0 +1,883 @@
---
title: GROK3 and Deepseek
description: Grok3 和 Deepseek 的对比
date: 2025-05-12
img: https://lijue-me.oss-cn-chengdu.aliyuncs.com/20250806105153532.png
navigation:
icon: lucide-brain
---
### GROK3 and Deepseek
测试了GROK3,简单让做一个HTML小游戏，与R1对比
GROK3界面处理略好，满足所有要求，无BUG。
R1界面略有瑕疵，基本满足所有要求，除了有小BUG。
提示词：
>> 题目：编写一个“打地鼠”网页小游戏
需求描述：
设计一个基于HTML的“打地鼠”（Whack-a-Mole）小游戏，玩家需要在规定时间内点击随机出现的“地鼠”来得分。游戏需要包含以下功能和要求：
页面布局：
游戏区域是一个3x3的网格（共9个格子），每个格子是一个方形的“洞”。
页面顶部显示当前得分（Score）和剩余时间（Time Left）。
页面底部有一个“开始游戏”（Start Game）的按钮。
游戏逻辑：
点击“开始游戏”按钮后，游戏开始，初始时间为30秒。
每隔一段随机时间（0.5秒到1.5秒之间），一个“地鼠”会随机出现在某个格子中，持续显示1秒后消失。
玩家点击出现的“地鼠”可以得分，每只地鼠加1分。
如果点击空白格子，不扣分也不加分。
游戏时间结束后，停止地鼠出现，并弹窗显示最终得分，同时提供“再玩一次”的选项。
样式要求：
游戏区域居中，背景为浅灰色。
每个格子为100x100像素，带有圆角边框，初始为土黄色（#d2b48c）。
地鼠出现时，格子背景变为绿色（#90ee90），并显示文字“鼠！”（字体大小30px，居中）。
得分和时间使用清晰的大字体（建议20px以上），颜色为深蓝色。
“开始游戏”按钮为蓝色背景，白色文字，悬停时变亮。
技术要求：
使用纯HTML、CSS和JavaScript实现，不依赖外部库。
代码注释清晰，说明每个部分的功能。
确保游戏逻辑无明显bug，例如地鼠不会同时出现在多个格子。
提示词：
HTML结构：包含游戏容器、得分显示、时间显示、格子网格和按钮。
CSS样式：网格布局、格子样式、地鼠出现时的动态效果、按钮交互样式。
JavaScript逻辑：随机生成地鼠、计时器、得分计算、游戏状态管理、弹窗提示。
输出要求：
请一次性提供完整的HTML文件代码（包括HTML、CSS和JavaScript），代码需可直接保存为.html文件并在浏览器中运行。代码中需包含注释，体现逻辑清晰度和编程能力。
GROK3:
```
<!DOCTYPE html>
<html lang="zh-CN">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>打地鼠小游戏</title>
<style>
/* 整体页面样式 */
body {
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
height: 100vh;
margin: 0;
font-family: Arial, sans-serif;
background-color: #f0f0f0;
}
/* 顶部得分和时间显示 */
.info {
display: flex;
justify-content: space-between;
width: 320px;
margin-bottom: 20px;
}
.info span {
font-size: 24px;
color: #00008b; /* 深蓝色 */
}
/* 游戏区域网格 */
.game-board {
display: grid;
grid-template-columns: repeat(3, 100px);
grid-gap: 10px;
background-color: #d3d3d3; /* 浅灰色背景 */
padding: 10px;
border-radius: 10px;
}
/* 每个格子样式 */
.hole {
width: 100px;
height: 100px;
background-color: #d2b48c; /* 土黄色 */
border-radius: 10px;
display: flex;
align-items: center;
justify-content: center;
font-size: 30px;
color: #000;
cursor: pointer;
transition: background-color 0.2s;
}
/* 地鼠出现时的样式 */
.hole.mole {
background-color: #90ee90; /* 绿色 */
}
/* 开始按钮样式 */
.start-btn {
margin-top: 20px;
padding: 10px 20px;
font-size: 18px;
color: #fff;
background-color: #4682b4; /* 蓝色 */
border: none;
border-radius: 5px;
cursor: pointer;
transition: background-color 0.3s;
}
.start-btn:hover {
background-color: #5f9ea0; /* 悬停时变亮 */
}
</style>
</head>
<body>
<!-- 顶部信息 -->
<div class="info">
<span id="score">得分: 0</span>
<span id="time-left">剩余时间: 30</span>
</div>
<!-- 游戏区域 -->
<div class="game-board" id="gameBoard">
<!-- 9个格子 -->
<div class="hole" data-id="0"></div>
<div class="hole" data-id="1"></div>
<div class="hole" data-id="2"></div>
<div class="hole" data-id="3"></div>
<div class="hole" data-id="4"></div>
<div class="hole" data-id="5"></div>
<div class="hole" data-id="6"></div>
<div class="hole" data-id="7"></div>
<div class="hole" data-id="8"></div>
</div>
<!-- 开始按钮 -->
<button class="start-btn" id="startBtn">开始游戏</button>
<script>
// 获取DOM元素
const scoreDisplay = document.getElementById('score');
const timeLeftDisplay = document.getElementById('time-left');
const gameBoard = document.getElementById('gameBoard');
const startBtn = document.getElementById('startBtn');
const holes = document.querySelectorAll('.hole');
// 游戏状态变量
let score = 0;
let timeLeft = 30;
let gameActive = false;
let moleTimer = null;
let countdownTimer = null;
// 初始化游戏
function initGame() {
score = 0;
timeLeft = 30;
gameActive = false;
scoreDisplay.textContent = `得分: ${score}`;
timeLeftDisplay.textContent = `剩余时间: ${timeLeft}`;
clearInterval(moleTimer);
clearInterval(countdownTimer);
holes.forEach(hole => {
hole.classList.remove('mole');
hole.textContent = '';
});
}
// 随机选择一个格子显示地鼠
function showMole() {
if (!gameActive) return;
// 移除之前的地鼠
holes.forEach(hole => {
hole.classList.remove('mole');
hole.textContent = '';
});
// 随机选择一个格子
const randomHole = holes[Math.floor(Math.random() * holes.length)];
randomHole.classList.add('mole');
randomHole.textContent = '鼠！';
// 1秒后隐藏地鼠
setTimeout(() => {
randomHole.classList.remove('mole');
randomHole.textContent = '';
}, 1000);
// 随机间隔后再次显示地鼠
const randomInterval = Math.random() * 1000 + 500; // 0.5到1.5秒
moleTimer = setTimeout(showMole, randomInterval);
}
// 点击格子的事件
function hitMole(e) {
const hole = e.target;
if (hole.classList.contains('mole')) {
score++;
scoreDisplay.textContent = `得分: ${score}`;
hole.classList.remove('mole');
hole.textContent = '';
}
}
// 开始游戏
function startGame() {
if (gameActive) return; // 防止重复开始
initGame();
gameActive = true;
startBtn.disabled = true;
// 开始倒计时
countdownTimer = setInterval(() => {
timeLeft--;
timeLeftDisplay.textContent = `剩余时间: ${timeLeft}`;
if (timeLeft <= 0) {
endGame();
}
}, 1000);
// 开始地鼠出现
showMole();
}
// 游戏结束
function endGame() {
gameActive = false;
clearInterval(moleTimer);
clearInterval(countdownTimer);
startBtn.disabled = false;
alert(`游戏结束！你的得分是: ${score}\n点击“确定”再玩一次！`);
initGame();
}
// 事件绑定
startBtn.addEventListener('click', startGame);
holes.forEach(hole => hole.addEventListener('click', hitMole));
// 初始化游戏状态
initGame();
</script>
</body>
</html>
```
R1:
```
<!DOCTYPE html>
<html lang="zh-CN">
<head>
<meta charset="UTF-8">
<title>打地鼠 - Whack a Mole</title>
<style>
/* 页面整体样式 */
body {
font-family: Arial, sans-serif;
display: flex;
flex-direction: column;
align-items: center;
background-color: #f0f0f0;
margin: 0;
min-height: 100vh;
}
/* 游戏信息显示区域 */
.game-info {
margin: 20px 0;
font-size: 24px;
color: #00008b;
display: flex;
gap: 30px;
}
/* 游戏主容器（3x3网格） */
#game-board {
display: grid;
grid-template-columns: repeat(3, 100px);
gap: 10px;
background-color: #cccccc;
padding: 20px;
border-radius: 10px;
}
/* 单个地鼠洞样式 */
.hole {
width: 100px;
height: 100px;
background-color: #d2b48c;
border-radius: 8px;
cursor: pointer;
display: flex;
justify-content: center;
align-items: center;
font-size: 0; /* 初始隐藏文字 */
transition: background-color 0.2s;
}
/* 地鼠出现时的样式 */
.hole.active {
background-color: #90ee90;
font-size: 30px; /* 显示文字 */
}
/* 开始游戏按钮 */
#start-btn {
margin-top: 30px;
padding: 12px 30px;
background-color: #0000ff;
color: white;
border: none;
border-radius: 5px;
cursor: pointer;
font-size: 18px;
transition: background-color 0.2s;
}
#start-btn:hover {
background-color: #3333ff;
}
#start-btn:disabled {
background-color: #888888;
cursor: not-allowed;
}
</style>
</head>
<body>
<!-- 游戏信息显示 -->
<div class="game-info">
<div>得分：<span id="score">0</span></div>
<div>剩余时间：<span id="timer">30</span>秒</div>
</div>
<!-- 游戏主区域 -->
<div id="game-board">
<!-- 生成9个地鼠洞 -->
<div class="hole"></div>
<div class="hole"></div>
<div class="hole"></div>
<div class="hole"></div>
<div class="hole"></div>
<div class="hole"></div>
<div class="hole"></div>
<div class="hole"></div>
<div class="hole"></div>
</div>
<!-- 控制按钮 -->
<button id="start-btn">开始游戏</button>
<script>
// 游戏全局变量
let score = 0;
let timeLeft = 30;
let gameActive = false;
let moleTimer = null;
let countdownTimer = null;
// DOM元素引用
const holes = document.querySelectorAll('.hole');
const scoreDisplay = document.getElementById('score');
const timerDisplay = document.getElementById('timer');
const startBtn = document.getElementById('start-btn');
// 初始化点击事件监听
holes.forEach(hole => {
hole.addEventListener('click', () => {
if (!gameActive) return;
// 点击有效的地鼠
if (hole.classList.contains('active')) {
score++;
scoreDisplay.textContent = score;
hole.classList.remove('active');
hole.textContent = '';
}
});
});
// 开始游戏按钮功能
startBtn.addEventListener('click', () => {
if (!gameActive) {
startGame();
}
});
// 游戏主逻辑
function startGame() {
// 重置游戏状态
gameActive = true;
score = 0;
timeLeft = 30;
scoreDisplay.textContent = score;
timerDisplay.textContent = timeLeft;
startBtn.disabled = true;
// 清除已有定时器
clearInterval(countdownTimer);
clearTimeout(moleTimer);
// 启动倒计时
countdownTimer = setInterval(() => {
timeLeft--;
timerDisplay.textContent = timeLeft;
if (timeLeft <= 0) {
endGame();
}
}, 1000);
// 首次生成地鼠
scheduleMole();
}
// 随机生成地鼠
function showMole() {
// 查找所有非活动状态的洞
const availableHoles = Array.from(holes).filter(hole => !hole.classList.contains('active'));
if (availableHoles.length > 0) {
const randomHole = availableHoles[Math.floor(Math.random() * availableHoles.length)];
randomHole.classList.add('active');
randomHole.textContent = '鼠！';
// 自动隐藏地鼠
setTimeout(() => {
randomHole.classList.remove('active');
randomHole.textContent = '';
}, 1000);
}
}
// 调度下一个地鼠生成
function scheduleMole() {
if (!gameActive) return;
// 随机间隔（0.5-1.5秒）
const delay = Math.random() * 1000 + 500;
moleTimer = setTimeout(() => {
showMole();
scheduleMole();
}, delay);
}
// 结束游戏处理
function endGame() {
gameActive = false;
clearInterval(countdownTimer);
clearTimeout(moleTimer);
startBtn.disabled = false;
// 显示最终得分
const restart = confirm(`游戏结束！最终得分：${score}\n再玩一次？`);
if (restart) {
startGame();
}
}
</script>
</body>
</html>
```

239
content/blog/1.技术栈/01.index.md
View File

@@ -1,239 +0,0 @@
---
title: 记录技术栈
description: 记录日常开发中遇到的技术问题和解决方案
date: 2025-08-07
img: https://lijue-me.oss-cn-chengdu.aliyuncs.com/20250806105153532.png
navigation:
icon: lucide-house
---
## 博客
使用过市面上的很多文档系统，但是或多或少都有一些自己不满意的功能.
于是自己动手，丰衣足食.
同时在 Markdown 语法的基础上增加了许多**魔法(自定义组件)**,比如:
::code-group
```mdc [index.md]
在 Markdown 中使用::card 标签,即可创建一个卡片,卡片里可以放置任何内容。比如以下内容:
::card
这里是卡片里的内容
::
```
```html [Card.vue]
<!-- Card组件: components/content/Card.vue -->
<template>
<div class="p-2 border bg-white dark:bg-black dark:border-gray-700 rounded">
<slot />
</div>
</template>
```
:::code-preview{icon="i-lucide-eye" label="Preview"}
::::example-card
这里是卡片里的内容
::::
:::
::
:::UPageCard{icon="lucide-code" title="代码组" description="这个组件使用 自定义的 Markdown 语法,从 Markdown 中提取代码块,并展示在页面上 (而其自身亦是一个卡片组)"}
::code-tree{defaultValue="nuxt.config.ts"}
```css [app/assets/main.css]
@import "tailwindcss" theme(static);
@import "@nuxt/ui-pro";
```
```ts [app/app.config.ts]
export default defineAppConfig({
ui: {
colors: {
primary: 'sky',
colors: 'slate'
}
}
});
```
```vue [app/app.vue]
<template>
<UApp>
<NuxtPage />
</UApp>
</template>
```
```json [package.json]
{
"name": "nuxt-app",
"private": true,
"type": "module",
"scripts": {
"build": "nuxt build",
"dev": "nuxt dev",
"generate": "nuxt generate",
"preview": "nuxt preview",
"postinstall": "nuxt prepare",
"typecheck": "nuxt typecheck"
},
"dependencies": {
"@iconify-json/lucide": "^1.2.18",
"@nuxt/ui-pro": "3.0.0-alpha.10",
"nuxt": "^3.15.1"
},
"devDependencies": {
"typescript": "^5.7.2",
"vue-tsc": "^2.2.0"
}
}
```
```json [tsconfig.json]
{
"extends": "./.nuxt/tsconfig.json"
}
```
```ts [nuxt.config.ts]
export default defineNuxtConfig({
modules: ['@nuxt/ui-pro'],
future: {
compatibilityVersion: 4
},
css: ['~/assets/main.css']
});
```
````md [README.md]
# Nuxt 3 Minimal Starter
Look at the [Nuxt 3 documentation](https://nuxt.com/docs/getting-started/introduction) to learn more.
## Setup
Make sure to install the dependencies:
```bash
# npm
npm install
# pnpm
pnpm install
# yarn
yarn install
# bun
bun install
```
## Development Server
Start the development server on `http://localhost:3000`:
```bash
# npm
npm run dev
# pnpm
pnpm run dev
# yarn
yarn dev
# bun
bun run dev
```
## Production
Build the application for production:
```bash
# npm
npm run build
# pnpm
pnpm run build
# yarn
yarn build
# bun
bun run build
```
Locally preview production build:
```bash
# npm
npm run preview
# pnpm
pnpm run preview
# yarn
yarn preview
# bun
bun run preview
```
Check out the [deployment documentation](https://nuxt.com/docs/getting-started/deployment) for more information.
````
::
:::
::code-group
```md [搜索.md]
#### 此组件打开一个模态搜索框,进行搜索
::::example-fulltext-content-search
::::
#### 此组件建立一个mini搜索框,进行搜索
::::example-fulltext-mini-search
::::
```
:::code-preview{label="预览模态组件" icon="i-lucide-eye"}
::::example-fulltext-content-search
::::
:::
:::code-preview{label="预览搜索框组件" icon="i-lucide-eye"}
::::example-fulltext-mini-search
::::
:::
::
::tip{icon="lucide-info" color="primary" class="text-black dark:text-white"}
阅读更多关于 [`自定义组件`](/简单文档/components/api) 的内容.
::
## 特性
- 基于 Nuxt 4 , Content v3 , Nuxt UI Pro 构建的文档系统。
- 完美支持 Markdown 和 相关扩展。
- 和 Vue 组件高度集成。
- 支持搜索,由Content v3 赋能。
- 支持多主题,使用Nuxt UI Pro。
- 开源且免费。
- 支持移动端。
## 致谢
- Nuxt Content：为 Vue 开发者简化内容管理。
- Nuxt UI Pro ：文档系统 UI 组件。
- Docus：获取灵感及一些文档组件源代码。
## License
MIT

136
content/blog/1.技术栈/02.Iperf3 万兆网络打流测试指南.md Normal file
View File

@@ -0,0 +1,136 @@
---
title: Iperf3 万兆网络打流测试指南
description: Iperf3 万兆网络打流测试指南
date: 2025-05-13
img: https://lijue-me.oss-cn-chengdu.aliyuncs.com/20250615184111247.png
navigation:
icon: lucide-network
---
> 🔍 **文档说明**: 本文记录基于水星S106E Pro交换机的万兆网络Iperf3性能测试，涵盖设备连接、测试参数配置及结果分析。适用于**网络性能测试初学者**及**运维人员**。
## 技术TAG
`#Iperf3` `#万兆网络测试` `#交换机配置` `#AQC113网卡` `#网络性能分析`
---
## 一、测试环境配置
### 设备拓扑图
```mermaid
graph LR
A[MacBook Air M4] -- 雷电/万兆电口 --> B[水星S106E Pro<br>万兆光口]
B -- 万兆光口 --> C[PVE服务器<br>CX4121A网卡]
```
### 硬件清单
| **设备** | **规格** | **作用** |
|---------------------|-----------------------------------------|-----------------------|
| 主测试端 | MacBook Air M4 + 雷电万兆网卡(AQC113) | Iperf3 Client端 |
| 交换机 | 水星S106E Pro | 万兆光/电转换枢纽 |
| 光转电模块 | AQR113光转电模块 | 连接交换机万兆光口 |
| 被测服务端 | NAS (12500T+Q670) + CX4121A万兆网卡 | Iperf3 Server端 |
| 辅助设备 | 超六类网线/光纤跳线(按需) | 物理链路连接 |
```
---
## 二、Iperf3安装与配置
### 1. macOS端安装（Client）
```bash
# 通过Homebrew安装iperf3
brew install iperf3
# 启动服务端监听（可选本地验证）
iperf3 -s -p 5201
```
### 2. PVE服务端安装（Server）
```bash
# Debian系系统安装
apt update && apt install iperf3 -y
# 启动服务端后台监听
iperf3 -s -D -p 5201
```
> ⚠️ **防火墙注意**: 确保5201端口开放
> `ufw allow 5201/tcp` (Debian/Ubuntu)
> `firewall-cmd --add-port=5201/tcp --permanent` (CentOS)
```
## 三、典型测试场景
### 场景1：TCP带宽测试（默认参数）
```bash
# Client端执行（MacBook）
iperf3 -c <Server_IP> -p 5201 -t 60
# 参数说明：
# -c : 服务端IP地址
# -t : 测试持续时间(秒)
```
### 场景2：多线程UDP压力测试
```bash
iperf3 -c <Server_IP> -p 5201 -u -b 10G -P 4
# 参数说明：
# -u : 使用UDP协议
# -b : 指定带宽(10G速率)
# -P : 并行线程数
```
### 场景3：双向流量测试
```bash
# 同时测试上行+下行
iperf3 -c <Server_IP> -p 5201 --bidir
```
---
## 四、测试结果分析要点
### 关键性能指标
| **字段** | **健康值范围** | **异常排查方向** |
|------------------|-------------------------|------------------------|
| Bandwidth | >9.5Gbps (万兆场景) | 网卡协商/模块兼容性 |
| Jitter | <1ms (UDP测试) | 交换机缓存/线缆质量 |
| Packet Loss | 0% | 缓冲区设置/CPU性能 |
| TCP Retransmits | <0.1% | TCP窗口/MTU配置 |
> 💡 **优化建议**：
> 1. 使用`-w`调整TCP窗口大小（例如`-w 8M`）
> 2. 尝试`--omit N`跳过初始N秒不稳定数据
> 3. 添加`-J`参数获取JSON格式结构化结果
---
## 五、常见问题解决
### ❌ 问题1：协商速率降级至1Gbps
```bash
# 检查网卡协商状态（MacOS）
ifconfig enX | grep media
# 解决方案：
1. 更换光模块/AOC线缆排除物理故障
2. 检查交换机端口配置（禁用节能模式）
```
### ❌ 问题2：测试中突发丢包
```bash
# 动态查看QoS统计（PVE服务器）
ethtool -S enpXX | grep -E 'drop|error'
# 解决方案：
1. 调整网卡缓冲区：ethtool -G enpXX rx/tx 4096
2. 减少并发线程总数（-P参数）
```
![万兆测试拓扑示意图](https://example.com/img/10g-test-diagram.png)
*(示意图：实际连接需确保光模块端口匹配)*
> 📌 **经验总结**：水星S106E Pro需关闭"绿色节能"功能，避免AQC113因节能策略降速。PVE虚拟机环境建议使用SR-IOV直通网卡，减少虚拟化层开销。
---
**测试文档版本**: v1.1
**更新日期**: 2023-12-15
**测试工具版本**: iperf 3.16 (macOS)/iperf 3.7 (Linux)

213
content/blog/1.技术栈/03.Debian 12 云服务器初始安全设置与优化指南.md Normal file
View File

@@ -0,0 +1,213 @@
---
title: Debian 12 云服务器初始安全设置与优化指南
description: Debian 12 云服务器初始安全设置与优化指南
date: 2025-05-15
img: https://lijue-me.oss-cn-chengdu.aliyuncs.com/20250807105153532.png
navigation:
icon: lucide-server
---
> 🔒 **文档说明**：本文针对新部署的 Debian 12 云服务器，提供必做的安全加固与性能优化配置清单。适用于**运维人员**及**Linux初学者**，可有效防御 90% 的常见攻击向量。
## 技术TAG
`#Debian12安全设置` `#Linux加固` `#服务器优化` `#云服务器安全` `#SSH加固`
---
## 一、初始登录与用户安全
### 1. 创建替代root的用户
```bash
# 创建管理员用户（示例用户名为 sysadmin）
adduser sysadmin
usermod -aG sudo sysadmin
# 验证新用户sudo权限
su - sysadmin
sudo whoami # 应返回root
```
### 2. 禁用root SSH登录
```bash
sudo nano /etc/ssh/sshd_config
# 修改以下配置：
PermitRootLogin no
PasswordAuthentication no # 强制使用密钥登录
```
> ⚠️ **关键提示**：
> 1. 操作前必须配置好SSH密钥，否则会锁定服务器
> 2. 执行后重载服务：`sudo systemctl reload ssh`
---
## 二、防火墙配置
### UFW基础设置
```bash
# 安装UFW
sudo apt install ufw -y
# 默认策略
sudo ufw default deny incoming
sudo ufw default allow outgoing
# 允许端口（按需开放）
sudo ufw allow 22/tcp # SSH
sudo ufw allow 80/tcp # HTTP
sudo ufw allow 443/tcp # HTTPS
# 启用防火墙
sudo ufw enable
sudo ufw status verbose # 验证规则
```
### 端口安全技巧
```bash
# 更改SSH端口（可选）
sudo nano /etc/ssh/sshd_config
# 修改: Port 2222 # 改为非标准端口
# 仅允许特定IP访问SSH
sudo ufw allow proto tcp from 192.168.1.100 to any port 22
```
---
## 三、系统更新与自动维护
### 初始全面更新
```bash
sudo apt update && sudo apt full-upgrade -y
sudo apt autoremove && sudo apt clean
```
### 配置自动安全更新
```bash
sudo apt install unattended-upgrades apt-listchanges
# 启用配置
sudo dpkg-reconfigure -plow unattended-upgrades
# 验证状态：
sudo systemctl status unattended-upgrades
```
> 🔧 **配置文件优化** (`/etc/apt/apt.conf.d/50unattended-upgrades`)：
> ```json
> Unattended-Upgrade::Remove-Unused-Dependencies "true";
> Unattended-Upgrade::Automatic-Reboot "true";
> Unattended-Upgrade::Automatic-Reboot-Time "03:00";
> ```
---
## 四、安全加固关键措施
### 1. 启用基础入侵防护
```bash
# 安装fail2ban
sudo apt install fail2ban -y
# 配置SSH防护
sudo cp /etc/fail2ban/jail.conf /etc/fail2ban/jail.local
sudo nano /etc/fail2ban/jail.local
```
```ini
[sshd]
enabled = true
maxretry = 3
bantime = 1h
```
### 2. 内核安全加固
```bash
# 安装安全组件
sudo apt install linux-hardened apparmor apparmor-utils -y
# 启用AppArmor
sudo apparmor_status
sudo aa-enforce /etc/apparmor.d/* # 强制所有配置
```
---
## 五、性能优化设置
### 1. 交换空间优化
```bash
# 调整Swappiness值（推荐10-30）
echo 'vm.swappiness=10' | sudo tee -a /etc/sysctl.conf
# 启用Zswap压缩缓存（内存<8GB时尤其有效）
echo 'zswap.enabled=1' | sudo tee -a /etc/sysctl.conf
```
### 2. 文件描述符与进程优化
```bash
# 提高系统限制
sudo nano /etc/security/limits.conf
```
```conf
* soft nofile 65535
* hard nofile 65535
* soft nproc 65535
* hard nproc 65535
```
### 3. 日志管理（防止占满磁盘）
```bash
# 安装日志轮询工具
sudo apt install logrotate -y
# 手动压缩现有大日志
sudo find /var/log -size +100M -exec truncate -s 10M {} \;
```
---
## 六、审计与监控
### 安装基础监控组件
```bash
sudo apt install sysstat htop net-tools tree ncdu
# 启用sysstat数据收集
sudo sed -i 's/false/true/g' /etc/default/sysstat
sudo systemctl enable --now sysstat
```
### 关键审计命令
```bash
# 检查异常登录：
sudo lastb -a | head -20
# 检查SUID文件：
sudo find / -perm /4000 -ls
# 列出开放端口：
sudo ss -tunlp
```
> 📊 **推荐可视化工具**：
> - Cockpit (轻量级Web面板)：`sudo apt install cockpit`
> - Netdata (实时监控)：`bash <(curl -Ss https://my-netdata.io/kickstart.sh)`
---
**最终安全检查清单**：
```bash
echo "[+] SSH 配置"
sudo sshd -t && grep -E "PermitRoot|PasswordAuth" /etc/ssh/sshd_config
echo "[+] 防火墙状态"
sudo ufw status
echo "[]+ 更新状态"
sudo unattended-upgrades --dry-run
```
![服务器安全架构](https://example.com/img/debian-security-layers.png)
*(安全层示意图：网络防火墙→系统加固→应用防护)*
> 🔐 **维护建议**：
> 1. 每月执行：`sudo lynis audit system` (安装：`apt install lynis`)
> 2. 每季度更新所有SSL证书，即使未到期
> 3. 使用自动配置管理工具（如Ansible）维护服务器状态
**文档版本**: v1.2
**测试环境**: Debian 12.5 (Kernel 6.1.x) 云服务器
**最后更新**: 2024-06-15

213
content/blog/1.技术栈/04.Dify + Supabase：打造带数据库的AI问答机器人.md Normal file
View File

@@ -0,0 +1,213 @@
---
title: Dify + Supabase：打造带数据库的AI问答机器人
description: 基于Dify和Supabase的AI问答机器人
date: 2025-05-18
img: https://lijue-me.oss-cn-chengdu.aliyuncs.com/20250807175904733.png
navigation:
icon: simple-icons:reactbootstrap
---
> 🔒 **文档说明**：本文针对新部署的 Debian 12 云服务器，提供必做的安全加固与性能优化配置清单。适用于**运维人员**及**Linux初学者**，可有效防御 90% 的常见攻击向量。
## 技术TAG
`#Debian12安全设置` `#Linux加固` `#服务器优化` `#云服务器安全` `#SSH加固`
---
## 一、初始登录与用户安全
### 1. 创建替代root的用户
```bash
# 创建管理员用户（示例用户名为 sysadmin）
adduser sysadmin
usermod -aG sudo sysadmin
# 验证新用户sudo权限
su - sysadmin
sudo whoami # 应返回root
```
### 2. 禁用root SSH登录
```bash
sudo nano /etc/ssh/sshd_config
# 修改以下配置：
PermitRootLogin no
PasswordAuthentication no # 强制使用密钥登录
```
> ⚠️ **关键提示**：
> 1. 操作前必须配置好SSH密钥，否则会锁定服务器
> 2. 执行后重载服务：`sudo systemctl reload ssh`
---
## 二、防火墙配置
### UFW基础设置
```bash
# 安装UFW
sudo apt install ufw -y
# 默认策略
sudo ufw default deny incoming
sudo ufw default allow outgoing
# 允许端口（按需开放）
sudo ufw allow 22/tcp # SSH
sudo ufw allow 80/tcp # HTTP
sudo ufw allow 443/tcp # HTTPS
# 启用防火墙
sudo ufw enable
sudo ufw status verbose # 验证规则
```
### 端口安全技巧
```bash
# 更改SSH端口（可选）
sudo nano /etc/ssh/sshd_config
# 修改: Port 2222 # 改为非标准端口
# 仅允许特定IP访问SSH
sudo ufw allow proto tcp from 192.168.1.100 to any port 22
```
---
## 三、系统更新与自动维护
### 初始全面更新
```bash
sudo apt update && sudo apt full-upgrade -y
sudo apt autoremove && sudo apt clean
```
### 配置自动安全更新
```bash
sudo apt install unattended-upgrades apt-listchanges
# 启用配置
sudo dpkg-reconfigure -plow unattended-upgrades
# 验证状态：
sudo systemctl status unattended-upgrades
```
> 🔧 **配置文件优化** (`/etc/apt/apt.conf.d/50unattended-upgrades`)：
> ```json
> Unattended-Upgrade::Remove-Unused-Dependencies "true";
> Unattended-Upgrade::Automatic-Reboot "true";
> Unattended-Upgrade::Automatic-Reboot-Time "03:00";
> ```
---
## 四、安全加固关键措施
### 1. 启用基础入侵防护
```bash
# 安装fail2ban
sudo apt install fail2ban -y
# 配置SSH防护
sudo cp /etc/fail2ban/jail.conf /etc/fail2ban/jail.local
sudo nano /etc/fail2ban/jail.local
```
```ini
[sshd]
enabled = true
maxretry = 3
bantime = 1h
```
### 2. 内核安全加固
```bash
# 安装安全组件
sudo apt install linux-hardened apparmor apparmor-utils -y
# 启用AppArmor
sudo apparmor_status
sudo aa-enforce /etc/apparmor.d/* # 强制所有配置
```
---
## 五、性能优化设置
### 1. 交换空间优化
```bash
# 调整Swappiness值（推荐10-30）
echo 'vm.swappiness=10' | sudo tee -a /etc/sysctl.conf
# 启用Zswap压缩缓存（内存<8GB时尤其有效）
echo 'zswap.enabled=1' | sudo tee -a /etc/sysctl.conf
```
### 2. 文件描述符与进程优化
```bash
# 提高系统限制
sudo nano /etc/security/limits.conf
```
```conf
* soft nofile 65535
* hard nofile 65535
* soft nproc 65535
* hard nproc 65535
```
### 3. 日志管理（防止占满磁盘）
```bash
# 安装日志轮询工具
sudo apt install logrotate -y
# 手动压缩现有大日志
sudo find /var/log -size +100M -exec truncate -s 10M {} \;
```
---
## 六、审计与监控
### 安装基础监控组件
```bash
sudo apt install sysstat htop net-tools tree ncdu
# 启用sysstat数据收集
sudo sed -i 's/false/true/g' /etc/default/sysstat
sudo systemctl enable --now sysstat
```
### 关键审计命令
```bash
# 检查异常登录：
sudo lastb -a | head -20
# 检查SUID文件：
sudo find / -perm /4000 -ls
# 列出开放端口：
sudo ss -tunlp
```
> 📊 **推荐可视化工具**：
> - Cockpit (轻量级Web面板)：`sudo apt install cockpit`
> - Netdata (实时监控)：`bash <(curl -Ss https://my-netdata.io/kickstart.sh)`
---
**最终安全检查清单**：
```bash
echo "[+] SSH 配置"
sudo sshd -t && grep -E "PermitRoot|PasswordAuth" /etc/ssh/sshd_config
echo "[+] 防火墙状态"
sudo ufw status
echo "[]+ 更新状态"
sudo unattended-upgrades --dry-run
```
![服务器安全架构](https://example.com/img/debian-security-layers.png)
*(安全层示意图：网络防火墙→系统加固→应用防护)*
> 🔐 **维护建议**：
> 1. 每月执行：`sudo lynis audit system` (安装：`apt install lynis`)
> 2. 每季度更新所有SSL证书，即使未到期
> 3. 使用自动配置管理工具（如Ansible）维护服务器状态
**文档版本**: v1.2
**测试环境**: Debian 12.5 (Kernel 6.1.x) 云服务器
**最后更新**: 2024-06-15

213
content/blog/1.技术栈/05.安装 VS Code到浏览器 -- Code Server copy.md Normal file
View File

@@ -0,0 +1,213 @@
---
title: 安装 VS Code到浏览器 -- Code Server
description: 在浏览器中安装 VS Code
date: 2025-05-23
img: https://lijue-me.oss-cn-chengdu.aliyuncs.com/20250616220449750.png
navigation:
icon: simple-icons:visualstudiocode
---
> 🔒 **文档说明**：本文针对新部署的 Debian 12 云服务器，提供必做的安全加固与性能优化配置清单。适用于**运维人员**及**Linux初学者**，可有效防御 90% 的常见攻击向量。
## 技术TAG
`#Debian12安全设置` `#Linux加固` `#服务器优化` `#云服务器安全` `#SSH加固`
---
## 一、初始登录与用户安全
### 1. 创建替代root的用户
```bash
# 创建管理员用户（示例用户名为 sysadmin）
adduser sysadmin
usermod -aG sudo sysadmin
# 验证新用户sudo权限
su - sysadmin
sudo whoami # 应返回root
```
### 2. 禁用root SSH登录
```bash
sudo nano /etc/ssh/sshd_config
# 修改以下配置：
PermitRootLogin no
PasswordAuthentication no # 强制使用密钥登录
```
> ⚠️ **关键提示**：
> 1. 操作前必须配置好SSH密钥，否则会锁定服务器
> 2. 执行后重载服务：`sudo systemctl reload ssh`
---
## 二、防火墙配置
### UFW基础设置
```bash
# 安装UFW
sudo apt install ufw -y
# 默认策略
sudo ufw default deny incoming
sudo ufw default allow outgoing
# 允许端口（按需开放）
sudo ufw allow 22/tcp # SSH
sudo ufw allow 80/tcp # HTTP
sudo ufw allow 443/tcp # HTTPS
# 启用防火墙
sudo ufw enable
sudo ufw status verbose # 验证规则
```
### 端口安全技巧
```bash
# 更改SSH端口（可选）
sudo nano /etc/ssh/sshd_config
# 修改: Port 2222 # 改为非标准端口
# 仅允许特定IP访问SSH
sudo ufw allow proto tcp from 192.168.1.100 to any port 22
```
---
## 三、系统更新与自动维护
### 初始全面更新
```bash
sudo apt update && sudo apt full-upgrade -y
sudo apt autoremove && sudo apt clean
```
### 配置自动安全更新
```bash
sudo apt install unattended-upgrades apt-listchanges
# 启用配置
sudo dpkg-reconfigure -plow unattended-upgrades
# 验证状态：
sudo systemctl status unattended-upgrades
```
> 🔧 **配置文件优化** (`/etc/apt/apt.conf.d/50unattended-upgrades`)：
> ```json
> Unattended-Upgrade::Remove-Unused-Dependencies "true";
> Unattended-Upgrade::Automatic-Reboot "true";
> Unattended-Upgrade::Automatic-Reboot-Time "03:00";
> ```
---
## 四、安全加固关键措施
### 1. 启用基础入侵防护
```bash
# 安装fail2ban
sudo apt install fail2ban -y
# 配置SSH防护
sudo cp /etc/fail2ban/jail.conf /etc/fail2ban/jail.local
sudo nano /etc/fail2ban/jail.local
```
```ini
[sshd]
enabled = true
maxretry = 3
bantime = 1h
```
### 2. 内核安全加固
```bash
# 安装安全组件
sudo apt install linux-hardened apparmor apparmor-utils -y
# 启用AppArmor
sudo apparmor_status
sudo aa-enforce /etc/apparmor.d/* # 强制所有配置
```
---
## 五、性能优化设置
### 1. 交换空间优化
```bash
# 调整Swappiness值（推荐10-30）
echo 'vm.swappiness=10' | sudo tee -a /etc/sysctl.conf
# 启用Zswap压缩缓存（内存<8GB时尤其有效）
echo 'zswap.enabled=1' | sudo tee -a /etc/sysctl.conf
```
### 2. 文件描述符与进程优化
```bash
# 提高系统限制
sudo nano /etc/security/limits.conf
```
```conf
* soft nofile 65535
* hard nofile 65535
* soft nproc 65535
* hard nproc 65535
```
### 3. 日志管理（防止占满磁盘）
```bash
# 安装日志轮询工具
sudo apt install logrotate -y
# 手动压缩现有大日志
sudo find /var/log -size +100M -exec truncate -s 10M {} \;
```
---
## 六、审计与监控
### 安装基础监控组件
```bash
sudo apt install sysstat htop net-tools tree ncdu
# 启用sysstat数据收集
sudo sed -i 's/false/true/g' /etc/default/sysstat
sudo systemctl enable --now sysstat
```
### 关键审计命令
```bash
# 检查异常登录：
sudo lastb -a | head -20
# 检查SUID文件：
sudo find / -perm /4000 -ls
# 列出开放端口：
sudo ss -tunlp
```
> 📊 **推荐可视化工具**：
> - Cockpit (轻量级Web面板)：`sudo apt install cockpit`
> - Netdata (实时监控)：`bash <(curl -Ss https://my-netdata.io/kickstart.sh)`
---
**最终安全检查清单**：
```bash
echo "[+] SSH 配置"
sudo sshd -t && grep -E "PermitRoot|PasswordAuth" /etc/ssh/sshd_config
echo "[+] 防火墙状态"
sudo ufw status
echo "[]+ 更新状态"
sudo unattended-upgrades --dry-run
```
![服务器安全架构](https://example.com/img/debian-security-layers.png)
*(安全层示意图：网络防火墙→系统加固→应用防护)*
> 🔐 **维护建议**：
> 1. 每月执行：`sudo lynis audit system` (安装：`apt install lynis`)
> 2. 每季度更新所有SSL证书，即使未到期
> 3. 使用自动配置管理工具（如Ansible）维护服务器状态
**文档版本**: v1.2
**测试环境**: Debian 12.5 (Kernel 6.1.x) 云服务器
**最后更新**: 2024-06-15

241
content/blog/1.技术栈/06.Debian 12 安装nodejs.md Normal file
View File

@@ -0,0 +1,241 @@
---
title: Debian 12 安装nodejs
description: 在Debian 12 中安装nodejs
date: 2025-05-25
img: https://lijue-me.oss-cn-chengdu.aliyuncs.com/20250618160517581.png
navigation:
icon: simple-icons:debian
---
### **方法 1：使用 Debian 官方仓库（简单但不一定最新）**
```bash
# 更新软件包列表
sudo apt update
# 安装 Node.js 和 npm
sudo apt install -y nodejs npm
# 验证安装
node -v
npm -v
```
**特点**：
- 安装最简单快捷
- 版本可能较旧（Debian 12 默认提供 Node.js 18.x）
- 适合不需要最新版本的用户
---
### **方法2：使用volta安装**
```bash
# On most Unix systems including macOS, you can install with a single command:
curl https://get.volta.sh | bash
# Download and install Node.js:
volta install node@22
# Verify the Node.js version:
node -v # Should print "v22.16.0".
# Verify npm version:
npm -v # Should print "10.9.2".
# Download and install pnpm:
volta install pnpm
# Verify pnpm version:
pnpm -v # Should print "10.12.1".
```
---
### **方法 3：手动下载二进制包（灵活选择版本）**
[官网](https://nodejs.org/)
```bash
# 1. 下载指定版本（示例为 v20.x）
wget https://nodejs.org/dist/v22.16.0/node-v22.16.0-linux-x64.tar.xz
# 创建目录
sudo mkdir -p /usr/local/lib/nodejs
# 解压
sudo tar -xJf node-v22.16.0-linux-x64.tar.xz -C /usr/local/lib/nodejs
# 创建对应的软链接
# 创建 node 软链
sudo ln -s /usr/local/lib/nodejs/node-v22.16.0-linux-x64/bin/node /usr/bin/node
# 创建 npm 软链
sudo ln -s /usr/local/lib/nodejs/node-v22.16.0-linux-x64/bin/npm /usr/bin/npm
# 创建 npx 软链
sudo ln -s /usr/local/lib/nodejs/node-v22.16.0-linux-x64/bin/npx /usr/bin/npx
# 在~/.bashrc文件末尾中加入nodejs到PATH环境变量中
export PATH=/usr/local/lib/node-v22.16.0-linux-x64/bin:$PATH
# 重载 ~/.profile
source ~/.bashrc
# 4. 验证安装
node -v
npm -v
```
**特点**：
- 可自由选择任何版本
- 不依赖系统仓库
- 需要手动更新版本
---
### **安装 pnpm、yarn、bun、cpnm**
如果没有配置镜像加速，先配置加速：
```bash
npm config set registry https://registry.npmmirror.com
```
#### **安装 cnpm**
```bash
# 全局安装
sudo npm install -g cnpm --registry=https://registry.npmmirror.com
# 查看安装情况
ls -la /usr/local/lib/nodejs/node-v22.16.0-linux-x64/bin
# 创建 cnpm 软链
sudo ln -s /usr/local/lib/nodejs/node-v22.16.0-linux-x64/bin/cnpm /usr/bin/cnpm
# 查看版本
cnpm -v
```
#### **安装 pnpm**
```bash
# 全局安装
sudo npm install -g pnpm
# 查看安装情况
ls -la /usr/local/lib/nodejs/node-v22.16.0-linux-x64/bin
# 创建 pnpm 软链
sudo ln -s /usr/local/lib/nodejs/node-v22.16.0-linux-x64/bin/npx /usr/bin/pnpm
# 查看版本
pnpm -v
```
#### **安装 yarn**
```bash
# 全局安装
sudo npm install -g yarn
# 查看
ls -la /usr/local/lib/nodejs/node-v22.16.0-linux-x64/bin
# 创建 yarn 软链
sudo ln -s /usr/local/lib/nodejs/node-v22.16.0-linux-x64/bin/npx /usr/bin/yarn
# 查看版本
yarn -v
```
#### **安装 bun**
Linux用户-安装Bun需要解压缩包。使用 `sudo apt install unzip` 安装解压包。强烈建议使用5.6或更高版本的内核，但最低版本为5.1。使用 `uname -r` 检查内核版本。
```bash
# 全局安装
sudo cnpm install -g bun
# 查看
ls -la /usr/local/lib/nodejs/node-v22.16.0-linux-x64/bin
# 创建 bun 软链
sudo ln -s /usr/local/lib/nodejs/node-v22.16.0-linux-x64/bin/bun /usr/bin/bun
# 查看版本
bun -v
```
---
### **切换版本**
如需切换版本，例如 `v18.20.7`，可以删除现有的软链接：
```bash
sudo rm /usr/bin/node
sudo rm /usr/bin/npm
sudo rm /usr/bin/npx
sudo rm /usr/bin/pnpm
sudo rm /usr/bin/yarn
sudo rm /usr/bin/bun
sudo rm /usr/bin/cnpm
```
创建新的软链接：
```bash
sudo ln -s /usr/local/lib/nodejs/node-v18.20.7-linux-x64/bin/node /usr/bin/node
sudo ln -s /usr/local/lib/nodejs/node-v18.20.7-linux-x64/bin/npm /usr/bin/npm
sudo ln -s /usr/local/lib/nodejs/node-v18.20.7-linux-x64/bin/npx /usr/bin/npx
sudo ln -s /usr/local/lib/nodejs/node-v18.20.7-linux-x64/bin/pnpm /usr/bin/pnpm
sudo ln -s /usr/local/lib/nodejs/node-v18.20.7-linux-x64/bin/bun /usr/bin/bun
sudo ln -s /usr/local/lib/nodejs/node-v18.20.7-linux-x64/bin/cnpm /usr/bin/cnpm
```
验证安装：
```bash
node -v
npm -v
npx -v
pnpm -v
yarn -v
```
查看当前配置：
```bash
npm config list --json
```
---
### **方法 3：fnm方式安装(不推荐)**
#### **npm**
```bash
# Download and install fnm:
curl -o- https://fnm.vercel.app/install | bash
# Download and install Node.js:
fnm install 22
# Verify the Node.js version:
node -v # Should print "v22.16.0".
# Verify npm version:
npm -v # Should print "10.9.2".
```
#### **yarn**
```bash
# Download and install Yarn:
corepack enable yarn
# Verify Yarn version:
yarn -v
```
#### **pnpm**
```bash
# Download and install pnpm:
corepack enable pnpm
# Verify pnpm version:
pnpm -v
```
#### **nodejs包镜像加速**
```bash
npm config set registry https://registry.npmmirror.com
```
---
### **对比 npm、Yarn、pnpm**
| 特性 | npm | Yarn (v1/Yarn Classic) | Yarn Berry (v2+) | pnpm |
|---------------------------|------------------------------|------------------------------|------------------------------|------------------------------|
| **发布时间** | 2010 (Node.js 自带) | 2016 (Facebook 推出) | 2020 (Yarn 2.0 重大更新) | 2017 (独立发展) |
| **安装速度** | ⏳ 慢（线性安装） | 🚀 较快（并行下载） | 🚀 快（改进缓存） | ⚡ 极快（硬链接 + 符号链接） |
| **依赖管理** | node_modules 嵌套结构 | node_modules 扁平化 | Plug’n’Play (PnP) 无 node_modules | 硬链接 + 全局存储（节省空间） |
| **缓存机制** | 有缓存，但效率一般 | 缓存优化较好 | 增量缓存 + 零安装（Zero-Installs） | 全局存储，依赖可复用 |
| **锁文件** | package-lock.json | yarn.lock | yarn.lock + .pnp.cjs | pnpm-lock.yaml |
| **安全性** | 🔒 一般（依赖可能被篡改） | 🔒 较好（校验严格） | 🔒 最好（离线模式 + 校验） | 🔒 最好（内容可寻址存储） |
| **Monorepo 支持** | 有限（需配合 Lerna） | 支持 Workspaces | 原生 Workspaces + PnP | 原生 Workspaces + 高效链接 |
| **磁盘占用** | 高（重复依赖多） | 中（扁平化减少重复） | 低（PnP 无 node_modules） | 极低（全局存储 + 硬链接） |
| **命令行体验** | 基础功能 | 更友好（进度条、交互提示） | 现代化（插件系统） | 简洁高效 |
| **兼容性** | 100% 兼容 Node.js | 兼容 npm 生态 | 需适配 PnP（部分库不兼容） | 兼容 npm/Yarn 生态 |
| **推荐场景** | 简单项目 / Node.js 默认 | 旧项目迁移 / 稳定需求 | 大型 Monorepo / 严格依赖控制 | 高效开发 / 节省磁盘空间 |

30
content/blog/1.技术栈/07.MySQL 中如何忽略表名的大小写 copy.md Normal file
View File

@@ -0,0 +1,30 @@
---
title: Docker 里配置hosts
description: 在Docker里配置hosts
date: 2025-06-24
img: https://lijue-me.oss-cn-chengdu.aliyuncs.com/20250621163604646.png
navigation:
icon: simple-icons:docker
---
# 一：启动容器时加上“—add-host”参数
```
docker run
--add-host='lijue.me:127.0.0.1'
--add-host='www.lijue.me:192.168.1.1'
--name hello-docker
-it reg.lijue.me/public/hello-docker:latest
```
# 二：通过docker-compose配置extra_hosts属性
```
1. `version: '3'`
2. `services:`
3. `web:`
4. `image: hello-docker:latest`
5. `extra_hosts:`
6. `- 'www.lijue.me:192.168.1.1'`
7. `- 'lijue.me:127.0.0.1'`
```

35
content/blog/1.技术栈/07.MySQL 中如何忽略表名的大小写.md Normal file
View File

@@ -0,0 +1,35 @@
---
title: MySQL 中如何忽略表名的大小写
description: 如何在MySQL中忽略表名的大小写
date: 2025-06-01
img: https://lijue-me.oss-cn-chengdu.aliyuncs.com/20250619124538532.png
navigation:
icon: simple-icons:mysql
---
在 MySQL 中，默认情况下表名是大小写敏感的。但是你可以通过设置来实现忽略表名的大小写。有两种方法可以做到这一点：
方法一：修改配置文件
编辑 MySQL 的配置文件 my.cnf 或 my.ini（具体文件名取决于操作系统和 MySQL 版本），在 [mysqld] 部分添加以下行：
```
lower_case_table_names = 1
```
然后保存并重新启动 MySQL 服务。
设置为 0：表名大小写敏感（默认）。
设置为 1：将表名存储为小写，并在比较表名时不区分大小写。
设置为 2：将表名存储为小写，并在比较表名时区分大小写（仅在非 Windows 环境下可用）。
方法二：动态设置
如果无法修改配置文件，你可以在 MySQL 启动后，使用以下命令动态设置：
```
SET GLOBAL lower_case_table_names = 1;
```
请注意，这种方式在 MySQL 重启后会失效，除非再次设置。
在任何情况下，修改这个设置都需要谨慎考虑，因为它可能会影响现有的数据库和应用程序。在进行此类更改之前，请务必备份数据库，并确保了解潜在的影响和风险。

0
content/blog/2.AI/01.index.md → content/blog/2.AI/02.index.md
View File