企业知识助手是一款基于企业知识库构建的 AI 问答助手。

通过整理企业内部文档、规范、流程等资料，让用户可以通过自然语言快速查询相关信息，提高知识检索效率。

技术栈​

• AI 应用框架： Dify

• 大语言模型： DeepSeek

• 知识库方案： RAG（Retrieval-Augmented Generation，检索增强生成）

• 向量检索： Dify 内置知识库检索能力

• 文本处理： 文档解析、文本切片、Embedding 向量化

• 数据存储： 向量数据库（用于存储知识文档特征向量）

• Prompt 工程： 自定义角色设定、回答规则、知识库约束

• 部署方式： 基于 Web 应用部署

功能特点​

• 基于企业知识库内容进行回答
• 支持自然语言提问
• 降低企业内部信息查找成本
• 帮助员工快速获取业务资料

使用方式​

访问企业知识助手：

-点击此处🔗进入企业知识助手

输入你的问题后，助手会根据已有知识库内容进行检索并生成回答。

应用场景​

• 企业制度查询
• 员工培训资料检索
• 产品文档查询
• 项目流程说明
• 内部知识共享

项目展示​

该项目基于知识库 + 大语言模型实现，通过 RAG（检索增强生成）方式连接企业文档，让 AI 回答更加贴合实际业务内容。

环境配置​

# 安装 Vue CLI
npm install -g @vue/cli
npm install -g @vue/cli-init
# 创建 Vue Web Extension 项目
vue create --preset kocal/vue-web-extension my-extension
cd my-extension
# 启动本地开发服务器
npm run server

Vue版本确认​

我使用的是Vue2

npm list vue

安装 elementUI​

npm install element-ui --save

在main.js中引入：

import Vue from 'vue'
import App from './App.vue'
import ElementUI from 'element-ui'
import 'element-ui/lib/theme-chalk/index.css'

Vue.use(ElementUI)

new Vue({
  el: '#app',
  render: h => h(App)
})

安装 Tailwind CSS​

使用与兼容的 Vue2+Webpack 的旧版 Tailwind

npm install tailwindcss@npm:@tailwindcss/postcss7-compat postcss@^7 autoprefixer@^9

配置postcss.config.js 文件​

module.exports = {
  plugins: {
    '@tailwindcss/postcss': {},
    autoprefixer: {}
  }
}

配置tailwind.config.js 文件​

/** @type {import('tailwindcss').Config} */
module.exports = {
  content: [
    './public/**/*.html',
    './src/**/*.{vue,js,ts,jsx,tsx}'
  ],
  theme: {
    extend: {}
  },
  plugins: []
}

升级 manifest 版本​

在manifest.json修改字段

"manifest_version": 3

插件功能设计​

• 获取视频信息
  getVideoInfo()会调用b站API获取信息：

async function getVideoInfo () {
  const videoApi = `https://api.bilibili.com/x/web-interface/view?bvid=${bvid}`
  const videoRes = await fetch(videoApi)
  const videoData = await videoRes.json()

  const title = videoData.data.title
  const view = videoData.data.stat.view
  const reply = videoData.data.stat.reply
  const mid = videoData.data.owner.mid
  const upName = videoData.data.owner.name

  const upApi = `https://api.bilibili.com/x/relation/stat?vmid=${mid}`
  const upRes = await fetch(upApi)
  const upData = await upRes.json()
  const follower = upData.data.follower

  // 更新悬浮窗
  infoDisplay.innerHTML = `
    <p><strong>UP主:</strong> ${upName}</p>
    <p><strong>粉丝数:</strong> ${follower}</p>
    <p><strong>BV号:</strong> ${bvid}</p>
    <p><strong>标题:</strong> ${title}</p>
    <p><strong>播放量:</strong> ${view}</p>
    <p><strong>评论数:</strong> ${reply}</p>
  `
}

为什么用API而不是DOM：
1.使用官方 API，可以直接获取完整、实时、可靠的数据
2.从API获取的JSON中直接包含了JSON 不用解析DOM

• 一键三连
  模拟手动长按按钮3秒实现：

function realTripleLike () {
  const likeBtn = document.querySelector('.video-like') || document.querySelector('button.like')
  if (!likeBtn) return alert('未找到点赞按钮')

  likeBtn.dispatchEvent(new MouseEvent('mousedown', { bubbles: true }))
  setTimeout(() => {
    likeBtn.dispatchEvent(new MouseEvent('mouseup', { bubbles: true }))
    alert('一键三连成功！')
  }, 3000)
}

• 发送评论
  调用b站API发送配置好的评论：

async function sendComment () {
  const csrf = getCSRF()
  const bvid = getBvid()
  const text = window.__bili_comment__ || '好耶！'
  
  await bilibiliPost('https://api.bilibili.com/x/v2/reply/add', {
    oid: bvid,
    type: 1,
    message: text,
    csrf
  })
  alert('评论发送成功！')
}

弹窗样式​

这里因为elementui的按钮组件自带样式导致我的弹窗按钮无法对齐
于是添加!important到样式，强制覆盖其默认样式
添加box-sizing: border-box !important确保宽度计算包含内边距和边框
效果图如下：

popup → content-script 通信​

Vue popup 发送消息到 content-script:

chrome.tabs.query({ active: true, currentWindow: true }, (tabs) => {
  chrome.tabs.sendMessage(tabs[0].id, { action: 'get_video_info' })
})

content-script接收消息并处理：

chrome.runtime.onMessage.addListener((msg, sendResponse) => {
  if (msg.action === 'get_video_info') getVideoInfo()
  if (msg.action === 'open_floating_box') createFloatingBox()
  if (msg.action === 'triple_action') realTripleLike()
  return true
})

1、去安装Conda（推荐 Miniforge 或 Anaconda）
2、在里面创建一个干净的虚拟环境
3、安装PyTorch
4、测试GPU是否可用

安装Conda（推荐 Miniforge 或 Anaconda）​

这边我用的是Miniforge，因为它原生支持ARM架构，使用社区驱动的conda-forge频道，更轻量。
顺便说一下我的是m2芯片。

下载最新版本的ARM64（M芯片）安装脚本：

curl -L -O https://github.com/conda-forge/miniforge/releases/latest/download/Miniforge3-MacOSX-arm64.sh

安装 Miniforge：

bash Miniforge3-MacOSX-arm64.sh

中途会显示一些协议条目,它开始打印协议时，需要你按enter继续，最后问你是否同意的时候打yes。

选择安装目录，这边我选择默认的没有修改。

Miniforge3 will now be installed into this location:
/Users/xxx/miniforge3

  - Press ENTER to confirm the location
  - Press CTRL-C to abort the installation
  - Or specify a different location below

出现这个：选择yes自动执行conda init

You can undo this by running `conda init --reverse $SHELL`? [yes|no]

查找你的conda位置：

which conda

手动使conda生效：

eval "$(/Users/xxx/miniforge3/bin/conda shell.zsh hook)"

验证是否安装成功：

conda --version

在里面创建一个干净的虚拟环境​

创建独立的PyTorch环境：

#创建命令  -n 虚拟环境名称 
conda create -n torch python=3.10
#激活虚拟环境
conda activate torch

检查python是否安装：

python --version

安装 PyTorch​

安装 PyTorch：

conda install pytorch torchvision torchaudio -c pytorch

测试GPU是否可用：​

打开编辑器，进入刚刚建立好的虚拟环境： 1、终端手动进入：

conda activate torch
python torch_demo.py

2、在编辑器中指定解释器：（每次运行都自动使用torch环境的Python）
我用的是vs code，打开命令面板（Cmd + Shift + P）输入以下内容，然后找到类似这种路径miniforge3/envs/torch/bin/python

“Python: Select Interpreter”

建立一个torch_demo.py文件用来测试：

#导入 PyTorch 库
import torch
#输出当前PyTorch的版本
print("PyTorch version:", torch.__version__)
#检查MPS是否可用
print("MPS available:", torch.backends.mps.is_available())
#检查 PyTorch 是否编译时包含了 MPS 支持
print("MPS built:", torch.backends.mps.is_built())

以后每次运行PyTorch项目前，都要先确实处于torch环境，如果没有的话就先激活：

#激活虚拟环境
conda activate torch

本人正在试图用vue开发chrome插件，刚配置好环境，用vs code打开文件后就发现报错信息Parsing error: No Babel config file detected。
奇怪的是我明明就有/babel.config.js文件。遂提问小G，ta说只要在文件里加上一句requireConfigFile: false,就可以了，
于是我改成这样：

module.exports = {
  presets: [
    ['@vue/cli-plugin-babel/preset', { requireConfigFile: false }]
  ]
}

并且同步修改了/.eslintrc.js文件：

parserOptions: {
    parser: '@babel/eslint-parser',
    requireConfigFile: false
  },

报错的确是消失了，可是我突然意识到，同时我的Babel的配置也失效了。

再一番搜索后得知：babel.config.js 必须在项目根目录，于是我还原两个文件后重新打开项目，使得此文件处在根目录下，报错果然消失了。
即编辑器打开的目录并不等于运行项目的目录，ta对根部的理解就是表面上打开文件的层级最上部。
ESLint判断“项目根目录”时，并不是根据磁盘路径，而是根据你在编辑器里打开的文件夹作为 Workspace根。
以下是图解：

起因是写东西的过程中，想要清晰的查看自己的项目结构，脑袋突然一闪“那我为什么不直接写一个插件给自己用呢”。 于是直接开始。 ps:在扩展库搜索AutoPJTree就可以直接安装使用喔，插件详细可以看我GitHub🔗

前期准备​

首先安装好Node.js和Git 再来安装Yeoman和VS Code Extension Generator

第一步安装脚手架工具：

npm install -g yo generator-code

作用： 全局安装 yo（Yeoman） 和 generator-code。 Yeoman 是一个项目模板生成器框架，而 generator-code 是它的插件，用来生成 VS Code 扩展项目。

安装完成后，你会在命令行中获得 yo 命令。

第二步：创建 VS Code 插件模板

yo code

接下来它会询问一系列问题： 插件名称（Extension name） 标识符（Identifier） 描述（Description） 作者名 是否使用 TypeScript 是否添加 Git 初始化等

按需填好字段后它会生成一个目录结构，比如：

my-extension/
├── .vscode/
│   └── launch.json
├── src/
│   └── extension.ts
├── package.json
├── tsconfig.json
└── README.md

进入生成的目录：

cd my-extension

打开vs code，按 F5 启动调试，会自动启动一个新的 VS Code 窗口加载初始插件。

在extension.ts里进行插件功能的编辑。​

比如我这个自动生成树的逻辑： 1、计算最大深度 函数computeProjectMaxDepth()用来计算整个项目的实际层级深度。 它递归扫描目录结构，忽略掉指定的文件夹。返回值为项目的最大层级。

if (stat.isDirectory()) {
  const subDepth = computeProjectMaxDepth(fullPath, ignore, currentDepth);
  if (subDepth > maxDepth) {
    maxDepth = subDepth;
  }
}

2、生成目录树文本 函数generateTree()用来生成类似 tree 命令输出的文本。 代码中通过缩进控制层级：

const indent = level === 0 ? '' : '│   '.repeat(level - 1) + '├── ';

使用递归：

if (stat.isDirectory()) {
  out += generateTree(itemPath, ignore, depth, level + 1);
}

通过getConfigSources()从两种配置来源（工作区配置、用户配置）中获取设置。 1.、读取 VS Code 的配置对象：

const cfg = vscode.workspace.getConfiguration('autotree');

2、通过 inspect 分别读取不同层级的配置：

const workspaceIgnore = cfg.inspect<string[]>('ignore')?.workspaceValue || [];
const userIgnore = cfg.inspect<string[]>('ignore')?.globalValue || [];

3、检查是否有多处配置（用来决定后续是否弹出选择框）：

const hasMultiple = hasWorkspaceConfig && hasUserConfig;

4、返回两个 ConfigSource 对象。

在package.json里编辑插件的名称、描述信息、版本信息等。​

name扩展的包名 必须全局唯一，发布时会变成 <publisher>.<name>
displayName在 VS Code 插件市场显示的名字（可以更友好）
description插件的描述信息
version当前版本号（发布时用于更新）

其中有一个引擎兼容性，用来告诉 VS Code 这个插件需要的最低版本。 如果后续在打包过程中有相关报错信息，可以在这里修改成对应的版本：

"engines": {
  "vscode": "输入对应的版本号"
}

激活事件：定义插件何时被激活

  "activationEvents": []

常见触发方式： "onStartupFinished"：VS Code 启动后加载。 "onCommand:xxx"：用户执行某个命令时加载。 "onLanguage:python"：打开某种语言文件时加载。 "*"：总是加载（不推荐，会影响性能）。

主入口：

"main": "./dist/extension.js",

指定插件的入口文件路径（编译后）。 默认是 src/extension.ts 编译出来的 JS 文件。

一些杂乱的​

原本把问题想的很简单，只需要完成递归生成树就好了，实际操作中才能意识到很多需要改进的地方。 比如需要忽略掉某些文件夹/文件，有时候不需要查看那么深的结构，手动设置步骤很繁琐，每次都要重新来一遍。 为此增加了多种设置方法：项目设置 (.vscode/settings.json)、工作区设置、用户设置 (全局)。以及递归深度限制。 过程中又遇到问题，比如我在项目设置与工作区设置不一样，又或者我是提前设置好了，但临时改主意想要手动设置不一样的。 于是我加入了配置优先级，对他们进行排序，避免了用户设置冲突的问题。 现在这个版本我目前比较满意吧，如果后续使用过程中遇到新的问题或改进之处，会继续更新的。

• 一个极简的敲木鱼App 功能非常纯粹

• 点击木鱼 功德计数器加1 聆听纯粹的木鱼敲击声

• 作为swift的入门练习

前期准备​

• [IDE] Xcode (在App Store即可下载)
• [硬件] 一台Mac 以及一台用于真机测试的iPhone (可选)
• [技术] 对Swift和SwiftUI有最基础的了解

创建Xcode项目​

搭建UI界面​

界面非常简单 只有木鱼图片和一个功德计数文本

在ContentView.swift文件中 我们可以用一个 VStack 来垂直布局这两个元素

加了.resizable()确保图片可以缩放

使用scaleEffect(scale)来控制点击时的缩放动画

   var body: some View {
        VStack(spacing: 30) {
            Text("功德：\(count)")
                .font(.largeTitle)
                .bold()

            Image("woodfish")
                .resizable()
                .frame(width: 100, height: 80)
                .scaleEffect(scale)
                .onTapGesture {
                    withAnimation(.easeOut(duration: 0.1)) {
                        scale = 0.9
                    }
                    DispatchQueue.main.asyncAfter(deadline: .now() + 0.1) {
                        withAnimation {
                            scale = 1.0
                        }
                        count += 1
                        playSound()
                    }
                }
        }
        .padding()
    }

音效实现​

我们可以直接用库乐队的木鱼音效作为此app的音效素材:

真机测试效果​

附上原博主主页

• 做一个经典的小游戏
• 贴上完整版🔗链接

基本逻辑​

构建飞机可以在画面最底下左右移动并且不会移动到界面以外（初始位置居中）：

    class Player(pygame.sprite.Sprite):
        def __init__(self):
            super().__init__()
            self.image = pygame.transform.scale(player_img,(50,38))
            self.image.set_colorkey(BLACK)
            self.rect = self.image.get_rect()
            self.radius = 20
            self.rect.centerx = WIDTH // 2
            self.rect.bottom = HEIGHT - 10

后续可修改飞机速度是否有加速度，或者匀速。

构建陨石从画面上方（界面以外）生成并且掉落：

    class Rock(pygame.sprite.Sprite):
        def __init__(self):
            super().__init__()
            self.image_ori = random.choice(rock_imgs)
            self.image_ori.set_colorkey(BLACK)
            self.image = self.image_ori.copy()
            self.rect = self.image.get_rect()
            self.radius = int(self.rect.width * 0.85 / 2)
            self.rect.x = random.randrange(0, WIDTH - self.rect.width)
            self.rect.y = random.randrange(-180, -100)
            self.speedy = random.randrange(2, 7)
            self.speedx = random.randrange(-3, 3)

后续可修改陨石的随机速度范围，旋转角度，大小等。

构建子弹从飞机上方向上发射：

    class Bullet(pygame.sprite.Sprite):
        def __init__(self,x,y):
            super().__init__()
            self.image = bullet_img
            self.image.set_colorkey(BLACK)
            self.rect = self.image.get_rect()
            self.rect.centerx = x
            self.rect.bottom = y
            self.speedy = -10

后续可添加多枚子弹以及多枚子弹效果持续时间等。

添加碰撞事件：

    #判断石头与子弹碰撞
    hits = pygame.sprite.groupcollide(rocks,bullets,True,True)
    for hit in hits:
        random.choice(expl_sounds).play()
        score += hit.radius
        expl = Explosion(hit.rect.center,'lg')
        all_sprites.add(expl)
        if random.random() > 0.9:
            pow = Power(hit.rect.center)
            all_sprites.add(pow)
            powers.add(pow)
        new_rock()
    #判断石头与飞机碰撞
    hits = pygame.sprite.spritecollide(player,rocks,True,pygame.sprite.collide_circle)
    for hit in hits:
        new_rock()
        player.health -= hit.radius
        expl = Explosion(hit.rect.center,'sm')
        all_sprites.add(expl)
        if player.health <= 0:
            die = Explosion(player.rect.center,'player')
            all_sprites.add(die)
            die_sound.play()
            player.lives -= 1
            player.health = 100
            player.hide()

首先向DocSearch申请你的项目

成功后会给你发邮件确认✅

一定要先申请，我是直接去创建application导致一开始没有上传网站数据

注册algolia​

如果你有收到邀请邮件，algolia会给你的项目创建好一个application

在这里你可以获取Application ID、Search API Key 待会会用到

如果你跟我一样没有先申请：
注册algolia，这时候应该会跳出get start画面，可以忽略。

回到主页面，点击左下角settings，点击applications，create application。

选择数据节点，这里我选择的是US West。

创建成功后我们可以获取API Keys。

点击左下角Data sources，Create Indices，设置一个indices name。

连接algolia​

因为Docusaurus 的 @docusaurus/preset-classic 自带 Algolia DocSearch 集成。
所以如果你用的是经典预设，就不需要额外安装任何东西。
可以回到你的项目，在 docusaurus.config.js 中的 themeConfig 中添加一个 algolia 字段。

algolia: {
        // Algolia 提供的 application ID
        appId: 'YOUR_APP_ID',

        //  公开 API 密钥：提交它没有危险
        apiKey: 'YOUR_SEARCH_API_KEY',
  
        indexName: 'YOUR_INDEX_NAME',
  
        // 可选：见下文
        contextualSearch: true,
      },

如果你用的不是经典预设，首先安装软件包：
npm install --save @docusaurus/theme-search-algolia

然后在 docusaurus.config.js 中注册主题：

export default {
  // ...其他配置
  themes: ['@docusaurus/theme-search-algolia'],
  themeConfig: {
    // ...
  },
};

再按照上面的步骤添加一个 algolia 字段。

这样search功能就完成啦。

• 更多内容可参考docusaurus官网

• Docusaurus是一个静态网站生成器
• 免费 快速 对小白友好

前期准备​

• IDE 这里我用的是vs code
• Node.js
• 一个GitHub账号
• git

安装Docusaurus​

打开终端 选择你要存放这个项目的位置
cd '这里写文件地址'

输入以下命令：
npx create-docusaurus@latest my-website classic

显示这些就代表安装成功啦

在vs code中打开上面创建的项目
新建终端 输入： npm run start

运行成功后会出现: http://localhost:3000 地址

打开如下图所示 这样我们的网站就建立成功啦

为什么要写博客​

• 觉得好玩 想写🤓

关于名字​

可以叫我十一，英文名是Aki。

技术栈​

• 💻 编程语言 JavaScript / TypeScript、Python

• 🗄️ 数据库：MySQL、MongoDB、Redis

• 🧩 框架 React、Vue

一些杂乱的​

本人热爱看live，有多次演出志愿者、工作人员经验。
最爱的乐队是my little airport
最近的兴趣是剑玉，自以为小有天赋，新手十招很快就过了，正在进一步的练习，希望有朝一日可以玩的特别厉害。
日本語をゆっくり勉強しています！

关于博客首页​

参考自愧怍
我创建此博客的原因其中一部份也是刷到这位大佬的网站，觉得他魔改的特别好。