devtext

A VS Code extension for JSONC editing, jq-style filtering, regex testing, and text conversion utilities.

Features

JSONC Tools

Activated automatically on jsonc files. A CodeLens toolbar appears at the top:

FormatJson | MinifyJson | TreeView | Jq | …

Action	Description
FormatJson	Pretty-print JSONC, preserving comments
MinifyJson	Compact JSONC, preserving comments
TreeView	Read-only tree preview in a side editor
Jq	Filter JSON with jq-like expressions (see below)
Regex	Test regex patterns on inline text (see below)

Jq Filters

Add jq directives as comments to filter JSON data:

// devtext:jq Names => .users[].name
// devtext:jq Score => .scores | map(select(. > 80))
{"users": [{"name": "Alice"}, {"name": "Bob"}], "scores": [90, 60, 85]}

Click Jq(N rules) in the toolbar to pick and run a filter. Results open in a side editor with match counts.

Regex Testing

Add regex directives as comments to test patterns:

// devtext:regex Demo => \d+
123 abc 456
// devtext:regex Word => \w{3,}
hello hi hey world

Per-directive CodeLens buttons appear at each comment line. Click to run the regex on the text below. Results show matches sorted by count and name, with totals.

Regex directives also work in plaintext files (and any other language).

Select text (or use the whole file), right-click, and choose from the Text Utility submenu:

Command	Input	Output
Timestamp → Date	`1716681600`	`2024-05-26 00:00:00`
Date → Timestamp	`2024-05-26 08:30`	`1716705000`
Base64 Encode	`hello`	`aGVsbG8=`
Base64 Decode	`aGVsbG8=`	`hello`
URL Encode	`hello world`	`hello%20world`
URL Decode	`hello%20world`	`hello world`
UrlParse	`https://example.com/path?a=1&b=2`	JSON structure (editable)
UrlBuild	JSON structure	URL string
String → JSON	`"{\"foo\": 1}"`	`{ "foo": 1 }`
JSON → String	`{ "foo": 1 }`	`"{\"foo\":1}"`

UrlParse / UrlBuild Workflow

Select a URL → UrlParse → replaced by JSON:

{
  "protocol": "https:",
  "host": "example.com",
  "port": "",
  "pathname": "/path",
  "params": { "a": "1", "b": "2" },
  "hash": ""
}

Edit the params object (add, remove, or change query parameters).
Select the JSON → UrlBuild → replaced by the rebuilt URL.

Development

npm install
npm run compile

Press F5 in VS Code to launch an Extension Development Host.

devtext（中文）

一个 VS Code 扩展，提供 JSONC 编辑、jq 风格过滤、正则测试及文本转换工具。

功能

JSONC 工具

打开 jsonc 文件时自动激活，顶部显示 CodeLens 工具栏：

FormatJson | MinifyJson | TreeView | Jq | …

操作	说明
FormatJson	格式化 JSONC，保留注释
MinifyJson	压缩 JSONC，保留注释
TreeView	在侧边栏打开只读树形预览
Jq	使用类 jq 表达式过滤 JSON（见下文）
Regex	对文本运行正则表达式（见下文）

Jq 过滤

在 JSON 数据上方添加 jq 指令注释：

// devtext:jq Names => .users[].name
// devtext:jq Score => .scores | map(select(. > 80))
{"users": [{"name": "Alice"}, {"name": "Bob"}], "scores": [90, 60, 85]}

点击工具栏的 Jq(N rules) 选择并执行过滤。结果在侧边栏打开，带匹配计数。

Regex 正则测试

添加正则指令注释来测试正则表达式：

// devtext:regex Demo => \d+
123 abc 456
// devtext:regex Word => \w{3,}
hello hi hey world

每条指令行会显示 CodeLens 按钮。点击即可对下方文本运行正则。结果按匹配次数和名称排序，并显示总计。

正则指令同样适用于 plaintext 及其他语言文件。

Text Utility（右键菜单）

选中文本（或使用全文），右键选择 Text Utility 子菜单：

命令	输入	输出
Timestamp → Date	`1716681600`	`2024-05-26 00:00:00`
Date → Timestamp	`2024-05-26 08:30`	`1716705000`
Base64 Encode	`hello`	`aGVsbG8=`
Base64 Decode	`aGVsbG8=`	`hello`
URL Encode	`hello world`	`hello%20world`
URL Decode	`hello%20world`	`hello world`
UrlParse	`https://example.com/path?a=1&b=2`	JSON 结构（可编辑）
UrlBuild	JSON 结构	URL 字符串
String → JSON	`"{\"foo\": 1}"`	`{ "foo": 1 }`
JSON → String	`{ "foo": 1 }`	`"{\"foo\":1}"`

UrlParse / UrlBuild 工作流

选中 URL → UrlParse → 被替换为 JSON：

{
  "protocol": "https:",
  "host": "example.com",
  "port": "",
  "pathname": "/path",
  "params": { "a": "1", "b": "2" },
  "hash": ""
}

编辑 params 对象（增删改查询参数）。
选中 JSON → UrlBuild → 被替换为重新构建的 URL。

开发

npm install
npm run compile

在 VS Code 中按 F5 启动扩展开发宿主窗口。

DevText

Marlowick