我家小花儿

这个屌丝很懒，什么也没留下！

热门标签

【AI 大模型】使用 AI 大模型编程 ② ( CodeGeeX 工具 | CodeGeeX 功能 | VSCode 安装使用 CodeGeeX | Tabby 工具 | Tabby 部署与使用 )_tabby的windows-msvc-cuda117

作者：我家小花儿 | 2024-08-19 00:32:27

踩

tabby的windows-msvc-cuda117

文章目录

一、CodeGeeX 工具
二、Tabby 工具

在这里插入图片描述

一、CodeGeeX 工具

CodeGeeX 可以作为 GitHub Copilot 的平替 , 二者功能基本一致 ;

1、CodeGeeX 简介

CodeGeeX 官方网站 : https://codegeex.cn/

CodeGeeX 使用文档 : https://zhipu-ai.feishu.cn/wiki/X6qEwPfHXi0hSOkJUSKc6DkDnGN

CodeGeeX 是清华大学和智谱 AI 联合开发的 " 多语言代码生成模型 " , 是国产的 AI 编程大模型 ;

2、CodeGeeX 功能

CodeGeeX 有如下四大功能 :

代码编写 :
- 根据注释生成代码 : 根据开发者的输入或注释 , 自动生成相应的代码片段 ;
- 根据代码生成后续代码 ;
代码注释 : 自动为代码添加注释 , 可以是逐行添加 , 也可以为一个代码块添加总结性注释 , 以帮助开发者更好地理解代码逻辑和功能 ;
代码翻译 : 将 Python 代码转为 Java 代码 ;
代码问答 : 选中代码 , 在开发过程中遇到问题时直接向 AI 大模型提问 , 可提问如下方面的问题 :
- 代码逻辑
- 语法错误
- 最佳实践

在这里插入图片描述

3、CodeGeeX 使用与授权

CodeGeeX 目前个人免费使用 , 模型开源 , 商用需要进行授权 ;

CodeGeeX 是可以本地部署的 , 需要联系智普公司提供服务 , 在公司内部的本地局域网部署一套离线大模型 ;

4、CodeGeeX 插件支持

CodeGeeX 提供 VSCode / Intellij IDEA / PyCharm / VS 等开发环境的插件 ;

在这里插入图片描述

5、Intellij IDEA 安装 CodeGeeX 插件

选择 " 菜单栏 / File / Settings " 选项 ;

在这里插入图片描述

在 Settings 对话框中的 Plugins 面板中 , 搜索 CodeGeeX 插件 ,

在这里插入图片描述

点击 Install 按钮 , 安装该插件 ;

弹出第三方插件提醒 , 选择 " Accept " 按钮选项 ;

在这里插入图片描述

杯具了 ε(┬┬﹏┬┬)3 , 必须是专业版的 Intellij IDEA , 并且版本要 2021.1 以上的版本 ;

在这里插入图片描述

我的社区版装不上 ;

在这里插入图片描述

6、VSCode 安装 CodeGeeX 插件

点击左侧的扩展 Extension 按钮 , 在扩展搜索栏中搜索 " CodeGeeX " , 这个插件的全称是 " CodeGeeX: AI Code AutoComplete, Chat, Auto Comment " ;

在这里插入图片描述

安装完成后 , 会提示登录 , 点击 Login 按钮 , 开始登录 CodeGeeX ;

在这里插入图片描述

提示需要登录 , 选择 Allow 选项 ;

在这里插入图片描述

这里选择第一个选项 , 在默认浏览器中登录账号 ;

在这里插入图片描述

直接使用手机号 + 验证码登录即可 ;

在这里插入图片描述

登录完毕后的提示信息 :

在这里插入图片描述

登录成功后 , 在右下角显示如下内容 :

在这里插入图片描述

登录后 , 可以点击左侧的 CodeGeeX 按钮 , 显示 CodeGeeX 界面 ;

在这里插入图片描述

7、VSCode 使用 CodeGeeX 插件进行补全编程

使用示例 : 在开发环境中想要自动生成代码的位置 , 直接按下 Tab 键 , 就可以生成代码 , 再次按下 Tab 键 , 可以将生成的代码插入 ;

在这里插入图片描述

首先 , 编写 HTML 文本结构和 CSS 样式 ;

<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <!-- 设置 meta 视口标签 -->
    <meta name="viewport" content="width=device-width, initial-scale=1.0, user-scalable=no,maximum-scale=1.0,minimum-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>JavaScript</title>
    <style>
        .box {
            /* 设置外部div的样式 */
            /* 相对定位，相对于其正常位置进行定位 */
            position: relative;
            /* 宽度为 400 像素 */
            width: 400px;
            /* 底部边框为 1 像素实线，颜色为灰色 */
            border-bottom: 1px solid #ccc;
            /* 上下间距 100 像素，左右自动居中 */
            margin: 100px auto;
        }
        
        .box input {
            /* 设置 .box 内的输入框样式 */
            /* 输入框宽度为370像素 */
            width: 370px;
            /* 输入框高度为30像素 */
            height: 30px;
            /* 去掉边框 */
            border: 0;
            /* 去掉默认的外边框样式 */
            outline: none;
        }
        
        .box img {
            /* 设置 .box 内的图片样式 */
            /* 绝对定位，相对于最近的非static定位父元素 */
            position: absolute;
            /* 距离父元素顶部 2 像素 */
            top: 2px;
            /* 距离父元素右侧 2 像素 */
            right: 2px;
            /* 图片宽度高度为24像素 */
            width: 24px;
            height: 24px;
        }
    </style>

</head>

<body>
    <div class="box">
        <label for="">
            <img src="images/close.png" alt="" id="">
        </label>
        <input type="password" name="" id="">
    </div>

    <script>

    </script>
</body>

</html>
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64

然后 , 在 <script> </script> 代码块中 , 添加如下注释 ;

// 获取 DOM 元素 然后为 按钮添加点击事件 , 点击按钮后可显示密码 , 再次点击隐藏密码 , 使用 type 属性来切换密码框的类型
1

最后 , 输入完注释后 , 点击回车键 , 然后点击 tab 键 , 生成如下代码 :

<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <!-- 设置 meta 视口标签 -->
    <meta name="viewport" content="width=device-width, initial-scale=1.0, user-scalable=no,maximum-scale=1.0,minimum-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>JavaScript</title>
    <style>
        .box {
            /* 设置外部div的样式 */
            /* 相对定位，相对于其正常位置进行定位 */
            position: relative;
            /* 宽度为 400 像素 */
            width: 400px;
            /* 底部边框为 1 像素实线，颜色为灰色 */
            border-bottom: 1px solid #ccc;
            /* 上下间距 100 像素，左右自动居中 */
            margin: 100px auto;
        }
        
        .box input {
            /* 设置 .box 内的输入框样式 */
            /* 输入框宽度为370像素 */
            width: 370px;
            /* 输入框高度为30像素 */
            height: 30px;
            /* 去掉边框 */
            border: 0;
            /* 去掉默认的外边框样式 */
            outline: none;
        }
        
        .box img {
            /* 设置 .box 内的图片样式 */
            /* 绝对定位，相对于最近的非static定位父元素 */
            position: absolute;
            /* 距离父元素顶部 2 像素 */
            top: 2px;
            /* 距离父元素右侧 2 像素 */
            right: 2px;
            /* 图片宽度高度为24像素 */
            width: 24px;
            height: 24px;
        }
    </style>

</head>

<body>
    <div class="box">
        <label for="">
            <img src="images/close.png" alt="" id="">
        </label>
        <input type="password" name="" id="">
    </div>

    <script>
        // 获取 DOM 元素 然后为 按钮添加点击事件 , 点击按钮后可显示密码 , 再次点击隐藏密码 , 使用 type 属性来切换密码框的类型
        var input = document.querySelector('input');
        var img = document.querySelector('img');
        var flag = 0;
        img.onclick = function () {
            if (flag == 0) {
                input.type = 'text';
                img.src = 'images/open.png';
                flag = 1;

    </script>
</body>

</html>
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73

在这里插入图片描述

然后再上述基础上 , 继续执行如下操作 :

按下回车键 , 会自动生成后续代码的提示 , 再按下 TAB 键 , 可以将代码插入进去 ;

重复上述操作 , 直到代码生成完毕 ;

在这里插入图片描述

最终生成的代码如下 :

<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <!-- 设置 meta 视口标签 -->
    <meta name="viewport" content="width=device-width, initial-scale=1.0, user-scalable=no,maximum-scale=1.0,minimum-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>JavaScript</title>
    <style>
        .box {
            /* 设置外部div的样式 */
            /* 相对定位，相对于其正常位置进行定位 */
            position: relative;
            /* 宽度为 400 像素 */
            width: 400px;
            /* 底部边框为 1 像素实线，颜色为灰色 */
            border-bottom: 1px solid #ccc;
            /* 上下间距 100 像素，左右自动居中 */
            margin: 100px auto;
        }
        
        .box input {
            /* 设置 .box 内的输入框样式 */
            /* 输入框宽度为370像素 */
            width: 370px;
            /* 输入框高度为30像素 */
            height: 30px;
            /* 去掉边框 */
            border: 0;
            /* 去掉默认的外边框样式 */
            outline: none;
        }
        
        .box img {
            /* 设置 .box 内的图片样式 */
            /* 绝对定位，相对于最近的非static定位父元素 */
            position: absolute;
            /* 距离父元素顶部 2 像素 */
            top: 2px;
            /* 距离父元素右侧 2 像素 */
            right: 2px;
            /* 图片宽度高度为24像素 */
            width: 24px;
            height: 24px;
        }
    </style>

</head>

<body>
    <div class="box">
        <label for="">
            <img src="images/close.png" alt="" id="">
        </label>
        <input type="password" name="" id="">
    </div>

    <script>
        // 获取 DOM 元素 然后为 按钮添加点击事件 , 点击按钮后可显示密码 , 再次点击隐藏密码 , 使用 type 属性来切换密码框的类型
        var input = document.querySelector('input');
        var img = document.querySelector('img');
        var flag = 0;
        img.onclick = function() {
            if (flag == 0) {
                input.type = 'text';
                img.src = 'images/open.png';
                flag = 1;
            } else {
                input.type = 'password';
                img.src = 'images/close.png';
                flag = 0;
            }
        }
    </script>
</body>

</html>
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78

执行效果 :

在这里插入图片描述

二、Tabby 工具

1、Tabby 工具简介

Tabby 是开源的基于 AI 的自托管编码助手 , 可以认为是 AI 编程客户端 ;

Tabby 工具的

项目代码
模型文件
VSCode 扩展插件

都是开源的 , 在 GitHub 上都有提供 ;

GitHub Copilot 和 CodeGeeX 等 AI 编程工具包含 :

开发环境插件 , 如 : VSCode / PyCharm 等开发环境中安装的编程插件 ;
远程大模型 : 本地插件请求远程服务器中的大模型 , 进行 AI 编程 ;

Tabby 只是一个本地使用的客户端工具 , 也就是插件 , 没有提供远程的云服务和大模型 , 需要自己部署大模型进行使用 ;

2、Tabby 相关网站资源

Tabby 官网 : https://tabby.tabbyml.com

在这里插入图片描述

Tabby 官方文档 : https://tabby.tabbyml.com/docs/welcome/

在这里插入图片描述

Tabby 项目代码 : https://github.com/TabbyML/tabby
在这里插入图片描述

Tabby 可用模型 : https://tabby.tabbyml.com/docs/models/

在这里插入图片描述

3、Tabby 使用场景

Tabby 大模型适用于如下场景 :

需要 AI 编程的开发场景 ,
无法使用外部大模型应用 , 如 : GitHub Copilot , CodeGeeX ;
公司只能使用内网环境 , 无法使用外网 ;
公司代码属于机密

开发团队在内网部署自己的 LLM 大型语言模型 , 程序员本地通过部署 Tabby 使用大模型进行 AI 编程 ;

Tabby 客户端插件支持所有的开源 AI 编程模型 ;

4、Tabby 部署与使用

在 WIndows 系统中部署 Tabby , 参考 https://tabby.tabbyml.com/docs/quick-start/installation/windows/ 文档 ;

到 Tabby 开源项目的 release 版本发布页面 https://github.com/TabbyML/tabby/releases 页面 , 下载对应的版本 ;

tabby_x86_64-windows-msvc.zip 是集成显卡版本 ;
tabby_x86_64-windows-msvc-cuda117.zip 是独立显卡版本 ;

下载 tabby_x86_64-windows-msvc-cuda117.zip 文件 ;
在这里插入图片描述

解压文件 , 得到 tabby.exe 和 llama-server.exe 两个可执行文件 ;

在这里插入图片描述

独立显卡的电脑运行

.\tabby.exe serve --model StarCoder-1B --chat-model Qwen2-1.5B-Instruct --device cuda
1

命令 ;

上述命令中的模型 , 可以在 https://tabby.tabbyml.com/docs/models/ 页面中查看 ;
在这里插入图片描述

运行上述命令后 , 会下载大模型数据 ;

在这里插入图片描述

下载的大模型数据会存放在 C:\Users\octop.tabby 目录中 , 其中 octop 是我的电脑的用户名 ;

在这里插入图片描述

之后可以通过 http://localhost:8080 地址访问 Tabby ;

集成显卡的电脑 , 下载 tabby_x86_64-windows-msvc.zip 程序 , 然后执行

.\tabby.exe serve --model StarCoder-1B --chat-model Qwen2-1.5B-Instruct
1

命令 , 注意与独立显卡的部署安装操作进行区分 ;

声明：本文内容由网友自发贡献，不代表【wpsshop博客】立场，版权归原作者所有，本站不承担相应法律责任。如您发现有侵权的内容，请联系我们。转载请注明出处：https://www.wpsshop.cn/w/我家小花儿/article/detail/999908

【AI 大模型】使用 AI 大模型 编程 ② ( CodeGeeX 工具 | CodeGeeX 功能 | VSCode 安装使用 CodeGeeX | Tabby 工具 | Tabby 部署与使用 )_tabby的windows-msvc-cuda117

文章目录

一、CodeGeeX 工具

1、CodeGeeX 简介

2、CodeGeeX 功能

3、CodeGeeX 使用与授权

4、CodeGeeX 插件支持

5、Intellij IDEA 安装 CodeGeeX 插件

6、VSCode 安装 CodeGeeX 插件

7、VSCode 使用 CodeGeeX 插件进行补全编程

二、Tabby 工具

1、Tabby 工具简介

2、Tabby 相关网站资源

3、Tabby 使用场景

4、Tabby 部署与使用

【AI 大模型】使用 AI 大模型编程 ② ( CodeGeeX 工具 | CodeGeeX 功能 | VSCode 安装使用 CodeGeeX | Tabby 工具 | Tabby 部署与使用 )_tabby的windows-msvc-cuda117