整合了massCode和插件的code-server

发布时间:2024年01月20日

在这里插入图片描述

公众号的年度小结出来了,没想到自己居然写了这么多

在这里插入图片描述


本文应网友 快乐100 要求折腾,但老苏并不是程序员,对这种专业工具并不熟,所以错漏在所难免,见谅;

什么是 massCode ?

massCode 是为开发人员提供的免费开源代码片段管理器。它可以帮助您创建和组织您自己的个人片段集合并快速访问它。

massCode 使用 ElectronVueCodemirror 构建。支持 WindowsMacOSLinux 平台,属于桌面应用,并不支持 Docker 部署

在这里插入图片描述

不过老苏今天介绍的项目,集成了 code-server 服务器、massCode 及其 vscode 扩展( massCode Assistant )。利用 massCode 的优势,镜像可以部署为可以使用自定义代码片段的 Web IDE

在这里插入图片描述

关于 code-server 可以看老苏之前写的文章

文章传送门:在线代码编辑器code-server

安装

在群晖上以 Docker 方式安装。

在注册表中搜索 code-server-masscode ,选择第一个 dxsooo/code-server-masscode,双击直接下载。

在这里插入图片描述

本文写作时, 唯一一个版本为 1.0

在这里插入图片描述

docker 文件夹中,创建一个新文件夹 code-server-masscode,并在其中建一个子文件夹 projects

文件夹装载路径说明
docker/code-server-masscode/projects/home/coder/projects存放代码等

在这里插入图片描述

端口

本地端口不冲突就行,不确定的话可以用命令查一下

# 查看端口占用
netstat -tunlp | grep 端口号
本地端口容器端口
34458080

在这里插入图片描述

命令行安装

如果你熟悉命令行,可能用 docker cli 更快捷

# 新建文件夹 code-server-masscode 和 子目录
mkdir -p /volume1/docker/code-server-masscode/projects

# 进入 code-server-masscode 目录
cd /volume1/docker/code-server-masscode

# 运行容器
docker run -d \
   --restart unless-stopped \
   --name code-server \
   -p 3445:8080 \
   -v $(pwd)/projects:/home/coder/projects \
   dxsooo/code-server-masscode:1.0

也可以用 docker-compose 安装,将下面的内容保存为 docker-compose.yml 文件

version: '3'

services:
  code-server:
    image: dxsooo/code-server-masscode:1.0
    container_name: code-server
    restart: unless-stopped
    ports:
      - 3445:8080
    volumes:
      - ./projects:/home/coder/projects

然后执行下面的命令

# 新建文件夹 code-server-masscode 和 子目录
mkdir -p /volume1/docker/code-server-masscode/projects

# 进入 code-server-masscode 目录
cd /volume1/docker/code-server-masscode

# 将 docker-compose.yml 放入当前目录

# 一键启动
docker-compose up -d

运行

在浏览器中输入 http://群晖IP:3445 就能看到登录界面

在这里插入图片描述

这个镜像默认启用了登录认证,但密码在日志中是看不到的

在这里插入图片描述

需要进入容器查看配置文件

# 进入容器
docker exec -it code-server /bin/bash

# 查看密码
cat ~/.config/code-server/config.yaml

在这里插入图片描述

也可以从终端机中操作

在这里插入图片描述

效果是一样的

在这里插入图片描述

登录成功后的主界面

在这里插入图片描述

打开左侧的 Extensions,会看到已经安装了 massCode assistant 插件

在这里插入图片描述

打开命令面板,输入 massCode

  • Create Snippet:新建代码片段;
  • Search:搜索代码片段;

在这里插入图片描述

如果显示下面👇的错误

在这里插入图片描述

这是因为你没有使用 https 协议,反代之后,允许 权限就好了

在这里插入图片描述

新建成功会有提示

在这里插入图片描述

代码保存在 /massCode/db.json

在这里插入图片描述

小结

通过 massCode Assistant 插件创建的代码片段,虽然快捷方便,但是并没有指定文件夹和 tag,感觉查找起来并不方便,如果在桌面端,可以在 massCode 中进行调整,但是容器中似乎就没办法了

参考文档

massCodeIO/massCode: A free and open source code snippets manager for developers
地址:https://github.com/massCodeIO/massCode

massCode | A free and open source code snippets manager for developers
地址:https://masscode.io/

dxsooo/code-server-masscode: Open VSCode server with massCode inside
地址:https://github.com/dxsooo/code-server-masscode

文章来源:https://blog.csdn.net/wbsu2004/article/details/135711795
本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。