OBISCR's Blog

在线64卦变换表

import { LinkCard, Aside, CardGrid, Card } from '@astrojs/starlight/components';

近期重新制作了在线版的64卦变换表，效果如上图所示。建议先去体验一下。

点击第一列的任意一项可以选中当前行，点击行的任意一项可以选中当前列。两个交叉的位置就是得到的卦。

绘制SVG图标

原理说明

每一个爻都有两种状态：阳 或者 阴。因此很自然可以想到用 0 和 1 来表示。基本卦有3爻，衍生卦有6爻。因此可以使用二进制数字来表示。

<svg class="inline-block" width="20" height="20" viewBox="0 0 20 20" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M20 1.66669H0V5.00002H20V1.66669Z" fill="#FF0000"/><path d="M8.33333 8.33331H0V11.6666H8.33333V8.33331Z" fill="black"/><path d="M20 8.33331H11.6666V11.6666H20V8.33331Z" fill="black"/><path d="M8.33333 15H0V18.3333H8.33333V15Z" fill="black"/><path d="M20 15H11.6666V18.3333H20V15Z" fill="black"/></svg> (艮)：可以表示为 100
<svg class="inline-block" width="20" height="20" viewBox="0 0 20 20" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M20 1.66669H0V5.00002H20V1.66669Z" fill="#FF0000"/><path d="M20 8.33002H0V11.6634H20V8.33002Z" fill="#FF0000"/><path d="M8.33333 15H0V18.3333H8.33333V15Z" fill="black"/><path d="M20 15H11.6666V18.3333H20V15Z" fill="black"/></svg> (巽)：可以表示为 110
<svg class="inline-block" width="20" height="20" viewBox="0 0 20 20" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M20 1.66669H0V5.00002H20V1.66669Z" fill="#FF0000"/><path d="M20 8.33002H0V11.6634H20V8.33002Z" fill="#FF0000"/><path d="M20 15H0V18.3333H20V15Z" fill="#FF0000"/></svg> (乾)：可以表示为 111 </Aside>

像素计算

首先要确定SVG的尺寸，对于8个基本卦，以 宽:24 / 高:24 来绘制。对于64个衍生卦，以 宽:24 / 高:48 来绘制。下面将以衍生卦设计图来举例。

我们以卦序第55卦丰为例，详细解释一下二进制的转化。

在我们这套系统中，二进制的最高位（一共有六位，分别对应六爻）就是第六爻，依次类推，最低位就是第一爻。因此，把丰卦转化为二进制就是 001101。原理知道以后，需要计算具体的像素值。

这是上面丰卦的设计草图。

阳爻：直接是24px宽。阴爻：10 + 4 + 10 = 24;

</Aside>

第二个方块的起始位置就是：第一个方块的宽度10 ➕ 4个像素的空白空间 = 14（下方代码第30行）。 </Card> <Card title="纵向Y轴" icon="sun"> <Aside type="note" title="总高度：48像素">

2(顶部空间) + 4(每个爻高度) * 6(一共六个爻) + 5(6个爻之间的空间) * 4(每个空间的高度) + 2(底部空间) = 48;

</Aside> 纵向只需要累加Y轴的距离就可以，不用关心是阳还是阴爻。纵向一共有6爻，每个高度是4，一共是24。六个爻之间会有5个空白空间。每个空间是4像素高。因此。需要注意刚开始第一爻的Y轴应该从2开始（下方代码第23, 31, 43行），然后每一次加8（上一爻和空白空间加起来），最终就绘制出Y轴的图形。 </Card>

代码实现

一切准备就绪之后，最终代码实现就非常简单了。参数 base 为 true，表示绘制基本卦，否则绘制衍生卦。参数 value 是某个卦的二进制数值。

const IChingIcon = ({ base, value }: IconProps) => {
  const valueArray = binaryStringToArray(value);

  return (
    <svg
      key={value}
      fill="none"
      height={base ? "24" : "48"}
      viewBox={base ? "0 0 24 24" : "0 0 24 48"}
      width="24"
      xmlns="http://www.w3.org/2000/svg"
    >
      {valueArray.map((value, index) => {
        if (value === 0) {
          return (
            <React.Fragment key={index}>
              <rect
                key={`left-${index}`}
                fill="currentColor"
                height="4"
                width="10"
                x="0"
                y={8 * index + 2}
              />
              <rect
                key={`right-${index}`}
                fill="currentColor"
                height="4"
                width="10"
                x="14"
                y={8 * index + 2}
              />
            </React.Fragment>
          );
        } else {
          return (
            <rect
              key={index}
              fill="#FF0000"
              height="4"
              width="24"
              x="0"
              y={8 * index + 2}
            />
          );
        }
      })}
    </svg>
  );
};

国内首个AIGC黑客马拉松

import { CardGrid, Card, LinkCard } from '@astrojs/starlight/components';

赛事介绍

PS：以下内容来来自于思否官方

阔别线下赛 4 年之久的 SegmentFault Hackathon 终于在 2023 年重磅回归！

作为国内首个以 AIGC 为主题的黑客马拉松，我们鼓励开发者大开脑洞，结合日常生活中的痛点需求、兴趣爱好和专业方向，进行 Generative AI 应用的构建，例如：艺术品、音乐、漫画头像、求职简历生成器，智能客服机器人，AI Code Review 工具，基于 AI 的数据可视化平台，医疗图像分析应用等等 —— 以上这些场景联想由 ChatGPT 生成。当然，你也可以选择任何你感兴趣的方向。

本届大赛共设有 2 条赛道：

北京的开发者可以选择线下参加 4 月 15 日- 4 月 16 日 (周六、周日)为期两天 32 小时的黑客马拉松。我们鼓励大家尽可能来到线下，与志同道合者并肩作战，与行业先锋面对面交流；
为了让更多好创意、好想法、好项目被大家看到，我们专门设置了线上赛道，不便来到线下的远程的开发者也可选择线上参赛。

参赛者在规定时间内以小组为单位完成创意脑暴、产品设计、代码实现和 Demo 展示，大赛评审团将根据应用程序的创新性、技术难度、应用场景、用户体验和商业价值等因素进行评分。

获奖团队不仅会获得大赛的高额奖金，还有机会获得更广泛的关注和投资。此外，大赛还将邀请人工智能领域的技术大牛和社区领袖，为参赛者们提供专业的建议和支持，以促进这一领域的技术和应用的进一步发展。

关注思否

微信公众号搜索：

参与

点击此处即可参与。

易经的变卦

近期重新制作了在线版的64卦变换表，预览网址：https://64gua.online。效果如上图所示。建议先去体验一下。

本卦

原始的六十四卦中的任意一卦。本文将以雷火丰 ䷶ 卦为例。在下文进行变卦。

错卦（覆卦）

将本卦的每一爻阴阳颠倒。例如：阳爻变阴爻，阴爻变阳爻。

综卦

将本卦从下往上读。例如：本卦的第六爻变为综卦的初爻，本卦的第五爻变为综卦的第二爻，以此类推。

变卦（之卦）

当一个或多个爻发生变化时所得到的新卦。变爻由阴变阳或由阳变阴。变卦的情况比较复杂。主要取决于那个爻变化，而且还可能同时有多个爻发生变化。有多种可能。

假设第三爻（九三）和第五爻（六五️）发生了变化。

互卦

由本卦第二、三、四爻组成下卦，第三、四、五爻组成上卦而成的新卦。

反卦（游卦）

将本卦上下卦位置互换。例如：本卦的下卦变为反卦的上卦，本卦的上卦变为反卦的下卦。

对卦

本卦在六十四卦中的对应卦，通常相隔三十二卦。具体规则为：将上卦和下卦互换位置，且将每一爻由阳变阴，由阴变阳。

卦宫

将相关的八个卦归为一类，每个主卦带领七个卦形成一个卦宫。卦宫的划分是基于八纯卦（也称为八经卦），即乾、坤、震、巽、坎、离、艮、兑。每个卦宫都以这八个卦中的一个为主，称为宫主。每个卦宫包含8个卦：宫主卦加上其他7个下卦不同的卦。

卦的上卦（即上三爻）决定了它属于哪个卦宫。

归魂卦

当变卦回到本卦时，称为归魂。这种情况在某些特定的卦变中出现。

在传统的易学解卦中，当卦中只有一个爻发生变化时，我们会关注这个变爻。对于乾卦，无论哪一爻由阳变阴，都会得到一个新的卦。但是，在易经的变卦规则中，如果一个卦中有多于一个爻发生变化，我们就要考虑所有变爻。乾卦的特殊之处在于：当我们考虑任何一个爻变阴时，从另一个角度看，可以理解为其他五个爻保持不变。在易经的哲学观点中，这种情况被解释为：虽然表面上看起来发生了变化（一爻变阴），但本质上（其他五爻不变）仍然保持了乾卦的特性。因此，尽管形式上看起来变成了另一个卦，但在易经的解释体系中，这种变化被视为最终仍然回归到乾卦的本质。

这就是所谓的"归魂"现象。它不是物理上的变化，而是一种哲学和解卦的观点。这种解释强调了乾卦（代表纯阳、强健、创造）的基本性质是如此强大，即使在表面变化中，其本质依然保持不变。

别卦

与本卦有某种特定关系的其他卦，可能包括上述多种变化方式得到的卦。

How to build manimgl from source on macOS

import LoopingVideo from '~/components/looping-video.astro' import { Aside } from '@astrojs/starlight/components';

Manim is an engine for precise programmatic animations, designed for creating explanatory math videos.

<Aside type="note" title="Note"> Manim has two versions, a personal version maintained by 3blue1brown and a community version maintained by ManimCommunity. This article will demo a personal version of the demo on macOS maintained by 3blue1brown. </Aside>

Download source code

cd ~/projects
git clone https://github.com/3b1b/manim.git
cd manim

Creating an environment

conda create -n manim-build-from-source python=3.10
conda activate manim-build-from-source

Install libraries

mapbox-earcut

pip install mapbox-earcut

ffmpeg

brew install ffmpeg

mactex

brew install mactex

<Aside type="tip" title="Tips"> This may take a little longer. </Aside>

Verify mactex installation

Type latex --version in the terminal.

latex --version

# Output
pdfTeX 3.141592653-2.6-1.40.26 (TeX Live 2024)
kpathsea version 6.4.0
Copyright 2024 Han The Thanh (pdfTeX) et al.
There is NO warranty.  Redistribution of this software is
covered by the terms of both the pdfTeX copyright and
the Lesser GNU General Public License.
For more information about these matters, see the file
named COPYING and the pdfTeX source.
Primary author of pdfTeX: Han The Thanh (pdfTeX) et al.
Compiled with libpng 1.6.43; using libpng 1.6.43
Compiled with zlib 1.3.1; using zlib 1.3.1
Compiled with xpdf version 4.04

If the output is as above, then congratulations, mactex has been installed successfully. You can proceed to next step.

Otherwise, please continue. We need to fix this. I'm not sure why, but sometimes, after brew install mactex finishes, it just downloads a package to your disk. You still need to install it manually.

brew info mactex

# Output
❯ brew info mactex
==> mactex: 2024.0312
https://www.tug.org/mactex/
Installed
/opt/homebrew/Caskroom/mactex/2024.0312 (5.6GB)
From: https://github.com/Homebrew/homebrew-cask/blob/HEAD/Casks/m/mactex.rb
==> Name
MacTeX
==> Description
Full TeX Live distribution with GUI applications
==> Dependencies
ghostscript
==> Artifacts
mactex-20240312.pkg (Pkg)
==> Caveats
You must restart your terminal window for the installation of MacTeX CLI
tools to take effect.

Alternatively, Bash and Zsh users can run the command:

  eval "$(/usr/libexec/path_helper)"

==> Analytics
install: 3,166 (30 days), 7,794 (90 days), 30,329 (365 days)

Copy the highlighted path and open it in the terminal.

open /opt/homebrew/Caskroom/mactex/2024.031

You will see a file named mactex-<date>.pkg

tree /opt/homebrew/Caskroom/mactex/2024.0312
/opt/homebrew/Caskroom/mactex/2024.0312
└── mactex-20240312.pkg

1 directory, 1 file

Open this file and install it manually.

After the installation is complete, retry Verify mactex installation, now mactex should work.

Build from source

pip install -e ./manim

Verify manimgl installation

which manimgl # output: /opt/anaconda3/envs/manim-build-from-source/bin/manimgl

<Aside type="tip" title="Tips"> This may vary slightly from system to system, but can be verified by the name of the virtual environment, as long as manimgl is from the manim-build-from-source/bin/manimgl directory. Then there is no problem. </Aside>

Use manimgl

cd ~/projects/manim
manimgl example_scenes.py TexTransformExample

You should be able to see the animation below.

Congratulations, you have completed all the steps.

Additional

If you otherwise encounter problems with installation and use, you can create an Issue at here.

Look through the example scenes to see examples of the library's syntax, animation types and object types.

In the 3b1b/videos repo, you can see all the code for 3blue1brown videos.

Build Your Own Remote Dev Environment Based on VSCode

import { Aside, Badge, FileTree, LinkCard } from '@astrojs/starlight/components'; import ReadMore from '~/components/read-more.astro';

Requirements:

System: Ubuntu 24.04
Node.js: v22.21.1
Docker
Fly.io CLI

<Aside> The platform/account required above please register yourself. </Aside>

Build VSCode

Download VSCode Source Code

git clone https://github.com/microsoft/vscode.git
cd vscode

Here, we will build based on a historical version <Badge text='v1.99.3'/>.

git checkout -b my-vscode-1.99.3 1.99.3

Install Dependencies

sudo apt-get install build-essential g++ libx11-dev libxkbfile-dev libsecret-1-dev libkrb5-dev python-is-python3

<ReadMore>See How to build and run from source</ReadMore>

Compile VSCode

cd vscode
npm install
npm run compile

Build Docker Image

Create Build Script

Create a Dockerfile file in the project root directory, and create build.sh and entrypoint.sh files in the scripts directory.

vscode
- scripts/
  - build.sh
  - entrypoint.sh
- Dockerfile </FileTree>

#!/usr/bin/env bash
set -euo pipefail

ROOT_DIR=$(cd "$(dirname "$0")/.." && pwd)
cd "$ROOT_DIR"

IMAGE_NAME="${IMAGE_NAME:-vscode-web}"
IMAGE_TAG="${IMAGE_TAG:-local}"
DOCKERFILE="${DOCKERFILE:-Dockerfile}"
WEB_DIST_DIR="${WEB_DIST_DIR:-vscode-reh-web-linux-x64}"

echo "[ENV] IMAGE_NAME=${IMAGE_NAME} IMAGE_TAG=${IMAGE_TAG} DOCKERFILE=${DOCKERFILE}"
echo "[ENV] WEB_DIST_DIR=${WEB_DIST_DIR}"

echo "[STEP] Build VS Code web dist -> ${WEB_DIST_DIR}"
rm -rf "${WEB_DIST_DIR}"
npm run gulp "${WEB_DIST_DIR}"
cp -r ../"${WEB_DIST_DIR}" ./

echo "[STEP] Docker build ${IMAGE_NAME}:${IMAGE_TAG}"
docker build \
  --build-arg WEB_DIST_DIR="${WEB_DIST_DIR}" \
  -t "${IMAGE_NAME}:${IMAGE_TAG}" \
  -f "${DOCKERFILE}" \
  "${ROOT_DIR}"

echo "[DONE] Built image: ${IMAGE_NAME}:${IMAGE_TAG}"

#!/usr/bin/env bash
set -euo pipefail

log() {
  echo "[$(date '+%Y-%m-%d %H:%M:%S')] $*"
}

APP_HOME="${APP_HOME:-/opt/vscode-web}"
HOST="0.0.0.0"
LISTEN_PORT="${IDE_PORT:-8080}"
CONNECTION_TOKEN="${CONNECTION_TOKEN:-rviFq8oBBOIp92fGXnSlWygbjNpGU2FelEeMVQp6CTRiuux0BxGKU01yCCmICBbY}"

ARGS=(
  --host "${HOST}"
  --port "${LISTEN_PORT}"
  --connection-token "${CONNECTION_TOKEN}"
)

log "[INFO] Starting VS Code Web on ${HOST}:${LISTEN_PORT}?tkn=${CONNECTION_TOKEN}"
log "[INFO] APP_HOME=${APP_HOME}"

SERVER_BIN="${SERVER_BIN:-${APP_HOME}/bin/code-server-oss}"

exec "${SERVER_BIN}" "${ARGS[@]}" "$@"

FROM ubuntu:24.04

ARG WEB_DIST_DIR=vscode-reh-web-linux-x64

ENV DEBIAN_FRONTEND=noninteractive \
    APP_HOME=/opt/vscode-web \
    IDE_PORT=8080 \
    PNPM_STORE_DIR=/home/vscode/workspace/.pnpm-store

RUN apt-get update && apt-get install -y --no-install-recommends \
    ca-certificates \
    curl \
    bash \
    dumb-init \
    git \
    unzip \
    zip \
    wget \
    net-tools \
    lrzsz \
    gnupg \
 && curl -fsSL https://deb.nodesource.com/setup_20.x | bash - \
 && apt-get install -y --no-install-recommends nodejs \
 && npm install -g pnpm@9 \
 && npm cache clean --force \
 && rm -rf /var/lib/apt/lists/*

RUN groupadd -r vscode && useradd -m -r -g vscode -s /bin/bash vscode

RUN mkdir -p "$APP_HOME" /home/vscode/workspace "$PNPM_STORE_DIR" \
 && chown -R vscode:vscode "$APP_HOME" /home/vscode

COPY ${WEB_DIST_DIR}/ "$APP_HOME"/

COPY scripts/entrypoint.sh /usr/local/bin/entrypoint.sh

RUN chmod 0755 /usr/local/bin/entrypoint.sh \
 && chown -R vscode:vscode "$APP_HOME"

USER vscode

RUN pnpm config set store-dir "$PNPM_STORE_DIR" --global \
 && git config --global user.name "vscode" \
 && git config --global user.email "vscode@local.com"

WORKDIR /home/vscode/workspace

EXPOSE 8080

ENTRYPOINT ["/usr/bin/dumb-init", "--"]
CMD ["/usr/local/bin/entrypoint.sh"]

Then start building the image.

cd vscode
bash scripts/build.sh

After the build is complete, you can use docker images to view the built image.

Push Image to Dockerhub

<Aside> Replace {username} with your own username. </Aside>

docker login
docker tag vscode-web:local {username}/vscode-web:latest
docker push {username}/vscode-web:latest

Deploy to Fly.io

<Aside>

Replace {username} with your own username.
The region in the fly.toml below. Try to choose the closest one to you. All available regions are available at Fly.io Regions.
The app in the fly.toml below must be unique, if it is repeated, it will fail to create. You can add some random characters. As long as it is not repeated. </Aside>

Login Fly.io

fly auth login

Configure Token

Configure the access_token in the ~/.fly/config.yml file to the FLY_API_TOKEN environment variable.

export FLY_API_TOKEN=$(cat ~/.fly/config.yml | grep access_token | awk -F ': ' '{print $2}')

Create App

fly apps create {username}-vscode-web-ide

Create Volume

fly volumes create vscode_workspace --size 3 --region sin --app {username}-vscode-web-ide

Create fly.toml file

Create a fly.toml file in the project root directory.

app = '{username}-vscode-web-ide'
primary_region = 'sjc'

[build]
  image = '{username}/vscode-web:latest'

[http_service]
  internal_port = 8080
  force_https = true
  auto_stop_machines = 'suspend'
  auto_start_machines = true
  min_machines_running = 0
  processes = ['app']

[[vm]]
  memory = '4gb'
  cpu_kind = 'shared'
  cpus = 8

[[mounts]]
  source = "vscode_workspace"
  destination = "/home/vscode/workspace"

Then you can start deploying.

fly deploy

Access VSCode Web

If everything is normal, then you can now access VSCode Web normally.

https://{username}-vscode-web-ide.fly.dev?tkn=rviFq8oBBOIp92fGXnSlWygbjNpGU2FelEeMVQp6CTRiuux0BxGKU01yCCmICBbY

ChatGPT插件全球首发

import { CardGrid, Card, LinkButton, LinkCard } from '@astrojs/starlight/components';

最近ChatGPT在技术圈子很热，忽然灵感迸发。想着能不能放到IDE里面。于是这款插件诞生了。

预览

如上面的演示，可以直接在 IDE 进行操作。

安装

<LinkButton href="https://plugins.jetbrains.com/plugin/20603-chatgpt">查看插件市场</LinkButton>

打开 Settings/Preferences - Plugins - Marketplace - 搜索 "ChatGPT" - 安装插件

兼容的版本

2020.1 ~ 2024.*

ExcelReader reaches 1 million downloads

import { LinkCard, Steps, Card } from '@astrojs/starlight/components'; import ReadMore from '~/components/read-more.astro';

What's ExcelReader

<ReadMore>ExcelReader is a plugin for the JetBrains platform. It can parse files in three formats of xls, xlsx, csv in most editors of JetBrains, and supports more powerful data filtering functions.</ReadMore>

Why this project

Everything some that originated on July 27, 2020 one afternoon. My job at that time required working with very large amounts of Excel data in the IDE. I was mostly using Office at that time. however, I wasn't going to do anything complex with Excel, just want to preview the contents of the file, but Office was too heavyweight. Window switching frustrated me. So the idea of writing an add-in was born. So this project was born.

Some interesting history

<Steps>

Initial Design Challenges

I remember at the very beginning, what I wanted was to put the data view into the Editor area instead of the ToolWindow area, just like the DataGrip. But I couldn't do that due to the limitations of the technology at the time, so I ended up putting it in the ToolWindow area.
Design Philosophy

However, with my current vision, I insist that putting it in the ToolWindow area is a better option. Because, this plugin is not a professional data processing tool. So it shouldn't occupy the main Editor area, it's just an auxiliary tool to provide more help when necessary.
User Feedback & Evolution

During the first year or two of ExcelReader's release, I would receive feedback from users who thought it would be nice to support data writing. So finally, in February 2022, I started the development of the ExcelEditor project, an advanced version of ExcelReader.
Development Challenges

But unfortunately, I don't have much time to spend on these projects. I spent a lot of time in the early stages of the project because I needed to learn how to implement these features. I will have a fixed time each week to develop the ExcelEditor project.
Pricing Strategy

ExcelEditor retails for $3.90, which I think is moderately priced; it's not cheap, but it's not expensive either. I think it depends more on how well it can help you.

<LinkCard href="https://plugins.jetbrains.com/plugin/18663-exceleditor" title="ExcelEditor" description="ExcelEditor is a plugin for the JetBrains platform. It can parse files in three formats of xls, xlsx, csv in most editors of JetBrains, and supports more powerful data filtering functions." />
Development Challenges

Let's go back to ExcelReader. honestly, I didn't even think that this plugin would become so popular, I remember a time when I didn't pay attention to this plugin at all, but by the time I did, he already had more than 500K downloads. Until the year 2025... , I forget what month it was. Anyway, it crossed 1 million downloads. </Steps>

Conclusion

What exciting news. I think a million downloads is more than just a number, it's the trust and choice of countless developers, and I'm really grateful to everyone who has downloaded and used ExcelReader, the contributors who have provided valuable feedback to help the plugin grow. And my family, who have helped me a lot as well. Anyway, thank you all.

解决 intellij 插件构建时 gradle 下载缓慢的问题

import { LinkCard } from '@astrojs/starlight/components';

下载 IDE

在下载之前，需要知道IDE的的类型和版本，例如下面的片段

...

# IntelliJ Platform Properties -> https://plugins.jetbrains.com/docs/intellij/tools-gradle-intellij-plugin.html#configuration-intellij-extension
platformType = IC
platformVersion = 2022.2.5

...

它一般会配置在 gradle.properties 文件. 当然这个也取决于自己的项目配置。但我相信这应该不会难到你。我们可以很轻松就得到这个上面两个信息。

我们一共需要下载两个文件，分别是：

IDE发行版（ideaIC-2022.2.5）
IDE发行版源码包（ideaIC-2022.2.5-sources.jar）

下载发行版

URL的格式为

https://cache-redirector.jetbrains.com/www.jetbrains.com/intellij-repository/releases/com/jetbrains/intellij/idea/idea<platformType>/<platformVersion>/idea<platformType>-<platformVersion>.zip

带入类型和版本之后

https://cache-redirector.jetbrains.com/www.jetbrains.com/intellij-repository/releases/com/jetbrains/intellij/idea/ideaIC/2022.2.5/ideaIC-2022.2.5.zip

文件下载完成以后，需要放到 gradle 目录

~/.gradle/caches/modules-2/files-2.1/com.jetbrains.intellij.idea/idea<platformType>/<platformVersion>

带入类型和版本之后

~/.gradle/caches/modules-2/files-2.1/com.jetbrains.intellij.idea/ideaIC/2022.2.5

没有的话，需要先新建这个目录

然后计算下载的这个文件的SHA1值

在Windows可以使用计算

certutil -hashfile <path\to\ideaIC-2022.2.5.zip> SHA1

在macOS / Linux 可以使用计算

shasum -a 1 </path/to/ideaIC-2022.2.5.zip>

然后再刚才的

~/.gradle/caches/modules-2/files-2.1/com.jetbrains.intellij.idea/ideaIC/2022.2.5

下面在新建一个文件夹，文件夹的名字就是计算出来的SHA1的值。

例如我们计算出来的SHA1是

836d1896d66b8d410f65d76e8cbc910b16d9edab

新建文件夹之后，进入

~/.gradle/caches/modules-2/files-2.1/com.jetbrains.intellij.idea/ideaIC/2022.2.5/836d1896d66b8d410f65d76e8cbc910b16d9edab**

这个文件夹。然后把 ideaIC-2022.2.5.zip 放到这个文件夹里面。

下载发行版源码包

URL的格式为

https://cache-redirector.jetbrains.com/www.jetbrains.com/intellij-repository/releases/com/jetbrains/intellij/idea/idea<platformType>/<platformVersion>/idea<platformType>-<platformVersion>-sources.jar

带入类型和版本之后

https://cache-redirector.jetbrains.com/www.jetbrains.com/intellij-repository/releases/com/jetbrains/intellij/idea/ideaIC/2022.2.5/ideaIC-2022.2.5-sources.jar

文件下载完成以后，需要放到 gradle 目录

~/.gradle/caches/modules-2/files-2.1/com.jetbrains.intellij.idea/idea<platformType>/<platformVersion>

带入类型和版本之后

~/.gradle/caches/modules-2/files-2.1/com.jetbrains.intellij.idea/ideaIC/2022.2.5

没有的话，需要先新建这个目录

然后计算下载的这个文件的SHA1值

在Windows可以使用计算

certutil -hashfile <path\to\ideaIC-2022.2.5-sources.jar> SHA1

在macOS / Linux 可以使用计算

shasum -a 1 </path/to/ideaIC-2022.2.5-sources.jar>

然后再刚才的

~/.gradle/caches/modules-2/files-2.1/com.jetbrains.intellij.idea/ideaIC/2022.2.5

下面在新建一个文件夹，文件夹的名字就是计算出来的SHA1的值。

例如我们计算出来的SHA1是

d96d1896d66b8d410f65d76e8cbc910b16d9edac**

新建文件夹之后，进入

~/.gradle/caches/modules-2/files-2.1/com.jetbrains.intellij.idea/ideaIC/2022.2.5/d96d1896d66b8d410f65d76e8cbc910b16d9edac**

这个文件夹。然后把 ideaIC-2022.2.5-sources.jar 放到这个文件夹里面。

How to give developers feedback

import { Aside } from '@astrojs/starlight/components';

How to give developers feedback

Inevitably, we will encounter some problems when using plugins. To solve problems quickly, we need a way to communicate with developers quickly and efficiently. Reduce the possible time loss and useless repetitive operations, and solve the problem as quickly as possible.

An error occurs

Here, for example, we use the ChatGPT - EasyCode plugin to simulate an error.

The markers here are:

Plgugin version info
Author's e-mail or website
Error message

Try contacting the author

As you can see at marker 2, you can find the plugin author's customized website or email. First of all, where one can try to ask for help. It is also possible to ask for help in the forums (if there are any), maybe you are not the only one experiencing this problem. It is also possible to leave a message on the plugin's Review's page.

Anyway, the first thing to do is to make sure that there is at least one way to contact the author.

Providing necessary information

When an error occurs, the most important information for developers to know is the following：

Error log (At marker 3 in the image above): The information here is important. In most cases, we can quickly locate the problem based on this information alone. Copy everything here and put it in an attachment to the author. This is very necessary.
Plugin version (At marker 1 in the image above): When a plugin error occurs, we can usually see the plugin version, which is also an important piece of information.
IDE version: There are cases where SDK compatibility or other reasons cause certain bugs to only appear on a specific version of the IDE.
idea.log: This is a more complete log file for ide and will record some information about the ide/plugin. In some cases, the plugin author may also need you to provide this file.

How to find idea.log

Click Help -> Show Log in Explorer in the menu bar.

Select to see a file with the name idea.log. That's the file we're looking for.

Here my file path is:

C:\Users\obiscr\AppData\Local\JetBrains\IntelliJIdea2023.2\log\idea.log

<Aside type="note" title="Note"> This is just an example of a Windows system. For more detailed information about log locations, you can refer to Directories used by the IDE to store settings, caches, plugins and logs </Aside>

More complex situations

Usually, with the above, the problem can be solved. But sometimes, there are some weird cases, even the author can't solve it, or maybe it's still a bug in the IDE itself. so the bug fixing cycle is not very fixed.

Summarize

When in question, we can ask the author for as much information as possible in total at once. For example, all of the above mentioned. If there is only part of it, the author may ask you for other necessary information. This communication is usually more time consuming.

<Aside type="note" title="Note"> This is true for any problem, in fact, we can provide as much information as possible, always save some time spent on communication and also allow the problem to be solved as soon as possible. </Aside>

How to speed up pnpm postinstall

import { Aside, Badge, FileTree } from '@astrojs/starlight/components';

Problem description

If you have used supabase cli in your project, you may have encountered the following problem:

my-project
- node_modules/
- src/
- package.json </FileTree>

package.json contains the following content:

{
  "name": "my-project",
  "version": "0.1.0",
  "private": true,
  "scripts": {
    "dev": "next dev --turbo",
    "build": "next build",
    "start": "next start",
    "lint": "next lint",
    "type-check": "tsc --noEmit",
    "check-all": "npm run lint & npm run type-check & wait"
  },
  "dependencies": {
    "react": "^18",
    "react-dom": "^18",
    "next": "14.2.23",
    "@supabase/ssr": "^0.6.1",
    "@supabase/supabase-js": "^2.49.4"
  },
  "devDependencies": {
    "typescript": "^5",
    "@types/node": "^20",
    "@types/react": "^18",
    "@types/react-dom": "^18",
    "postcss": "^8",
    "supabase": "^2.34.3",
    "tailwindcss": "^3.4.1",
    "eslint": "^8",
    "eslint-config-next": "14.2.23"
  },
  "pnpm": {
    "onlyBuiltDependencies": [
      "supabase",
      "unrs-resolver"
    ],
    "peerDependencyRules": {
      "allowAny": [
        "supabase"
      ]
    }
  }
}

After running pnpm install, you will see the following output:

(base) obiscr@192 my-project % pnpm install

   ╭──────────────────────────────────────────╮
   │                                          │
   │   Update available! 10.10.0 → 10.14.0.   │
   │   Changelog: https://pnpm.io/v/10.14.0   │
   │     To update, run: pnpm self-update     │
   │                                          │
   ╰──────────────────────────────────────────╯

 WARN  deprecated eslint@8.57.1: This version is no longer supported. Please see https://eslint.org/version-support for other options.
 WARN  6 deprecated subdependencies found: @humanwhocodes/config-array@0.13.0, @humanwhocodes/object-schema@2.0.3, glob@7.2.3, inflight@1.0.6, node-domexception@1.0.0, rimraf@3.0.2
Packages: +417
+++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++
 WARN  Failed to create bin at /Users/obiscr/EasyCodeAIProjects/myblog123/node_modules/.bin/supabase. ENOENT: no such file or directory, chmod '/Users/obiscr/EasyCodeAIProjects/myblog123/node_modules/supabase/bin/supabase'
Progress: resolved 433, reused 382, downloaded 20, added 417, done
 WARN  Failed to create bin at /Users/obiscr/EasyCodeAIProjects/myblog123/node_modules/supabase/node_modules/.bin/supabase. ENOENT: no such file or directory, chmod '/Users/obiscr/EasyCodeAIProjects/myblog123/node_modules/supabase/bin/supabase'
node_modules/supabase: Running postinstall script, failed in 3m 52.2s
node_modules/supabase postinstall$ node scripts/postinstall.js
│ Downloading https://github.com/supabase/cli/releases/download/v2.34.3/supabase_2.34.3_checksums.txt
│ Downloading https://github.com/supabase/cli/releases/download/v2.34.3/supabase_darwin_arm64.tar.gz
│ Warning: Detected unsettled top-level await at file:///Users/obiscr/EasyCodeAIProjects/myblog123/node_modules/su…
│ await main();
│ ^
└─ Failed in 3m 52.2s at /Users/obiscr/projects/my-project/node_modules/supabase
node_modules/unrs-resolver: Running postinstall script, done in 199ms
 ELIFECYCLE  Command failed with exit code 13.

It took nearly 4 minutes, but the installation still failed. After multiple tests, this situation often occurs when the network conditions are poor.

Solution

<Aside type="note"> This article uses <Badge text="supabase cli" variant="note" /> as an example, but this method is universal. The essence is to change the postinstall.js file, so that it uses the local file first when installing, and if the local file does not exist, it executes the default logic to download from github. </Aside>

Since the postinstall script of supabase cli failed to install, let's take a look at what the postinstall script of supabase cli does.

Enter the node_modules/supabase directory, the structure is as follows:

supabase
- bin/
- scripts/
  - postinstall.js
- LICENSE
- package.json
- README.md </FileTree>

postinstall.js contains the following content:

#!/usr/bin/env node

// Ref 1: https://github.com/sanathkr/go-npm
// Ref 2: https://medium.com/xendit-engineering/how-we-repurposed-npm-to-publish-and-distribute-our-go-binaries-for-internal-cli-23981b80911b
"use strict";

import binLinks from "bin-links";
import { createHash } from "crypto";
import fs from "fs";
import fetch from "node-fetch";
import { Agent } from "https";
import { HttpsProxyAgent } from "https-proxy-agent";
import path from "path";
import { extract } from "tar";
import zlib from "zlib";

// Mapping from Node's `process.arch` to Golang's `$GOARCH`
const ARCH_MAPPING = {
  x64: "amd64",
  arm64: "arm64",
};

// Mapping between Node's `process.platform` to Golang's
const PLATFORM_MAPPING = {
  darwin: "darwin",
  linux: "linux",
  win32: "windows",
};

const arch = ARCH_MAPPING[process.arch];
const platform = PLATFORM_MAPPING[process.platform];

// TODO: import pkg from "../package.json" assert { type: "json" };
const readPackageJson = async () => {
  const contents = await fs.promises.readFile("package.json");
  return JSON.parse(contents);
};

// Build the download url from package.json
const getDownloadUrl = (packageJson) => {
  const pkgName = packageJson.name;
  const version = packageJson.version;
  const repo = packageJson.repository;
  const url = `https://github.com/${repo}/releases/download/v${version}/${pkgName}_${platform}_${arch}.tar.gz`;
  return url;
};

const fetchAndParseCheckSumFile = async (packageJson, agent) => {
  const version = packageJson.version;
  const pkgName = packageJson.name;
  const repo = packageJson.repository;
  const checksumFileUrl = `https://github.com/${repo}/releases/download/v${version}/${pkgName}_${version}_checksums.txt`;

  // Fetch the checksum file
  console.info("Downloading", checksumFileUrl);
  const response = await fetch(checksumFileUrl, { agent });
  if (response.ok) {
    const checkSumContent = await response.text();
    const lines = checkSumContent.split("\n");

    const checksums = {};
    for (const line of lines) {
      const [checksum, packageName] = line.split(/\s+/);
      checksums[packageName] = checksum;
    }

    return checksums;
  } else {
    console.error(
      "Could not fetch checksum file",
      response.status,
      response.statusText
    );
  }
};

const errGlobal = `Installing Supabase CLI as a global module is not supported.
Please use one of the supported package managers: https://github.com/supabase/cli#install-the-cli
`;
const errChecksum = "Checksum mismatch. Downloaded data might be corrupted.";
const errUnsupported = `Installation is not supported for ${process.platform} ${process.arch}`;

/**
 * Reads the configuration from application's package.json,
 * downloads the binary from package url and stores at
 * ./bin in the package's root.
 *
 *  See: https://docs.npmjs.com/files/package.json#bin
 */
async function main() {
  const yarnGlobal = JSON.parse(
    process.env.npm_config_argv || "{}"
  ).original?.includes("global");
  if (process.env.npm_config_global || yarnGlobal) {
    throw errGlobal;
  }
  if (!arch || !platform) {
    throw errUnsupported;
  }

  // Read from package.json and prepare for the installation.
  const pkg = await readPackageJson();
  if (platform === "windows") {
    // Update bin path in package.json
    pkg.bin[pkg.name] += ".exe";
  }

  // Prepare the installation path by creating the directory if it doesn't exist.
  const binPath = pkg.bin[pkg.name];
  const binDir = path.dirname(binPath);
  await fs.promises.mkdir(binDir, { recursive: true });

  // Create the agent that will be used for all the fetch requests later.
  const proxyUrl =
    process.env.npm_config_https_proxy ||
    process.env.npm_config_http_proxy ||
    process.env.npm_config_proxy;
  // Keeps the TCP connection alive when sending multiple requests
  // Ref: https://github.com/node-fetch/node-fetch/issues/1735
  const agent = proxyUrl
    ? new HttpsProxyAgent(proxyUrl, { keepAlive: true })
    : new Agent({ keepAlive: true });

  // First, fetch the checksum map.
  const checksumMap = await fetchAndParseCheckSumFile(pkg, agent);

  // Then, download the binary.
  const url = getDownloadUrl(pkg);
  console.info("Downloading", url);
  const resp = await fetch(url, { agent });
  const hash = createHash("sha256");
  const pkgNameWithPlatform = `${pkg.name}_${platform}_${arch}.tar.gz`;

  // Then, decompress the binary -- we will first Un-GZip, then we will untar.
  const ungz = zlib.createGunzip();
  const binName = path.basename(binPath);
  const untar = extract({ cwd: binDir }, [binName]);

  // Update the hash with the binary data as it's being downloaded.
  resp.body
    .on("data", (chunk) => {
      hash.update(chunk);
    })
    // Pipe the data to the ungz stream.
    .pipe(ungz);

  // After the ungz stream has ended, verify the checksum.
  ungz
    .on("end", () => {
      const expectedChecksum = checksumMap?.[pkgNameWithPlatform];
      // Skip verification if we can't find the file checksum
      if (!expectedChecksum) {
        console.warn("Skipping checksum verification");
        return;
      }
      const calculatedChecksum = hash.digest("hex");
      if (calculatedChecksum !== expectedChecksum) {
        throw errChecksum;
      }
      console.info("Checksum verified.");
    })
    // Pipe the data to the untar stream.
    .pipe(untar);

  // Wait for the untar stream to finish.
  await new Promise((resolve, reject) => {
    untar.on("error", reject);
    untar.on("end", () => resolve());
  });

  // Link the binaries in postinstall to support yarn
  await binLinks({
    path: path.resolve("."),
    pkg: { ...pkg, bin: { [pkg.name]: binPath } },
  });

  console.info("Installed Supabase CLI successfully");
}

await main();

In short, it downloads the binary file of supabase from the github repository of supabase and installs it into node_modules.

Then, can we optimize this process?

The answer is yes.

We can download the binary file of supabase to the local, and then install it into node_modules.

Execute the following command in the terminal of the project root directory to download the file:

curl -L -o lib/supabase/supabase_2.34.3_checksums.txt https://github.com/supabase/cli/releases/download/v2.34.3/supabase_2.34.3_checksums.txt
curl -L -o lib/supabase/supabase_darwin_arm64.tar.gz https://github.com/supabase/cli/releases/download/v2.34.3/supabase_darwin_arm64.tar.gz

Execute pnpm patch supabase@2.34.3 in the terminal.

obiscr@192 my-project % pnpm patch supabase@2.34.3
Patch: You can now edit the package at:

  /Users/obiscr/projects/my-project/node_modules/.pnpm_patches/supabase@2.34.3

To commit your changes, run:

  pnpm patch-commit '/Users/obiscr/projects/my-project/node_modules/.pnpm_patches/supabase@2.34.3'

In the node_modules/.pnpm_patches/supabase@2.34.3 directory, you will see the following content:

node_modules/
- .pnpm_patches
  - supabase@2.34.3
    - scripts
      - postinstall.js
    - LICENSE
    - package.json
    - README.md
  - state.json </FileTree>

Then edit the postinstall.js file.

#!/usr/bin/env node

// Ref 1: https://github.com/sanathkr/go-npm
// Ref 2: https://medium.com/xendit-engineering/how-we-repurposed-npm-to-publish-and-distribute-our-go-binaries-for-internal-cli-23981b80911b
"use strict";

import binLinks from "bin-links";
import { createHash } from "crypto";
import fs from "fs";
import fetch from "node-fetch";
import { Agent } from "https";
import { HttpsProxyAgent } from "https-proxy-agent";
import path from "path";
import { extract } from "tar";
import zlib from "zlib";

// Mapping from Node's `process.arch` to Golang's `$GOARCH`
const ARCH_MAPPING = {
  x64: "amd64",
  arm64: "arm64",
};

// Mapping between Node's `process.platform` to Golang's
const PLATFORM_MAPPING = {
  darwin: "darwin",
  linux: "linux",
  win32: "windows",
};

const arch = ARCH_MAPPING[process.arch];
const platform = PLATFORM_MAPPING[process.platform];

// TODO: import pkg from "../package.json" assert { type: "json" };
const readPackageJson = async () => {
  const contents = await fs.promises.readFile("package.json");
  return JSON.parse(contents);
};

// Build the download url from package.json
const getDownloadUrl = (packageJson) => {
  const pkgName = packageJson.name;
  const version = packageJson.version;
  const repo = packageJson.repository;
  const url = `https://github.com/${repo}/releases/download/v${version}/${pkgName}_${platform}_${arch}.tar.gz`;
  return url;
};

const fetchAndParseCheckSumFile = async (packageJson, agent) => {
  const version = packageJson.version;
  const pkgName = packageJson.name;
  const repo = packageJson.repository;
  const checksumFileUrl = `https://github.com/${repo}/releases/download/v${version}/${pkgName}_${version}_checksums.txt`;

  // Fetch the checksum file
  console.info("Downloading", checksumFileUrl);
  const response = await fetch(checksumFileUrl, { agent });
  if (response.ok) {
    const checkSumContent = await response.text();
    const lines = checkSumContent.split("\n");

    const checksums = {};
    for (const line of lines) {
      const [checksum, packageName] = line.split(/\s+/);
      checksums[packageName] = checksum;
    }

    return checksums;
  } else {
    console.error(
      "Could not fetch checksum file",
      response.status,
      response.statusText
    );
  }
};

const errGlobal = `Installing Supabase CLI as a global module is not supported.
Please use one of the supported package managers: https://github.com/supabase/cli#install-the-cli
`;
const errChecksum = "Checksum mismatch. Downloaded data might be corrupted.";
const errUnsupported = `Installation is not supported for ${process.platform} ${process.arch}`;

/**
 * Reads the configuration from application's package.json,
 * downloads the binary from package url and stores at
 * ./bin in the package's root.
 *
 *  See: https://docs.npmjs.com/files/package.json#bin
 */
async function main() {
  const yarnGlobal = JSON.parse(
    process.env.npm_config_argv || "{}"
  ).original?.includes("global");
  if (process.env.npm_config_global || yarnGlobal) {
    throw errGlobal;
  }
  if (!arch || !platform) {
    throw errUnsupported;
  }

  // Read from package.json and prepare for the installation.
  const pkg = await readPackageJson();
  if (platform === "windows") {
    // Update bin path in package.json
    pkg.bin[pkg.name] += ".exe";
  }

  // Prepare the installation path by creating the directory if it doesn't exist.
  const binPath = pkg.bin[pkg.name];
  const binDir = path.dirname(binPath);
  await fs.promises.mkdir(binDir, { recursive: true });

  // Create the agent that will be used for all the fetch requests later.
  const proxyUrl =
    process.env.npm_config_https_proxy ||
    process.env.npm_config_http_proxy ||
    process.env.npm_config_proxy;
  // Keeps the TCP connection alive when sending multiple requests
  // Ref: https://github.com/node-fetch/node-fetch/issues/1735
  const agent = proxyUrl
    ? new HttpsProxyAgent(proxyUrl, { keepAlive: true })
    : new Agent({ keepAlive: true });

  // First, fetch the checksum map.
  const checksumMap = await fetchAndParseCheckSumFile(pkg, agent);
  // Prefer local resources if present (project root via INIT_CWD)
  const projectRoot = process.env.INIT_CWD || process.cwd();
  const resourcesDir = path.join(projectRoot, "lib", "supabase");
  const localChecksumPath = path.join(resourcesDir, `${pkg.name}_${pkg.version}_checksums.txt`);
  const localTgzPath = path.join(resourcesDir, `${pkg.name}_${platform}_${arch}.tar.gz`);
  
  // First, read checksum map from local file if available; otherwise fetch
  let checksumMap;
  try {
    const checkSumContent = await fs.promises.readFile(localChecksumPath, "utf8");
    const lines = checkSumContent.split("\n");
    checksumMap = {};
    for (const line of lines) {
      const [checksum, packageName] = line.split(/\s+/);
      if (packageName) checksumMap[packageName] = checksum;
    }
    console.info("Using local checksum file", localChecksumPath);
  } catch {
    // fallback to remote checksum
    checksumMap = await fetchAndParseCheckSumFile(pkg, agent);
  }

  // Then, download the binary.
  const url = getDownloadUrl(pkg);
  console.info("Downloading", url);
  const resp = await fetch(url, { agent });
  const hash = createHash("sha256");
  const pkgNameWithPlatform = `${pkg.name}_${platform}_${arch}.tar.gz`;

  // Then, decompress the binary -- we will first Un-GZip, then we will untar.
  const ungz = zlib.createGunzip();
  const binName = path.basename(binPath);
  const untar = extract({ cwd: binDir }, [binName]);

  // Update the hash with the binary data as it's being downloaded.
  resp.body
  let sourceStream;
  let usingLocal = false;
  try {
    await fs.promises.access(localTgzPath, fs.constants.R_OK);
    usingLocal = true;
  } catch {}
  if (usingLocal) {
    console.info("Using local tgz", localTgzPath);
    sourceStream = fs.createReadStream(localTgzPath);
  } else {
    console.info("Downloading", url);
    const resp = await fetch(url, { agent });
    sourceStream = resp.body;
  }
  sourceStream
    .on("data", (chunk) => {
      hash.update(chunk);
    })
    // Pipe the data to the ungz stream.
    .pipe(ungz);

  // After the ungz stream has ended, verify the checksum.
  ungz
    .on("end", () => {
      const expectedChecksum = checksumMap?.[pkgNameWithPlatform];
      // Skip verification if we can't find the file checksum
      if (!expectedChecksum) {
        console.warn("Skipping checksum verification");
        return;
      }
      const calculatedChecksum = hash.digest("hex");
      if (calculatedChecksum !== expectedChecksum) {
        throw errChecksum;
      }
      console.info("Checksum verified.");
    })
    // Pipe the data to the untar stream.
    .pipe(untar);

  // Wait for the untar stream to finish.
  await new Promise((resolve, reject) => {
    untar.on("error", reject);
    untar.on("end", () => resolve());
  });

  // Link the binaries in postinstall to support yarn
  await binLinks({
    path: path.resolve("."),
    pkg: { ...pkg, bin: { [pkg.name]: binPath } },
  });

  console.info("Installed Supabase CLI successfully");
}

await main();

The new part of this logic will use the files in the lib/supabase directory first, and if the file does not exist, it will execute the default logic to download from github.

After editing, we submit the changes.

obiscr@192 my-project % pnpm patch-commit '/Users/obiscr/projects/my-project/node_modules/.pnpm_patches/supabase@2.34.3'
Lockfile is up to date, resolution step is skipped
Packages: +20
++++++++++++++++++++
Progress: resolved 0, reused 45, downloaded 0, added 20, done
node_modules/supabase: Running postinstall script, done in 236ms

This will generate a supabase@2.34.3.patch file in the patches directory in the project root directory.

my-project
- lib/
  - supabase/
    - supabase_2.34.3_checksums.txt
    - supabase_darwin_arm64.tar.gz
- node_modules/
- patches/
  - supabase@2.34.3.patch
- src/
- package.json </FileTree>

It will also generate a patchedDependencies configuration in package.json.

{
  "name": "my-project",
  "version": "0.1.0",
  "private": true,
  "scripts": {
    "dev": "next dev --turbo",
    "build": "next build",
    "start": "next start",
    "lint": "next lint",
    "type-check": "tsc --noEmit",
    "check-all": "npm run lint & npm run type-check & wait"
  },
  "dependencies": {
    "react": "^18",
    "react-dom": "^18",
    "next": "14.2.23",
    "@supabase/ssr": "^0.6.1",
    "@supabase/supabase-js": "^2.49.4"
  },
  "devDependencies": {
    "typescript": "^5",
    "@types/node": "^20",
    "@types/react": "^18",
    "@types/react-dom": "^18",
    "postcss": "^8",
    "supabase": "^2.34.3",
    "tailwindcss": "^3.4.1",
    "eslint": "^8",
    "eslint-config-next": "14.2.23"
  },
  "pnpm": {
    "onlyBuiltDependencies": [
      "supabase",
      "unrs-resolver"
    ],
    "peerDependencyRules": {
      "allowAny": [
        "supabase"
      ]
    }
    },
    "patchedDependencies": {
      "supabase@2.34.3": "patches/supabase@2.34.3.patch"
    }
  }
}

Then we move the supabase@2.34.3.patch file to the lib/supabase directory.

At this time, the directory structure is as follows:

my-project
- lib/
  - supabase/
    - supabase_2.34.3_checksums.txt
    - supabase_darwin_arm64.tar.gz
    - supabase@2.34.3.patch
- node_modules/
- patches/
  - supabase@2.34.3.patch
- src/
- package.json </FileTree>

We also change the patchedDependencies configuration in package.json.

{
  "name": "my-project",
  "version": "0.1.0",
  "private": true,
  "scripts": {
    "dev": "next dev --turbo",
    "build": "next build",
    "start": "next start",
    "lint": "next lint",
    "type-check": "tsc --noEmit",
    "check-all": "npm run lint & npm run type-check & wait"
  },
  "dependencies": {
    "react": "^18",
    "react-dom": "^18",
    "next": "14.2.23",
    "@supabase/ssr": "^0.6.1",
    "@supabase/supabase-js": "^2.49.4"
  },
  "devDependencies": {
    "typescript": "^5",
    "@types/node": "^20",
    "@types/react": "^18",
    "@types/react-dom": "^18",
    "postcss": "^8",
    "supabase": "^2.34.3",
    "tailwindcss": "^3.4.1",
    "eslint": "^8",
    "eslint-config-next": "14.2.23"
  },
  "pnpm": {
    "onlyBuiltDependencies": [
      "supabase",
      "unrs-resolver"
    ],
    "peerDependencyRules": {
      "allowAny": [
        "supabase"
      ]
    },
    "patchedDependencies": {
      "supabase@2.34.3": "patches/supabase@2.34.3.patch"
      "supabase@2.34.3": "lib/supabase/supabase@2.34.3.patch"
    }
  }
}

Test changes

Delete pnpm-lock.yaml, node_modules, and then run pnpm install, you should be able to see that the installation speed has been significantly accelerated. It only takes 266ms to complete the installation. Compared to the previous nearly 4 minutes, there is a very obvious improvement.

obiscr@192 my-project % pnpm install
 WARN  deprecated eslint@8.57.1: This version is no longer supported. Please see https://eslint.org/version-support for other options.
 WARN  6 deprecated subdependencies found: @humanwhocodes/config-array@0.13.0, @humanwhocodes/object-schema@2.0.3, glob@7.2.3, inflight@1.0.6, node-domexception@1.0.0, rimraf@3.0.2
Packages: +418
++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++
 WARN  Failed to create bin at /Users/obiscr/projects/my-project/node_modules/.bin/supabase. ENOENT: no such file or directory, chmod '/Users/obiscr/projects/my-project/node_modules/supabase/bin/supabase'
Progress: resolved 433, reused 402, downloaded 0, added 418, done
 WARN  Failed to create bin at /Users/obiscr/projects/my-project/node_modules/supabase/node_modules/.bin/supabase. ENOENT: no such file or directory, chmod '/Users/obiscr/projects/my-project/node_modules/supabase/bin/supabase'
node_modules/supabase: Running postinstall script, done in 266ms
Done in 1m 25.2s using pnpm v10.10.0

Conclusion

This article introduces how to speed up the pnpm postinstall script through the pnpm patch command. I hope it is useful to you.

Intellij Adaptive Color Scheme

This article describes how to make the colors of user interface components in IntelliJ adaptable to changes in the IDE theme.

Create a UI Component

Suppose we now have a component like this

public class UIContainer extends JBPanel<UIContainer> {

    private static final EditorColorsManager editorColorsManager = EditorColorsManager.getInstance();
    private static EditorColorsScheme scheme = editorColorsManager.getGlobalScheme();
    private static final ColorKey notificationColor =  ColorKey.createColorKey("NOTIFICATION_BACKGROUND");

    public MessageComponent() {
      // TODO init some actions...

      Color color = scheme.getColor(notificationColor);
      setBackground(color)
    }
}

We set a background color for the UIContainer that comes from the current ColorsScheme's NOTIFICATION_BACKGROUND, but it's clear that in this case, when we switch themes, the color of the UIContainer doesn't switch with the theme's color.

UIContainer color doesn't switch with the theme's color when we switch themes in this case. However, in most cases, this may cause the UI to have similar colors and fonts, so that the displayed content is not visible.

So, how can we make the background color of UIContainer change automatically as the theme changes?

Adaptive to IDE theme

Implements Interfaces

Make UIContainer implements Disposable and EditorColorsListener

public class UIContainer extends JBPanel<UIContainer> implements Disposable, EditorColorsListener {
    {... rest of code}
}

Add Message Event

public class UIContainer extends JBPanel<UIContainer> implements Disposable, EditorColorsListener {

    private static final EditorColorsManager editorColorsManager = EditorColorsManager.getInstance();
    private static EditorColorsScheme scheme = editorColorsManager.getGlobalScheme();
    private static final ColorKey notificationColor =  ColorKey.createColorKey("NOTIFICATION_BACKGROUND");

    public MessageComponent() {
      // TODO init some actions...

      Color color = scheme.getColor(notificationColor);
      setBackground(color)

      MessageBusConnection connection = ApplicationManager.getApplication().getMessageBus().connect(this);
      connection.subscribe(EditorColorsManager.TOPIC, this);
    }
}

Implements globalSchemeChange

When theme changed, the globalSchemeChange method will be called.

currentColorsScheme will be the selected theme, so we regain the notificationColor from currentColorsScheme and reset the color for the component.

public class UIContainer extends JBPanel<UIContainer> implements Disposable, EditorColorsListener {

    {... rest of code}

    @Override
    public void globalSchemeChange(@Nullable EditorColorsScheme currentColorsScheme) {
        Color color = currentColorsScheme == null ? scheme.getColor(notificationColor) :
                currentColorsScheme.getColor(notificationColor);
        setBackground(color);
        revalidate();
        repaint();
    }
}

Implements dispose

public class UIContainer extends JBPanel<UIContainer> implements Disposable, EditorColorsListener {

    {... rest of code}

    @Override
    public void dispose() {
        Disposer.dispose(this);
    }
}

Finally Code

So, The final code is as follows

public class UIContainer extends JBPanel<UIContainer> implements Disposable, EditorColorsListener {

    private static final EditorColorsManager editorColorsManager = EditorColorsManager.getInstance();
    private static EditorColorsScheme scheme = editorColorsManager.getGlobalScheme();
    private static final ColorKey notificationColor =  ColorKey.createColorKey("NOTIFICATION_BACKGROUND");

    public MessageComponent() {
      // TODO init some actions...

      Color color = scheme.getColor(notificationColor);
      setBackground(color)

      MessageBusConnection connection = ApplicationManager.getApplication().getMessageBus().connect(this);
      connection.subscribe(EditorColorsManager.TOPIC, this);
    }

    @Override
    public void globalSchemeChange(@Nullable EditorColorsScheme currentColorsScheme) {
        if (currentColorsScheme == null) {
            return;
        }
        Color color = scheme.getColor(notificationColor);
        setBackground(color);
        revalidate();
        repaint();
    }

    @Override
    public void dispose() {
        Disposer.dispose(this);
    }
}

Now when you switch themes, the color of the component will automatically change with the color of the theme. Hope this helps.

Disposer in the IntelliJ Platform

This article is a case study to simplify the IntelliJ Platform to introduce the IntelliJ Platform in the disposer.

In fact, the SDK documentation already has a more detailed description of this: Disposer and Disposable, before we get started, it might be a good idea to take a look here.

Scene Description

I have modelled a scenario here. There is a ToolWindow layout as follows,Here we use the UI Inspector to analyse the layout:

A rootPanel with BorderLayout, top (North) is a Toolbar, center (Center) is a JPanel. Click ➕ will add a random code snippet to Center's JPanel.

The scenario, as above, is a very simple ToolWindow with very simple functionality.

Memory leak

Here is the key part of the code snippet:

import com.intellij.openapi.project.Project;
import com.intellij.openapi.wm.ToolWindow;
import com.intellij.openapi.wm.ToolWindowFactory;
import com.intellij.ui.content.Content;
import com.intellij.ui.content.ContentFactory;
import com.obiscr.template.dispose.MainPanel;
import org.jetbrains.annotations.NotNull;

public class MyToolWindowFactory implements ToolWindowFactory {
    @Override
    public void createToolWindowContent(@NotNull Project project, @NotNull ToolWindow toolWindow) {
        ContentFactory contentFactory = ContentFactory.getInstance();
        MainPanel panel = new MainPanel(project);
        Content content = contentFactory.createContent(panel.getComponent(), "Dispose", false);
        toolWindow.getContentManager().addContent(content);
    }
}

and

import com.intellij.icons.AllIcons;
import com.intellij.openapi.actionSystem.AnAction;
import com.intellij.openapi.actionSystem.AnActionEvent;
import com.intellij.openapi.actionSystem.DefaultActionGroup;
import com.intellij.openapi.actionSystem.impl.ActionToolbarImpl;
import com.intellij.openapi.editor.Editor;
import com.intellij.openapi.editor.EditorFactory;
import com.intellij.openapi.editor.EditorSettings;
import com.intellij.openapi.editor.colors.EditorColorsManager;
import com.intellij.openapi.editor.colors.EditorColorsScheme;
import com.intellij.openapi.editor.ex.EditorEx;
import com.intellij.openapi.editor.highlighter.EditorHighlighter;
import com.intellij.openapi.editor.highlighter.EditorHighlighterFactory;
import com.intellij.openapi.project.Project;
import com.intellij.testFramework.LightVirtualFile;
import com.intellij.ui.components.panels.VerticalLayout;
import com.intellij.util.ui.JBUI;
import com.intellij.util.ui.UIUtil;
import org.jetbrains.annotations.NotNull;

import javax.swing.*;
import java.awt.*;
import java.io.File;
import java.time.LocalDateTime;
import java.time.format.DateTimeFormatter;
import java.util.UUID;

public class MainPanel {

    private final JPanel rootPanel;
    private final JPanel centerPanel;
    private final Project myProject;


    public MainPanel(Project project) {
        myProject = project;
        rootPanel = new JPanel(new BorderLayout());
        centerPanel = new JPanel(new VerticalLayout(JBUI.scale(10)));
        centerPanel.setBorder(JBUI.Borders.empty(10));

        DefaultActionGroup actionGroup = new DefaultActionGroup();
        AnAction addAction = new AnAction(() -> "Add Item", AllIcons.General.Add) {
            @Override
            public void actionPerformed(@NotNull AnActionEvent e) {
                String text = "// Code snippet at " + LocalDateTime.now().
                format(DateTimeFormatter.ofPattern("yyyy-MM-dd")) + "\n";
                text += HelloWorld.getRandomHelloWorldCode();
                Editor editor = createEditor(myProject, text);
                centerPanel.add(editor.getComponent());
                centerPanel.revalidate();
                centerPanel.repaint();
            }
        };
        actionGroup.add(addAction);
        ActionToolbarImpl actionToolbar = new ActionToolbarImpl("MyPanelToolbar", actionGroup, true);
        actionToolbar.setTargetComponent(rootPanel);
        actionToolbar.setBorder(JBUI.Borders.customLine(UIUtil.getBoundsColor(), 1,0,1,0));
        rootPanel.add(actionToolbar, BorderLayout.NORTH);
        rootPanel.add(centerPanel, BorderLayout.CENTER);
    }

    public JPanel getComponent() {
        return rootPanel;
    }

    private Editor createEditor(Project project, String text) {
        EditorFactory editorFactory = EditorFactory.getInstance();
        EditorEx editor = (EditorEx) editorFactory.createViewer(
                editorFactory.createDocument(text),
                project);
        // Others settings
        // ...
        return editor;
    }
}

Here we just create the Editor object, but we don't clean up the memory it occupies when the program exits.

When closing the IDE, relevant exception messages are displayed (Of course, this information is also displayed in the idea.log)：

According to the error log, we can know that it is because the created Editor object is not released when the application is closed and there is a risk of memory overflow.

Solving

Ok, now we already know where the problem is, the following we solve the problem, the solution is also simple, just need to close the IDE, release in this object can be.

First, make MainPanel implement the Disposable interface and override the dispose() method. Then after creating editor, register Disposer with parent this to indicate that the editor will be destroyed when this is disposed.

public class MainPanel implements Disposable {
	@Override
    public void dispose() {
        centerPanel.removeAll();
        rootPanel.removeAll();
    }

    private Editor createEditor(Project project, String text) {
        EditorEx editor = ...;
        Disposer.register(this, () -> EditorFactory.getInstance().releaseEditor(editor));
        return editor;
    }
}

In addition, since in this case the components are all based on Content, we register the disposer for content as MainPanel

public class MyToolWindowFactory implements ToolWindowFactory {

    @Override
    public void createToolWindowContent(@NotNull Project project, @NotNull ToolWindow toolWindow) {
        MainPanel panel = new MainPanel(project);
        Content content = ...;
        content.setDisposer(panel);
        ...
    }
}

The source code for ContentImpl.java looks like this, and you can see that when content is destroyed, it calls Disposer.dispose(myDisposer); to destroy the set myDisposer, which is the MainPanel above.

  @Override
  public void dispose() {
    if (myShouldDisposeContent && myComponent instanceof Disposable) {
      Disposer.dispose((Disposable)myComponent);
    }

    if (myDisposer != null) {
      Disposer.dispose(myDisposer);
      myDisposer = null;
    }

    myFocusRequest = null;
    clearUserData();
  }

So now the whole process is as follows:

content.dispose() --(call)--> panel.dispose() --(call)--> EditorFactory.getInstance().releaseEditor(editor);

So, when content is closed, the editor object is also destroyed.

IntelliJ Plugin Development

import { Aside } from '@astrojs/starlight/components';

This article introduces plugin development related content, focusing on how to deal with problems encountered...

I believe that many plugin developers in the initial period will encounter a lot of various difficulties, but this is quite normal. So far, I have developed a number of plugins during which I also encountered a lot of problems. Some are still learning, some are still being solved. If you have similar problems, then this article is worth reading.

For myself, when it comes to problems, there are generally so many ways to deal with them as follows:

I - IntelliJ Platform

IntelliJ Platform Equivalent to the SDK platform documentation. Includes documentation for plugins, base platform, project model, PSI, features, testing, resources, API changes, tools, and other modules.

II - IntelliJ Community

IntelliJ Community contains a lot of questions and answers.

III - IntelliJ

IntelliJ Plugins is a git repository that contains many of JetBrains' own plugins, where you can find good examples for reference.

IV - IntelliJ Code Samples

IntelliJ Code Samples is a git repository where good examples can be found for reference.

V - YouTrack

YouTrack is mainly used for bug feedback, and you can also search for relevant information here when you encounter problems.

VI - Internal Model & Source Code

This is a very useful feature. The internal mode can be enabled from this document. Internal mode together with IntelliJ Community Edition source code can solve a lot of problems.

<Aside type="note" title="Note"> I do highly recommend using this approach to solve problems. When using this approach, you need to read the IntelliJ Community Edition source code, which can be very good to develop some habits of source code reading source code. </Aside>

VII - Slack

Here you can discuss plugin development for the JetBrains IDE and Team Tools, as well as all things related to the JetBrains Marketplace. There are a lot of plugin developers as well as official developers here, and most of the issues can be solved here.

<Aside type="note" title="Note"> Slack for me is generally the final option when I'm at the end of my rope, and when none of the above can be solved, I look for other developers or official developers in Slack to assist with the solution. </Aside>

Summaries

These are the solutions to the problems I have encountered in my own development process over the past few years. I hope it can provide a reference for developers who need it.

JetBrains Git Client 2025.3 EAP

import { LinkCard, } from '@astrojs/starlight/components';

Today, I'd like to share a very special content. Recently, I was lucky enough to get a closed preview of JetBrains' new GitClient product. It's worth noting that the application channel is now closed, so today's content is relatively exclusive.

Startup View

First, when we open the tool, we can choose to log in to Github or GitLab, clone a project, or open an existing project.

After opening a project, we can see that the overall UI is still clean and many unnecessary tool windows have been removed.

Settings View

Another important difference is that the plugin system is gone. This is a big difference, and I hope it can be added back later.

Merge View

In terms of code merging, the overall UI and behavior are basically consistent with the IDE's built-in Git tool.

{/* ## Q & A

<Collapse title="Q: Does it need to pay for GitClient when it is officially released?" variant="note" defaultExpanded={true}> A: The development team is currently focusing on the development side of things, and whether it will be a free or subscription model upon release is unknown at this time </Collapse> */}

JetBrains码上道：从零开始开发插件

import { Aside } from '@astrojs/starlight/components';

有幸参与JetBrains 官方举办的直播活动，作为嘉宾分享插件开发经验，并且还能向其他大佬一起学习。

JetBrains 码上道 | 记得预约直播哦，还有机会抽取IntelliJ IDEA一年的免费许可。欢迎预约观看。

直播时间：2022年9月29日，晚上8点整。
直播间：扫描下图中的二维码、BiliBili直播间或微信视频号搜索：JetBrains。
文章转载自：JetBrains 博客官网，JetBrains 微信公众号。 </Aside>

IntelliJ IDEA 作为开发者青睐的工具，不仅自身功能强大，同时也吸引了众多开发者在 IntelliJ 平台上创造各种各样的插件。这些插件高效且实用，都来自作者们对开发工作的深入理解。有了这些插件，往往能让大家的工作事半功倍，满足项目开发中的各种需求，让开发工作更加得心应手。

本次直播将为大家邀请到多位中文 IntelliJ IDEA 插件作者，介绍那些广为人知且高效实用的插件。本次直播活动将分为两个部分，首先，将与大家分享如何在 IntelliJ 平台从无到有开发插件，接着我们会邀请嘉宾们一起聊聊关于插件开发的故事和体会。让我们一起来开发插件吧！

本次活动将在 JetBrains 中国官方 BiliBili 频道和微信视频号同步直播，别忘了预留时间，并关注 JetBrains 微信公众号以获取第一手活动信息。

分享嘉宾

主持人

范圣佑 (ShengYou)

圣佑是 JetBrains 技术布道师，对 JetBrians 相关技术与产品也有深入的理解。作为布道师，他乐意分享自己的开发经验，帮助更多开发者提升生产力及代码质量。

<Aside type="tip" title="注意"> 本次活动将在 JetBrains 视频号、BiliBili 频道同步直播。直播还设有抽奖环节，我们准备了一些 IntelliJ IDEA 个人版一年期许可证，无论你在哪个平台收看直播，均有机会参与抽奖。 </Aside>

嘉宾精选插件

Fast Request: https://plugins.jetbrains.com/plugin/16988
ExcelEditor: https://plugins.jetbrains.com/plugin/18663
MybatisCodeHelperPro: https://plugins.jetbrains.com/plugin/9837
Code Node: https://plugins.jetbrains.com/plugin/17501
Toolset: https://plugins.jetbrains.com/plugin/14384
Rainbow Brackets: https://plugins.jetbrains.com/plugin/10080

<Aside type="note" title="细节信息"> 有关本次活动的更多细节信息，请阅读原文

官方博客
微信公众号 </Aside>

JetBrains Marketplace 5 周年

import { Aside, Tabs, TabItem, Card } from '@astrojs/starlight/components';

开箱

大概在几天前，收到了一个包裹。下班回家打开一看，原来是 Jetbrains 5 周年礼物。

开箱之后，大概有这些东西：

<Aside type="note" title="感谢"> 在此：感谢所有的插件用户，感谢JetBrains！ </Aside>

JIT IntelliJ based Git Client

import { Tabs, TabItem, Card } from '@astrojs/starlight/components';

Origins

Hi guys, I'm remaking this project based on intellij-commiunity. Only a tiny part of it is finished.

I named it Jit (from IntelliJ Git / JetBrains Git) and drew the new Icon. You can open a project as in IntelliJ IDEA, and the Git ToolWindow will appear directly after you open it.

It all started with an issue on YouTrack: Make git client a standalone app

I think it very interesting. The Git client that comes with the JetBrains family of products is probably the best Git client I've ever used. So I plan to maintain the Git functionality as a separate Git tool.

General idea

I removed the entire Editor section for now, keeping only some of the associated ToolWindow: (Git / Commit / Pull Requests / Terminal / Notification).

It's a lot of work, and as I mentioned before, there are a lot of dependencies between modules that need to be dealt with. I'm busy at work and usually have only little time for this. But seriously, I'm interested in this.

Updating

Preview

Here are some preview images of what's currently available.

<Tabs> <TabItem label="Welcome"> After launching, just like IntelliJ IDEA, you can select a project to open.

![](../../../assets/blog/images/welcome.png)

</TabItem> <TabItem label="About"> In About you can see the basic information. the name, icon has been changed here.

![](../../../assets/blog/images/about.png)

</TabItem> <TabItem label="Git"> The Git tool window displays basic information about the repository, branches, and commits, and you can see the details of file changes by selecting a commit.

![](../../../assets/blog/images/git-view.png)

</TabItem> <TabItem label="Commit"> In the Commit tool window, you can see the files to be committed and enter the commit information.

![](../../../assets/blog/images/commit-view.png)

</TabItem> <TabItem label="Terminal"> It also retains the terminal tool window, where you can use git commands for more complex operations. Or other basic operations.

![](../../../assets/blog/images/terminal.png)

</TabItem> <TabItem label="Pull Requests"> In the Pull Request Tool window, you can see the repository's current merge requests.

![](../../../assets/blog/images/pull-requests.png)

</TabItem> <TabItem label="Notification"> Notifications are also kept for a better interactive experience.

![](../../../assets/blog/images/notification.png)

</TabItem> </Tabs>

Maia - Self-hosted DAG workflow orchestration and execution service

import { LinkCard, Aside, CardGrid, Card } from '@astrojs/starlight/components';

I’ve recently been translating some Spanish articles, more than 2,000 in total. It’s been a really demanding job. Not because it’s complicated—on the contrary, it’s quite simple, but because the workload is enormous.

So I built this entire workflow engine/system to assist with my translations. I can finish a year’s worth of work in two weeks. In fact, if I wanted to, I could do it even faster.

That’s how this project came to be.

Now I’m planning to open-source it, and I hope it will be useful to you as well. This project is distributed under the MIT license.

Oh, and the agent part is still in beta testing and isn’t stable yet—I still need to keep working on that piece.

Next, let me explain this project in detail.

Maia, it's a self-hosted DAG workflow orchestration and execution service for long-running automation—observable, debuggable, and replayable.

Features

Persistence: state and outputs are persisted with SQLite (retained and traceable)
Observability: real-time logs/event streams (SSE) with replay
Isolated execution: optional Runner + Sandbox container isolation (recommended for production)
Composable: each step has explicit inputs/outputs and can produce artifacts
Optional agent: helps generate/refine workflows (opt-in)

Agent Orchestration

I used AI to generate a workflow that fetches RSS data and analyzes it.

Runs

I use workflows to check certain information about GitHub repositories.

Jobs

Schedules

I can also set up schedules to trigger tasks daily—for example, fetching the top 10 Hacker News stories and sending them to my Discord bot.

Batches

If I want, I can also trigger multiple tasks in batches and process them in parallel.

The source repo

Finally, I hope it can be useful to you. Enjoy

Next.js Stripe Supabase Starter

import { Steps, Card, FileTree, Tabs, TabItem, LinkCard, CardGrid, } from '@astrojs/starlight/components';

Features

User Authentication: Email/password login with Supabase Auth
3 Product Categories: Premium Membership, Cloud Storage, and API Access
Multiple Pricing Options: One-time payments and subscriptions
Stripe Checkout Integration: Secure hosted payment pages
Database Integration: Supabase for user data and purchase records
Webhook Processing: Automatic payment confirmation and database updates
Purchase Tracking: Real-time purchase status from database
Responsive Design: Mobile-friendly interface
TypeScript: Full type safety

Tech Stack

Frontend: Next.js 15 (App Router)
Database: Supabase (PostgreSQL)
Authentication: Supabase Auth
Payments: Stripe Checkout
Styling: Tailwind CSS
Language: TypeScript
Deployment: Vercel (recommended)

Product Structure

<CardGrid cols={3}> <Card title="Premium Membership"> - Monthly Plan: $29.99 - Yearly Plan: $99.99 - Lifetime Plan: $199.99 </Card> <Card title="Cloud Storage"> - 50GB Storage: $9.99 - 100GB Storage: $19.99 - 500GB Storage: $49.99 </Card> <Card title="API Access"> - Basic API: $19.99 - Pro API: $49.99 - Enterprise API: $99.99 </Card> </CardGrid>

Complete Setup Guide

Follow these steps to set up the project from scratch:

Step 1: Clone and Install Dependencies

# Clone the repository
git clone https://github.com/obiscr/nextjs-stripe-supabase-starter.git
cd nextjs-stripe-supabase-starter

# Install dependencies
npm install

Step 2: Create .env.local file

Create a .env.local file in the root directory.

nextjs-stripe-supabase-starter
- src/
- .env.local create this file
- ... </FileTree>

Step 3: Create Supabase Account

<Steps>

Go to Supabase and create a free account
Create an organization and a new project

Go to Project overview

Copy Project URL / API Key into .env.local file

# Supabase Keys (get from Supabase Project Dashboard > Project Settings > API Keys)
NEXT_PUBLIC_SUPABASE_URL=https://your-project-id.supabase.co
NEXT_PUBLIC_SUPABASE_ANON_KEY=your-anon-key-here

Go to Project Settings > API Keys

Go to Project Settings > API Keys Copy service_role key into .env.local file

# Supabase Keys (get from Supabase Project Dashboard > Project Settings > API Keys)
NEXT_PUBLIC_SUPABASE_URL=https://your-project-id.supabase.co
NEXT_PUBLIC_SUPABASE_ANON_KEY=your-anon-key-here
SUPABASE_SERVICE_ROLE_KEY=your-service-role-key-here

<Card title="Note" icon="threads" > Please keep SERVICE_ROLE_KEY private, DO NOT share with anyone. </Card> </Steps>

Step 4: Create Stripe Account

<Steps>

Go to Stripe and create a free account
Complete the account setup process
Go to Stripe Dashboard
Navigate to Developers > API Keys

Copy the Key

Copy your Publishable key and Secret key (use test keys for development) into .env.local file

# Stripe Keys
NEXT_PUBLIC_STRIPE_PUBLISHABLE_KEY=pk_test_your_publishable_key_here
STRIPE_SECRET_KEY=sk_test_your_secret_key_here

</Steps>

Step 5: Set Up Stripe Webhook Endpoint

<Tabs> <TabItem label="Local Dev"> Because of local development, stripe's webhook cannot be accessed directly, so you need to use stripe cli to listen to webhook. Open terminal and run local listener.

```bash
> stripe listen --forward-to localhost:3000/api/webhooks/stripe
A newer version of the Stripe CLI is available, please update to: v1.28.0
> Ready! You are using Stripe API Version [2022-08-01]. Your webhook signing secret is whsec_xxxxx (^C to quit)
```

You will see the webhook signing secret in the terminal. Copy **whsec_xxxxx** into **.env.local** file.

```bash collapse={2-3} ins={4}
# Get from Stripe Dashboard: https://dashboard.stripe.com/apikeys
NEXT_PUBLIC_STRIPE_PUBLISHABLE_KEY=pk_test_your_publishable_key_here
STRIPE_SECRET_KEY=sk_test_your_secret_key_here
STRIPE_WEBHOOK_SECRET=whsec_xxxxx
```

</TabItem> <TabItem label="Production"> Open Stripe Dashboard and go to Developers - Webhooks, Create a new webhook.

**API Version**: 2025.06-30.basil

**Event**: Make sure you have selected following events.

<FileTree>
  - Checkout
    - checkout.session.completed
  - Payment&Intent
    - payment_intent.succeeded
    - payment_intent.payment_failed
  - Product
    - product.created
    - product.updated
    - product.deleted
  - Price
    - price.created
    - price.updated
    - price.deleted
</FileTree>

Finish the setup steps. Open webhook url and copy Signing secret **whsec_xxxxx** into **.env.local** file.

```bash collapse={2-3} ins={4}
# Get from Stripe Dashboard: https://dashboard.stripe.com/apikeys
NEXT_PUBLIC_STRIPE_PUBLISHABLE_KEY=pk_test_your_publishable_key_here
STRIPE_SECRET_KEY=sk_test_your_secret_key_here
STRIPE_WEBHOOK_SECRET=whsec_xxxxx
```

</TabItem> </Tabs>

Step 6: Initialize Supabase

<Steps>

> npx supabase login
Hello from Supabase! Press Enter to open browser and login automatically.

Here is your login link in case browser did not open https://supabase.com/dashboard/cli/login?session_id=uuid&token_name=cli_@hostname&public_key=string

Enter your verification code: c4d28d97
Token cli_@hostname created successfully.

You are now logged in. Happy coding!

Init supabase

> npx supabase init
Generate VS Code settings for Deno? [y/N] N
Generate IntelliJ Settings for Deno? [y/N] N
Finished supabase init.

Link to your supabase project

> npx supabase link --project-ref your-project-id
Enter your database password (or leave blank to skip): // Enter your database password here
Connecting to remote database...
NOTICE (42P06): schema "supabase_migrations" already exists, skipping
Finished supabase link.
WARNING: Local config differs from linked project. Try updating supabase/config.toml
diff supabase/config.toml your-project-id
--- supabase/config.toml
+++ your-project-id
@@ -54,8 +54,8 @@

[auth]
enabled = true
-site_url = "http://127.0.0.1:3000"
-additional_redirect_urls = ["https://127.0.0.1:3000"]
+site_url = "http://localhost:3000"
+additional_redirect_urls = []
jwt_expiry = 3600
enable_refresh_token_rotation = true
refresh_token_reuse_interval = 10
@@ -96,9 +96,9 @@
[auth.email]
enable_signup = true
double_confirm_changes = true
-enable_confirmations = false
+enable_confirmations = true
secure_password_change = false
-max_frequency = "1s"
+max_frequency = "1m0s"
otp_length = 6
otp_expiry = 3600
[auth.email.template]

Apply migrations

> npx supabase db push
Connecting to remote database...
Do you want to push these migrations to the remote database?
• 20250710080949_init.sql

[Y/n] Y
NOTICE (42P06): schema "supabase_migrations" already exists, skipping
NOTICE (42P07): relation "schema_migrations" already exists, skipping
NOTICE (42701): column "statements" of relation "schema_migrations" already exists, skipping
NOTICE (42701): column "name" of relation "schema_migrations" already exists, skipping
Applying migration 20250710080949_init.sql...
NOTICE (42710): extension "uuid-ossp" already exists, skipping
Finished supabase db push.

</Steps>

Step 7: Initialize Stripe Products

Run the automated script to create products and prices in your Stripe account:

> npm run stripe:init

# You will see the following output.

> nextjs-stripe-app@0.1.0 stripe:init
> ts-node scripts/stripe-init.ts

(node:76080) ExperimentalWarning: Type Stripping is an experimental feature and might change at any time
(Use `node --trace-warnings ...` to show where the warning was created)
(node:76080) [MODULE_TYPELESS_PACKAGE_JSON] Warning: Module type of file:///Users/obiscr/projects/nextjs-stripe-supabase-starter/scripts/stripe-init.ts is not specified and it doesn't parse as CommonJS.
Reparsing as ES module because module syntax was detected. This incurs a performance overhead.
To eliminate this warning, add "type": "module" to /Users/obiscr/projects/nextjs-stripe-supabase-starter/package.json.
[dotenv@17.2.0] injecting env (7) from .env.local (tip: ⚙️  load multiple .env files with { path: ['.env.local', '.env'] })
🚀 Starting Stripe initialization...


📋 Processing product: Premium Membership
──────────────────────────────────────────────────
📦 Creating product: Premium Membership
✅ Product created: ************** - Premium Membership
💰 Creating price: Premium Monthly - $29.99
✅ Price created: ************** - Premium Monthly
💰 Creating price: Premium Yearly - $99.99
✅ Price created: ************** - Premium Yearly
💰 Creating price: Premium Lifetime - $199.99
✅ Price created: ************** - Premium Lifetime
✨ Completed Premium Membership with 3 prices

📋 Processing product: Cloud Storage
──────────────────────────────────────────────────
📦 Creating product: Cloud Storage
✅ Product created: ************** - Cloud Storage
💰 Creating price: 50GB Storage - $9.99
✅ Price created: ************** - 50GB Storage
💰 Creating price: 100GB Storage - $19.99
✅ Price created: ************** - 100GB Storage
💰 Creating price: 500GB Storage - $49.99
✅ Price created: ************** - 500GB Storage
✨ Completed Cloud Storage with 3 prices

📋 Processing product: API Access
──────────────────────────────────────────────────
📦 Creating product: API Access
✅ Product created: ************** - API Access
💰 Creating price: Basic API - $19.99
✅ Price created: ************** - Basic API
💰 Creating price: Pro API - $49.99
✅ Price created: ************** - Pro API
💰 Creating price: Enterprise API - $99.99
✅ Price created: ************** - Enterprise API
✨ Completed API Access with 3 prices

🎉 Stripe initialization completed successfully!

📊 Summary:
────────────────────────────────────────────────────────────

🏷️  Premium Membership (**************)
   💰 Premium Monthly: ************** - $29.99
   💰 Premium Yearly: ************** - $99.99
   💰 Premium Lifetime: ************** - $199.99

🏷️  Cloud Storage (**************)
   💰 50GB Storage: ************** - $9.99
   💰 100GB Storage: ************** - $19.99
   💰 500GB Storage: ************** - $49.99

🏷️  API Access (**************)
   💰 Basic API: ************** - $19.99
   💰 Pro API: ************** - $49.99
   💰 Enterprise API: ************** - $99.99

✅ You can now run your application and see the products!
🔗 Stripe Dashboard: https://dashboard.stripe.com/products

This will create all the products and prices defined in the configuration. You can check them in your Stripe Dashboard.

At this point, you can see the webhook trigger in stripe webhook dashboard.

A newer version of the Stripe CLI is available, please update to: v1.28.0
> Ready! You are using Stripe API Version [2022-08-01]. Your webhook signing secret is whsec_xxxxx (^C to quit)
2025-07-10 21:44:51   --> product.created [evt_******************]
2025-07-10 21:44:52   --> plan.created [evt_******************]
2025-07-10 21:44:52  <--  [200] POST http://localhost:3000/api/webhooks/stripe [evt_******************]
2025-07-10 21:44:52   --> price.created [evt_******************]
2025-07-10 21:44:53  <--  [200] POST http://localhost:3000/api/webhooks/stripe [evt_******************]
2025-07-10 21:44:53   --> plan.created [evt_******************]
2025-07-10 21:44:53  <--  [200] POST http://localhost:3000/api/webhooks/stripe [evt_******************]
2025-07-10 21:44:53   --> price.created [evt_******************]
2025-07-10 21:44:54  <--  [200] POST http://localhost:3000/api/webhooks/stripe [evt_******************]
2025-07-10 21:44:54   --> price.created [evt_******************]
2025-07-10 21:44:54  <--  [200] POST http://localhost:3000/api/webhooks/stripe [evt_******************]
2025-07-10 21:44:54   --> product.created [evt_******************]
2025-07-10 21:44:54  <--  [200] POST http://localhost:3000/api/webhooks/stripe [evt_******************]
2025-07-10 21:44:55  <--  [200] POST http://localhost:3000/api/webhooks/stripe [evt_******************]
2025-07-10 21:44:55   --> price.created [evt_******************]
2025-07-10 21:44:56  <--  [200] POST http://localhost:3000/api/webhooks/stripe [evt_******************]
2025-07-10 21:44:56   --> price.created [evt_******************]
2025-07-10 21:44:57   --> price.created [evt_******************]
2025-07-10 21:44:57  <--  [200] POST http://localhost:3000/api/webhooks/stripe [evt_******************]
2025-07-10 21:44:58   --> product.created [evt_******************]
2025-07-10 21:44:58  <--  [200] POST http://localhost:3000/api/webhooks/stripe [evt_******************]
2025-07-10 21:44:58  <--  [200] POST http://localhost:3000/api/webhooks/stripe [evt_******************]
2025-07-10 21:44:58   --> price.created [evt_******************]
2025-07-10 21:44:59   --> price.created [evt_******************]
2025-07-10 21:44:59  <--  [200] POST http://localhost:3000/api/webhooks/stripe [evt_******************]
2025-07-10 21:45:00   --> price.created [evt_******************]
2025-07-10 21:45:00  <--  [200] POST http://localhost:3000/api/webhooks/stripe [evt_******************]
2025-07-10 21:45:01  <--  [200] POST http://localhost:3000/api/webhooks/stripe [evt_******************]

If everything goes well, you will see the product and product item data in supabase.

Step 8: Generate data types

> npm run supabase:gen-types

> nextjs-stripe-app@0.1.0 supabase:gen-types
> supabase gen types typescript --linked > lib/database.types.ts

Step 9: Start the Development Server

npm run dev

Open http://localhost:3000 in your browser.

Finish the complete purchase flow

<Steps>

Register a new user
- Click "Login" button,
- switch to "Register" tab
- Create a new account with email and password
Browse products
- View the 3 product categories
- Each product has multiple pricing tiers
Make a test purchase
- Click "Buy Now" on any product
- You'll be redirected to Stripe Checkout
- Use test card number: 4242 4242 4242 4242
- Use any future expiry date and CVC
- Complete the payment
Payment successful
- You'll be redirected to success page
Verify purchase
- Return to homepage
- The purchased item should show "Purchased" status
</Steps>

Summary

This is a simple example of how to use Stripe with Supabase. You can use this as a starting point for your own project.

You can find the source code at:

Obfuscating Your Plugins with ProGuard

import { Aside } from '@astrojs/starlight/components';

The plugin obfuscation has been officially described in great detail, see: obfuscate the plugin

So without further ado, this post will be a step-by-step demonstration of obfuscating your plugin with ProGuard, starting with a real-world example.

To see the comparison file, the key code of ProGuard obfuscation is added to this commit, all the code for this post in this repository

Added ProGuard

In build.gradle.kts, add the buildscript node to import the proguard dependency

buildscript {
    repositories {
        maven {
            setUrl("https://maven.aliyun.com/repository/public/")
            setUrl("https://maven.aliyun.com/nexus/content/groups/public/")
            setUrl("https://plugins.gradle.org/m2/")
            setUrl("https://oss.sonatype.org/content/repositories/snapshots/")
        }
        mavenCentral()
        gradlePluginPortal()
    }

    dependencies {
        classpath("com.guardsquare:proguard-gradle:7.3.2")
    }
}

Configuring ProGuard

    // Register a new task, task name is "proguard"
    register<proguard.gradle.ProGuardTask>("proguard") {
        dependsOn(instrumentedJar)
        verbose()

        val javaHome = System.getProperty("java.home")
        File("$javaHome/jmods/").listFiles()!!.forEach { libraryjars(it.absolutePath)}

        // Use the jar task output as a input jar. This will automatically add the necessary task dependency.
        injars("build/libs/instrumented-${properties("pluginName")}-${properties("pluginVersion")}.jar")
        outjars("build/obfuscated/output/instrumented-${properties("pluginName")}-${properties("pluginVersion")}.jar")


        libraryjars(configurations.compileClasspath.get())

        dontshrink()
        dontoptimize()

        adaptclassstrings("**.xml")
        adaptresourcefilecontents("**.xml")

        // Allow methods with the same signature, except for the return type,
        // to get the same obfuscation name.
        overloadaggressively()

        // Put all obfuscated classes into the nameless root package.
        repackageclasses("")
        dontwarn()

        printmapping("build/obfuscated/output/${properties("pluginName")}-${properties("pluginVersion")}-ProGuard-ChangeLog.txt")

        target(properties("pluginVersion"))

        adaptresourcefilenames()
        optimizationpasses(9)
        allowaccessmodification()

        keepattributes("Exceptions,InnerClasses,Signature,Deprecated,SourceFile,LineNumberTable,*Annotation*,EnclosingMethod")

        keep("""
            class * implements com.intellij.openapi.components.PersistentStateComponent {*;}
             """.trimIndent()
        )

        keepclassmembers("""
            class * {public static ** INSTANCE;}
             """.trimIndent()
        )
        keep("class com.intellij.util.* {*;}")
    }


    prepareSandbox {
        if (properties("enableProGuard").toBoolean()) {
            dependsOn("proguard")
            pluginJar.set(File("build/obfuscated/output/instrumented-${properties("pluginName")}-${properties("pluginVersion")}.jar"))
        }
    }

<Aside type="note" title="Note"> These are the syntax of ProGuard, for more rules see: Official ProGuard Documentation, we focus on the last keep and keepclassmembers. </Aside>

Build test

After the configuration is complete, run the plugin and the debug message is as follows:

21:40:12: Executing 'runIde'...

Starting Gradle Daemon...
Connected to the target VM, address: '127.0.0.1:12563', transport: 'socket'
Gradle Daemon started in 915 ms
> Task :initializeIntelliJPlugin
> Task :patchPluginXml UP-TO-DATE

> Task :verifyPluginConfiguration
[gradle-intellij-plugin :verifyPluginConfiguration] The following plugin configuration issues were found:
- The Java configuration specifies sourceCompatibility=11 but IntelliJ Platform 2022.3.3 requires sourceCompatibility=17.
See: https://jb.gg/intellij-platform-versions

> Task :compileKotlin NO-SOURCE
> Task :compileJava UP-TO-DATE
> Task :processResources UP-TO-DATE
> Task :classes UP-TO-DATE
> Task :setupInstrumentCode
> Task :instrumentCode UP-TO-DATE
> Task :jar UP-TO-DATE
> Task :inspectClassesForKotlinIC UP-TO-DATE
> Task :instrumentedJar UP-TO-DATE
> Task :proguard <=== proguard task 已经成功执行。
> Task :prepareSandbox
Disconnected from the target VM, address: '127.0.0.1:12563', transport: 'socket'
Connected to the target VM, address: 'localhost:12616', transport: 'socket'

Obfuscated results

After obfuscated:

On the left side, file names have been obfuscated, and on the right side, file class names, method names, and variable names have been obfuscated.

<Aside type="note" title="Note"> This is just a very basic obfuscation effect, if you need more complex. You can refer to the ProGuard official documentation mentioned above. </Aside>

Special circumstances

In IntelliJ plugin projects, there are some files that are not to be obfuscated. Two cases are listed in this demo.

Called via reflection

One of the files in the project is MyDefaultFileType.java. This file adds a new file type, let's call it a J-file, with a *.j or *.J file extension.

This file has already been registered in plugin.xml

<extensions defaultExtensionNs="com.intellij">
    ...
    <fileType name="MyNativeFile" implementationClass="com.obiscr.template.MyDefaultFileType" fieldName="INSTANCE"
              extensions="j;J" order="first"/>
    ...
</extensions>

The key point here is a fieldName attribute: INSTANCE, which corresponds to INSTANCE in MyDefaultFileType.java. In other words, they have to be the same. Otherwise the property will not be found when the call is reflected off.

For example, once we've removed the proguard task's

    register<proguard.gradle.ProGuardTask>("proguard") {
        ...

        // keepclassmembers("""
        //     class * {public static ** INSTANCE;}
        //      """.trimIndent()
        // )
        ...
    }

Run the plugin and you get an error:

2023-09-24 21:31:18,647 [   3018]   WARN - #c.i.e.RunManager - Must be not called before project components initialized
Info  | RdCoroutineScope          | 53:DefaultDispatcher-worker-35 | RdCoroutineHost overridden
2023-09-24 21:31:21,580 [   5951] SEVERE - #c.i.o.f.i.FileTypeManagerImpl - INSTANCE
java.lang.NoSuchFieldException: INSTANCE
    at java.base/java.lang.Class.getDeclaredField(Class.java:2610)
    at com.intellij.openapi.fileTypes.impl.FileTypeManagerImpl.instantiateFileTypeBean(FileTypeManagerImpl.java:492)
    at com.intellij.openapi.fileTypes.impl.FileTypeManagerImpl.mergeOrInstantiateFileTypeBean(FileTypeManagerImpl.java:463)

It shows that the INSTANCE attribute could not be found. So for this case, you can use proguard's keepclassmembers to keep the INSTANCE attribute from being obfuscated in all classes. Of course, you can also keep INSTANCE from being obfuscated in all classes that implements INativeFileType if you want. This is a more precise control.

You may ask, since this problem can be avoided by keeping the fieldName in plugin.xml the same as INSTANCE in MyDefaultFileType.java, wouldn't it be possible to avoid this problem by changing it to the same value?

Yes, this is true in principle. However, the obfuscation generates a random variable name each time. That is, the attribute fieldName must have been specified as a certain exact value first, and then the packaging started, and in the class file after packaging, the INSTANCE is not necessarily the value specified above. Therefore, we still need to exclude INSTANCE from the obfuscation rules to avoid this problem.

Local data storage

In many cases, there is a need to store some data locally, such as settings data, environment data, etc. In this case, you need to use @State to specify a file to store the data. In this case, you need to use @State to specify the storage file. For example, the

package com.obiscr.template;

import com.intellij.openapi.components.*;
import com.intellij.openapi.project.Project;
import com.intellij.util.xmlb.XmlSerializerUtil;
import org.jetbrains.annotations.NotNull;
import org.jetbrains.annotations.Nullable;

@State( name = "com.obiscr.template.MyState", storages = @Storage("my-state/state.xml"))
public class MyState implements PersistentStateComponent<MyState> {
    public String currentVersion = "";
    public Boolean enableFeature = true;
    public String myCustomKey = "";

    public static MyState getInstance(@NotNull Project project) {
        return project.getService(MyState.class);
    }

    @Nullable
    @Override
    public MyState getState() {
        return this;
    }

    @Override
    public void loadState(@NotNull MyState state) {
        XmlSerializerUtil.copyBean(state, this);
    }

}

Here a storage file and some properties are defined, it will and a new state.xml file is created in the my-state directory of the project's .idea directory, with the following contents

<?xml version="1.0" encoding="UTF-8"?>
<project version="4">
  <component name="com.obiscr.template.MyState">
    <option name="currentVersion" value="v1.0.1" />
    <option name="enableFeature" value="false" />
    <option name="myCustomKey" value="value" />
  </component>
</project>

In the same way, the name attribute in option here corresponds to the three attributes in MyState.java. These attributes should not be obfuscated; if they are, the original data will not be read. For example, if you set:

currentVersion： v1.0.1
enableFeature：false
myCustomKey：value

After obfuscation, assume the following properties in MyState.java:

currentVersion -> a
enableFeature -> d
myCustomKey -> c

The data in state.xml cannot be read at this point. Because there is no option name is: a, d, c data, so the final value read out is the default value defined in MyState.java, once this value has changed, will be in the xml again to add a new attribute. name is the variable name after the obfuscation.

Now the currentVersion has been obfuscated to a, so if the value of currentVersion changes, change it to v1.0.2, then state.xml will look like this

<?xml version="1.0" encoding="UTF-8"?>
<project version="4">
  <component name="com.obiscr.template.MyState">
    <option name="currentVersion" value="v1.0.1" />
    <option name="enableFeature" value="false" />
    <option name="myCustomKey" value="value" />
    <!-- Added -->
    <option name="a" value="v1.0.2" />
  </component>
</project>

A <option name="a" value="v1.0.2" /> will be added. So as long as the variable name is not the same after obfuscation, it will keep adding. So here's a way to fix it:

    register<proguard.gradle.ProGuardTask>("proguard") {
        ...

        keep("""
            class * implements com.intellij.openapi.components.PersistentStateComponent {*;}
             """.trimIndent()
        )
        ...
    }

This rule ignores all classes that implement PersistentStateComponent.

Summaries

This article briefly describes how to use ProGuard and obfuscate the IntlliJ plugin and integrate it into a gradle task.

Actually, I prefer to call it a framework. The specific obfuscation rules will need to be customised for your own project. I hope it can help you.

Disclaimer

This is just a demo project for research and study, please use it in your project at your own discretion.

I will not be responsible for any kind of damage caused by using this obfuscation scheme.

Useful Links

关于OpenAI封号的测试结果

import { Aside } from '@astrojs/starlight/components';

先说结论

我的账号没有一个被封的。

基本条件

一共准备了 24 个账号（21个老帐号，3个新账号）。全部都是使用邮箱注册的。首先保证网络能够正常访问，这个不必多言。

为了测试结果尽可能准确，我使用了多个邮箱后缀的。在这批账号里面，至少有8种邮箱域名。

有些账号是只用过API Key，没用过网页版ChatGPT。有些账号两者都有。

<Aside type="tip" title="提示"> 下面数据做了脱敏处理。使用额度是3月29号的时候通过API自动刷新的，这个无伤大雅。 </Aside>

账号	使用额度
q*******@b*.com	17.3866
t*******@j*.com	16.89172
l*******@z*.com	16.8178
f*******@e*.com	16.6888
x*******@d*.com	16.68422
v*******@s*.com	16.63994
a*******@f*.com	16.52996
4*******@e*.com	16.5265
p*******@e*.com	16.49332
-@c**.com	16.30722
w*******@d*.com	16.29588
a*******@d*.com	16.0017
s*******@f*.com	15.82358
-@b**.com	10.73738
b*******@s*.com	7.83864
t*******@v*.com	7.42252
s*******@d*.com	7.29326
v*******@d*.com	7.17466
v*******@h*.com	7.17252
9*******@n*.com	7.17116
2*******@a*.com	7.0543
y*******@p*.com	0
1*******@b*.com	0
p*******@f*.com	0

开始测试

第一轮：登录测试，全部通过。

第二轮：全部使用中文问答。（数据太多，只有部分截图）

其中，在登录了几个账号以后，出现了Cloudflare的验证。

中途出现过一次不可用。

总结

很抱歉一次都没有出现封号。在现在流传的一些封号原因里面：

（1）使用中文：个人感觉应该不会。

（2）OpenAI政策：还有一种原因，问的问题违反了OpenAI的相关政策。这也很有可能导致封号。OpenAI有专门的审核机制，具体见：moderation

（3）关于购买的账号被封，我有一个很大胆的想法：你购买的账号可能根本不是你一人在使用。除非你自己修改过密码，能排除这个因素。

（4）使用第三方服务。这个我之前在群里说过。应用户要求，我的插件最近也支持了第三方配置。还附加了安全性说明。使用第三方的一定要确保安全性。比如你填写的key，有没有被服务商收集。做成一个公共的Key的池子。被它所服务的其他用户使用。事实上，你无从得知。从技术的角度来讲，这非常容易实现。毫无难度。

顺便提一下如果用自己的Key使用第三方服务，请特别注意这一点。

（5）邮箱权重：我使用的这些账号，邮箱域名基本上是像验证码一样的，毫无规则可言。上面仅仅只测试了一小部分。我还有很多新账号也是如此。邮箱域名就像验证码。可以说权重非常非常低。但是也没有被封。因此对于这点，个人感觉应该不会。

（6）IP问题：这个我没办法测试。但是可能性非常大。IP滥用，DNS污染都有可能导致这个问题。

（7）不要把自己的账号分享给别人。找人代充Plus一定要找信得过的。

（8）其他...

当然不排除另外一种情况，封号并不是实时的。有可能（而且可能性很大）是通过延时任务来处理。所以现在测试正常，指不定明天就封了。这也是一种可能。

另外关于这次测试，也有不准确的地方，因为一些条件限制，我无法模拟对应的环境。有什么地方说错，还请提出批评。谢谢！

这些账号，我后面应该会跟进，看会不会被封。不过不保证（手动狗头），太忙了。实在腾不出时间。

最后

ChatGPT 随机说了一句话，我感觉挺不错的，就顺便贴上来，与诸君共勉。（虽然可能原作者不是它，但相遇即是缘）

<Aside type="note" title="AI的话语"> 在这个充满挑战和机遇的世界，我们每个人都有着自己的故事和人生轨迹。无论是成功的喜悦，还是失败的痛苦，每一个经历都值得我们好好铭记和反思。生命如同一条漫长的河流，我们需要学会适应各种风浪和流程，才能不断前行。当我们遇到困难时，不要轻易放弃，要勇敢面对并寻求解决方案。同时，也要珍惜每一个值得感恩的人和时刻，保持乐观的态度和积极的心态，才能在人生的旅途中走得更加坚定和美好。 </Aside>

ResoLine App - Your professional screen resolution assistant tool

import { LinkCard } from '@astrojs/starlight/components';

ResoLine is a professional screen resolution assistant tool to help you visually preview and compare the actual display of different resolutions on your screen.

Install Resoline

Features

Localization

Simplified Chinese and English are currently supported.

Customize the look

You can customize:

For lines: line type / color / thickness.
For preview text: font color / background color / transparency.

Custom resolutions

The system already has some common resolutions built in, you can also add custom resolutions as needed.

How to design an efficient sign-in system

import { Aside } from '@astrojs/starlight/components';

Suppose there is a monthly check-in activity now, and you want to record the monthly check-in data of users. If it was you, how would you design this feature?

In Java, a variable of type int occupies 4 bytes of space, and a byte has 8 bits (bit).

In other words, a variable of type int will take up 32b(it) of space. The value range of int: -2<sup>31</sup> ~ 2<sup>31</sup>-1 (-2147483648~2147483647)

The maximum number of months in each month is 31 days. In February, basically <sup>[1]</sup>28 days in normal years and 29 days in leap years. They are all less than 32 (the 32 bits mentioned above).

<Aside type="tip" title="Tip"> [1] There have been monthly fluctuations in history </Aside>

Getting Started

Think about it, is it possible to use each bit of an int to store the check-in status of a certain day?

As shown in the figure below, assuming that there is a number 0 below, after converting it into binary, there are 32 0s, from the lowest digit to the highest digit, each number represents the check-in situation of a certain day:

 31th      26th      21th      16th      11th      6th      First
  ^         ^         ^         ^         ^         ^         ^
  |         |         |         |         |         |         |
0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 = 0

E.g:

There is such an int number: 13030250, which is converted to binary as follows:

13030250（decimal）= 00000000 00110010 01101010 01101010（binary）

First of all, let's set the rules, binary numbers, if a digit is <b>0</b>, it means that it has not checked in, and if it is <b>1</b>, it means that it has already checked in.

Combined with the converted binary numbers above (the signed-in data has been bolded). It can be seen that the 2nd, 4th, 6th, 7th, 10th, 12th, 14th, 15th, 18th, 21st, and 22nd days have already signed in (because the numbers in these digits are all 1), and the remaining days have not signed in .

When signing in, just change the number in the corresponding position to 1. To put it in layman's terms, if you sign in on the first day, change the number in the first position to 1, and if you sign in on the nth day, change the number in the nth position to 1.

After the above demonstration, it can be seen that this design is completely feasible.

Coding

Sign-in process

Before you start writing, you need to know the basic logic of bit operations. This is not complicated, so let's not talk about it. Let's talk about what is used in the project.

Let's run the logic manually:

Suppose there is a variable value of 3351, ie: int value = 3351;

Convert it to binary: 3351<sub>(decimal)</sub> = 00000000 00000000 00000111 00010111<sub>(binary)</sub>

Then let's take a look. The data of 00000000 00000000 00000111 00010111 indicates that the 1st, 2nd, 3rd, 5th, 9th, 10th, 11th day of this month has signed in. The rest of the day was unsigned.

Then again, we want to make <sup>[2]</sup> sign-in on the fourth day, which is equivalent to a supplementary sign. How should we change it?

<Aside type="tip" title="Tip"> [2] It can be seen from this data that it is at least the 11th of a certain month, because the 11th day has already been signed. Check-in can only be done on the same day or on a day that has already passed, and cannot be signed in to a future day on that day. </Aside>

First of all, we already know the requirements, that is, the fourth day to sign in, so that is, to operate the fourth bit of this binary data, see the following example: in order to facilitate the demonstration, the high bits of 0 are discarded

 00000000 00000000 00000111 00010111 ---------------------------> 111 00011011

 ========================================= PART 1 ============================================
       lowest bit
           ^
           |
 11100010111 >> (4-1) = 11100010    # Let the nth digit itself be shifted right (>>) n-1 bits
                      ^ 00000001    # XOR(^) 1 let its lowest bit (which is the fourth bit we want) change to 1
                      ----------
                        11100011    # Finally, lowest bit has chhanged to 1, Changing to 1 also means signing in

 ========================================= PART 2 ============================================
 11100011000 = (4-1) << 11100011    # Right to leat, Because the lower 3 bits were discarded above in order to handle the 4th digit, and are now to be restored, the left shift
|11100010111                        # an OR operation on this number after the left shift is complete
------------
 11100011111(result)                # We got the final result

 ========================================= PART 3 ============================================
 compare it：
 11100010111（initinal）
 11100011111（result）
 ------------------
        ^
        |
 4th, from 0 to 1, means un sign-in to signed-in

Four kinds of operations are used above, and the operation rules are explained below:

Shift left: Shift a few bits to the left, just add a few 0s at the end of the number
Shift right: shift a few bits to the right and discard the lowest bits
XOR operation: same as 0, different as 1
Logical OR: As long as one is 1, it is 1

Convert above process to code:

void sign(int day_of_month)
{
    int tmp = value;
    value = ((signStorage >> (day_of_month-1)) ^ 1) << (day_of_month-1) | tmp;
}

Check sign-in

The sign-in has been mentioned above. Now let's talk about how to check whether there is a sign-in on a certain day.

In fact, the check-in process is very similar to the check-in process, but the latter step is different.

In a nutshell, the sign-in process is:

graph LR
A[First move right to get the number of digits of the day you want to operate] -->B[Change the number 0 representing that day to 1]
    B --> C[left shift and OR operation restore the original data]

And the check-in process is

graph LR
A[First move right to get the number of digits of the day you want to operate] -->B{Determine whether the number of that day is 0 or 1}
    B --> |number=0| C[no sign-in]
    B --> |Number=1| D[Sign in]

Let's walk through the process in detail: Let's take the results calculated above as an example. The above calculation is: 11100011111. Now to judge whether there is a check-in on the third day, then:

 11100011111 >> (3-1) = 111000111 # For the 3rd day, shift right by (3-1) bits
                      & 000000001 # then &1
                      -------------
                        000000001 == 1 # If the result is equal to 1, it means that there is a check-in on the third day

Two kinds of operations are used above, and the operation rules are explained below (repetitions will not be explained):

Logical AND: The result is 1 only if both numbers are 1

Let's take another example to determine whether there is a check-in on the 7th day:

 11100011111 >> (7-1) = 11100           # 求第7天，则右移(7-1)位
                      & 00001           # 然后&1
                  -----------
                        00000 == 0      # 结果等于0 则说明第7天没有签到

Let's convert the above process into code:

int checkSign(int day_of_month)
{
    if (day_of_month <=0)
        day_of_month = get_cur_day();
    return (signStorage >> (day_of_month-1)) & 1;
}

Full code

C

#include <stdio.h>
#include <time.h>

int sign(int day_of_month);

int checkSign(int day_of_month);

int get_cur_day();

void dec2bin(int n);

int signStorage = 0;

int main()
{
    printf("BEFORE sign-in:\n");
    dec2bin(signStorage);
    for(int i = 1; i<=32 ;i++){
        sign(i);
    }

    printf("AFTER sign-in:\n");
    dec2bin(signStorage);

    printf("\nCHECK sign-in:\n");
    for(int i = 1; i<=32 ;i++){
        printf("Day %d sign-in: %d\n",i, checkSign(i));
    }

    return 0;
}


int sign(int day_of_month)
{
    int tmp = signStorage;
    if (day_of_month <=0)
        day_of_month = get_cur_day();
    else
        signStorage = ((signStorage >> (day_of_month-1)) ^ 1) << (day_of_month-1) | tmp;
    return 1;

}

int checkSign(int day_of_month)
{
    if (day_of_month <=0)
        day_of_month = get_cur_day();
    return (signStorage >> (day_of_month-1)) & 1;
}


int get_cur_day()
{
    time_t time_p;
    struct tm *p;
    time (&time_p);
    p=gmtime(&time_p);
    return p->tm_mday;
}

void dec2bin(int n){
    int c, k;
    for (c = 31; c >= 0; c--)
      {
        k = n >> c;

        if (k & 1)
          printf("1");
        else
          printf("0");
      }
      printf("\n");
}

Java

import java.util.Calendar;

public class SignDay {

    public static int signStorage = 0;

    public static void main(String[] args) {
        System.out.println("BEFORE sign-in:");
        System.out.println(Integer.toBinaryString(signStorage));
        for(int i = 1; i<=32 ;i++){
            sign(i);
        }
        System.out.println("\AFTER sign-in:");
        System.out.println(Integer.toBinaryString(signStorage));

        System.out.println("\nCHECK sign-in:");
        for(int i = 1; i<=32 ;i++){
            boolean signed = checkSign(i);
            if (signed) {
                System.out.println("Day " + i + " sign-in: " + signed);
            } else {
                System.err.println("Day " + i + " sign-in: " + signed);
            }
        }
    }


    public static boolean sign(int dayOfMonth){
        int tmp = signStorage;
        if (dayOfMonth <=0){
            dayOfMonth = Calendar.getInstance().get(Calendar.DAY_OF_MONTH);
        }
        if (dayOfMonth % 4 !=0){
            signStorage = ((signStorage >> (dayOfMonth-1)) ^ 1) << (dayOfMonth-1) | tmp;
        }
        // do other actions
        return false;
    }

    public static boolean checkSign(int dayOfMonth) {
        if (dayOfMonth <=0){
            dayOfMonth = Calendar.getInstance().get(Calendar.DAY_OF_MONTH);
        }
        return ((signStorage >> (dayOfMonth-1)) & 1) == 1;
    }

}

SmartKnob Firmware

import { Aside } from '@astrojs/starlight/components';

Getting Started

Install VS Code
Download Code

Open the smartknob/firmware directory with VS Code. (Just open the firmware directory, not the whole smartknob directory)

Install VS Code Extensions

Better C++ Syntax
C/C++
C/C++ Extension Pack
C/C++ Themes
CMake
CMake Tools
Code Runner
Doxygen Documentation Generator
PlatformIO IDE
XML Tools

<Aside type="note"> [1] The PlatformIO IDE plugin is easy to install. It takes a little bit longer to install. Once installed, restart VS Code and make sure PIO Home is displayed properly. As shown in the picture below </Aside>

Flush Firmware

If everything is OK. You can see the following three icons in the toolbar under VS Code.

From left to right: Compile, Write, Serial Monitor.

Compile

Click Position 1 to start compile with following output：

 *  正在执行任务: C:\Users\piercebrands\.platformio\penv\Scripts\platformio.exe run

Processing view (board: esp32doit-devkit-v1; platform: espressif32@3.4; framework: arduino)
-------------------------------------------------------------------------------------------------------------------------------------------
Tool Manager: Installing platformio/toolchain-xtensa32 @ ~2.50200.0
Downloading  [####################################]  100%
Unpacking  [####################################]  100%
Tool Manager: toolchain-xtensa32@2.50200.97 has been installed!
Tool Manager: Installing platformio/framework-arduinoespressif32 @ ~3.10006.0
Downloading  [####################################]  100%
Unpacking  [####################################]  100%
Tool Manager: framework-arduinoespressif32@3.10006.210326 has been installed!
Tool Manager: Installing platformio/tool-esptoolpy @ ~1.30100.0
Downloading  [####################################]  100%
Unpacking  [####################################]  100%
Tool Manager: tool-esptoolpy@1.30100.210531 has been installed!
Library Manager: Installing askuric/Simple FOC @ 2.2.0
Downloading  [####################################]  100%
Unpacking  [####################################]  100%
Library Manager: Simple FOC@2.2.0 has been installed!
Library Manager: Installing infineon/TLV493D-Magnetic-Sensor @ 1.0.3
Downloading  [####################################]  100%
Unpacking  [####################################]  100%
Library Manager: TLV493D-Magnetic-Sensor@1.0.3 has been installed!
Library Manager: Installing bxparks/AceButton @ 1.9.1
Downloading  [####################################]  100%
Unpacking  [####################################]  100%
Library Manager: AceButton@1.9.1 has been installed!
Library Manager: Installing bodmer/TFT_eSPI @ 2.4.25
Downloading  [####################################]  100%
Unpacking  [####################################]  100%
Library Manager: TFT_eSPI@2.4.25 has been installed!
Library Manager: Installing fastled/FastLED @ 3.5.0
Downloading  [####################################]  100%
Unpacking  [####################################]  100%
Library Manager: FastLED@3.5.0 has been installed!
Library Manager: Installing bogde/HX711 @ 0.7.5
Downloading  [####################################]  100%
Unpacking  [####################################]  100%
Library Manager: HX711@0.7.5 has been installed!
Library Manager: Installing adafruit/Adafruit VEML7700 Library @ 1.1.1
Downloading  [####################################]  100%
Unpacking  [####################################]  100%
Library Manager: Adafruit VEML7700 Library@1.1.1 has been installed!
Library Manager: Resolving dependencies...
Library Manager: Installing Adafruit BusIO
Downloading  [####################################]  100%
Unpacking  [####################################]  100%
Library Manager: Adafruit BusIO@1.13.2 has been installed!
Tool Manager: Installing platformio/tool-scons @ ~4.40400.0
Downloading  [####################################]  100%
Unpacking  [####################################]  100%
Tool Manager: tool-scons@4.40400.0 has been installed!
Verbose mode can be enabled via `-v, --verbose` option
CONFIGURATION: https://docs.platformio.org/page/boards/espressif32/esp32doit-devkit-v1.html
PLATFORM: Espressif 32 (3.4.0) > DOIT ESP32 DEVKIT V1
HARDWARE: ESP32 240MHz, 320KB RAM, 4MB Flash
DEBUG: Current (esp-prog) External (esp-prog, iot-bus-jtag, jlink, minimodule, olimex-arm-usb-ocd, olimex-arm-usb-ocd-h, olimex-arm-usb-tiny-h, olimex-jtag-tiny, tumpa)
PACKAGES:
 - framework-arduinoespressif32 @ 3.10006.210326 (1.0.6)
 - tool-esptoolpy @ 1.30100.210531 (3.1.0)
 - toolchain-xtensa32 @ 2.50200.97 (5.2.0)
LDF: Library Dependency Finder -> https://bit.ly/configure-pio-ldf
LDF Modes: Finder ~ chain, Compatibility ~ soft
Found 37 compatible libraries
Scanning dependencies...
Dependency Graph
|-- Simple FOC @ 2.2.0
|   |-- Wire @ 1.0.1
|   |-- SPI @ 1.0
|-- TLV493D-Magnetic-Sensor @ 1.0.3
|   |-- Wire @ 1.0.1
|-- AceButton @ 1.9.1
|-- TFT_eSPI @ 2.4.25
|   |-- SPI @ 1.0
|   |-- SPIFFS @ 1.0
|   |   |-- FS @ 1.0
|   |-- FS @ 1.0
|-- FastLED @ 3.5.0
|   |-- SPI @ 1.0
|-- HX711 @ 0.7.5
|-- Adafruit VEML7700 Library @ 1.1.1
|   |-- Adafruit BusIO @ 1.13.2
|   |   |-- Wire @ 1.0.1
|   |   |-- SPI @ 1.0
|   |-- Wire @ 1.0.1
|   |-- SPI @ 1.0
Building in release mode
Compiling .pio\build\view\libcd9\FastLED\FastLED.cpp.o
Compiling .pio\build\view\libcd9\FastLED\bitswap.cpp.o
Compiling .pio\build\view\libcd9\FastLED\colorpalettes.cpp.o
Compiling .pio\build\view\libcd9\FastLED\colorutils.cpp.o
Compiling .pio\build\view\libcd9\FastLED\hsv2rgb.cpp.o
Compiling .pio\build\view\libcd9\FastLED\lib8tion.cpp.o
Compiling .pio\build\view\libcd9\FastLED\noise.cpp.o
Compiling .pio\build\view\libcd9\FastLED\platforms.cpp.o
Compiling .pio\build\view\libcd9\FastLED\platforms\esp\32\clockless_rmt_esp32.cpp.o
Compiling .pio\build\view\libcd9\FastLED\power_mgt.cpp.o
Compiling .pio\build\view\libcd9\FastLED\wiring.cpp.o
Compiling .pio\build\view\src\display_task.cpp.o
Compiling .pio\build\view\src\interface_task.cpp.o
Compiling .pio\build\view\src\main.cpp.o
Compiling .pio\build\view\src\motor_task.cpp.o
Compiling .pio\build\view\src\mt6701_sensor.cpp.o
Compiling .pio\build\view\src\tlv_sensor.cpp.o
Generating partitions .pio\build\view\partitions.bin
Compiling .pio\build\view\libb39\Wire\Wire.cpp.o
Compiling .pio\build\view\lib8f9\SPI\SPI.cpp.o
Compiling .pio\build\view\lib44f\Simple FOC\BLDCMotor.cpp.o
Compiling .pio\build\view\lib44f\Simple FOC\StepperMotor.cpp.o
Compiling .pio\build\view\lib44f\Simple FOC\common\base_classes\CurrentSense.cpp.o
Compiling .pio\build\view\lib44f\Simple FOC\common\base_classes\FOCMotor.cpp.o
Compiling .pio\build\view\lib44f\Simple FOC\common\base_classes\Sensor.cpp.o
Compiling .pio\build\view\lib44f\Simple FOC\common\foc_utils.cpp.o
Archiving .pio\build\view\lib8f9\libSPI.a
Indexing .pio\build\view\lib8f9\libSPI.a
Compiling .pio\build\view\lib44f\Simple FOC\common\lowpass_filter.cpp.o
.pio/libdeps/view/Simple FOC/src/common/foc_utils.cpp: In function 'float _sqrtApprox(float)':
.pio/libdeps/view/Simple FOC/src/common/foc_utils.cpp:68:21: warning: dereferencing type-punned pointer will break strict-aliasing rules [-Wstrict-aliasing]
   i = * ( long * ) &y;
                     ^
.pio/libdeps/view/Simple FOC/src/common/foc_utils.cpp:70:22: warning: dereferencing type-punned pointer will break strict-aliasing rules [-Wstrict-aliasing]
   y = * ( float * ) &i;
                      ^
src/motor_task.cpp: In member function 'void MotorTask::run()':
src/motor_task.cpp:280:37: warning: ISO C++ forbids converting a string constant to 'char*' [-Wwrite-strings]
     command.add('M', &doMotor, "foo");
                                     ^
src/motor_task.cpp:296:14: warning: unused variable 'last_debug' [-Wunused-variable]
     uint32_t last_debug = 0;
              ^
src/mt6701_sensor.cpp: In member function 'virtual float MT6701Sensor::getSensorAngle()':
src/mt6701_sensor.cpp:94:15: warning: unused variable 'field_status' [-Wunused-variable]
       uint8_t field_status = (spi_32 >> 6) & 0x3;
               ^
src/mt6701_sensor.cpp:95:15: warning: unused variable 'push_status' [-Wunused-variable]
       uint8_t push_status = (spi_32 >> 8) & 0x1;
               ^
src/mt6701_sensor.cpp:96:15: warning: unused variable 'loss_status' [-Wunused-variable]
       uint8_t loss_status = (spi_32 >> 9) & 0x1;
               ^
.pio/libdeps/view/FastLED/src/platforms/esp/32/clockless_rmt_esp32.cpp: In static member function 'static void ESP32RMTController::init(gpio_num_t)':
.pio/libdeps/view/FastLED/src/platforms/esp/32/clockless_rmt_esp32.cpp:111:15: warning: variable 'espErr' set but not used [-Wunused-but-set-variable]
     esp_err_t espErr = ESP_OK;
               ^
.pio/libdeps/view/FastLED/src/platforms/esp/32/clockless_rmt_esp32.cpp: In member function 'void ESP32RMTController::startOnChannel(int)':
.pio/libdeps/view/FastLED/src/platforms/esp/32/clockless_rmt_esp32.cpp:239:15: warning: variable 'espErr' set but not used [-Wunused-but-set-variable]
     esp_err_t espErr = ESP_OK;
               ^
Compiling .pio\build\view\lib44f\Simple FOC\common\pid.cpp.o
Compiling .pio\build\view\lib44f\Simple FOC\common\time_utils.cpp.o
Compiling .pio\build\view\lib44f\Simple FOC\communication\Commander.cpp.o
Compiling .pio\build\view\lib44f\Simple FOC\communication\StepDirListener.cpp.o
Archiving .pio\build\view\libb39\libWire.a
In file included from .pio/libdeps/view/FastLED/src/FastLED.h:67:0,
                 from src/interface_task.cpp:4:
.pio/libdeps/view/FastLED/src/fastspi.h:145:23: note: #pragma message: No hardware SPI pins defined.  All SPI access will default to bitbanged output
 #      pragma message "No hardware SPI pins defined.  All SPI access will default to bitbanged output"
Compiling .pio\build\view\lib44f\Simple FOC\current_sense\InlineCurrentSense.cpp.o
                       ^
Compiling .pio\build\view\lib44f\Simple FOC\current_sense\LowsideCurrentSense.cpp.o
Compiling .pio\build\view\lib44f\Simple FOC\current_sense\hardware_specific\atmega_mcu.cpp.o
Indexing .pio\build\view\libb39\libWire.a
Compiling .pio\build\view\lib44f\Simple FOC\current_sense\hardware_specific\due_mcu.cpp.o
Compiling .pio\build\view\lib44f\Simple FOC\current_sense\hardware_specific\esp32_adc_driver.cpp.o
Compiling .pio\build\view\lib44f\Simple FOC\current_sense\hardware_specific\esp32_mcu.cpp.o
Compiling .pio\build\view\lib44f\Simple FOC\current_sense\hardware_specific\generic_mcu.cpp.o
Compiling .pio\build\view\lib44f\Simple FOC\current_sense\hardware_specific\samd21_mcu.cpp.o
Compiling .pio\build\view\lib44f\Simple FOC\current_sense\hardware_specific\samd_mcu.cpp.o
Compiling .pio\build\view\lib44f\Simple FOC\current_sense\hardware_specific\stm32_mcu.cpp.o
Compiling .pio\build\view\lib44f\Simple FOC\current_sense\hardware_specific\stm32g4_hal.cpp.o
Compiling .pio\build\view\lib44f\Simple FOC\current_sense\hardware_specific\stm32g4_mcu.cpp.o
Compiling .pio\build\view\lib44f\Simple FOC\current_sense\hardware_specific\teensy_mcu.cpp.o
Compiling .pio\build\view\lib44f\Simple FOC\drivers\BLDCDriver3PWM.cpp.o
Compiling .pio\build\view\lib44f\Simple FOC\drivers\BLDCDriver6PWM.cpp.o
src/display_task.cpp: In member function 'void DisplayTask::run()':
src/display_task.cpp:106:13: warning: unused variable 'pointer_center_x' [-Wunused-variable]
     int32_t pointer_center_x = TFT_WIDTH / 2;
             ^
src/display_task.cpp:107:13: warning: unused variable 'pointer_center_y' [-Wunused-variable]
     int32_t pointer_center_y = TFT_HEIGHT / 2;
             ^
src/display_task.cpp:108:13: warning: unused variable 'pointer_length_short' [-Wunused-variable]
     int32_t pointer_length_short = 10;
             ^
src/display_task.cpp:109:13: warning: unused variable 'pointer_length_long' [-Wunused-variable]
     int32_t pointer_length_long = TFT_WIDTH / 2 - 5;
             ^
Compiling .pio\build\view\lib44f\Simple FOC\drivers\StepperDriver2PWM.cpp.o
Compiling .pio\build\view\lib44f\Simple FOC\drivers\StepperDriver4PWM.cpp.o
Compiling .pio\build\view\lib44f\Simple FOC\drivers\hardware_specific\atmega2560_mcu.cpp.o
src/display_task.cpp: At global scope:
src/display_task.cpp:22:13: warning: 'void HSV_to_RGB(float, float, float, uint8_t*, uint8_t*, uint8_t*)' defined but not used [-Wunused-function]
 static void HSV_to_RGB(float h, float s, float v, uint8_t *r, uint8_t *g, uint8_t *b)
             ^
Compiling .pio\build\view\lib44f\Simple FOC\drivers\hardware_specific\atmega328_mcu.cpp.o
Compiling .pio\build\view\lib44f\Simple FOC\drivers\hardware_specific\atmega32u4_mcu.cpp.o
Compiling .pio\build\view\lib44f\Simple FOC\drivers\hardware_specific\due_mcu.cpp.o
Compiling .pio\build\view\lib44f\Simple FOC\drivers\hardware_specific\esp32_mcu.cpp.o
Compiling .pio\build\view\lib44f\Simple FOC\drivers\hardware_specific\esp8266_mcu.cpp.o
Compiling .pio\build\view\lib44f\Simple FOC\drivers\hardware_specific\generic_mcu.cpp.o
Compiling .pio\build\view\lib44f\Simple FOC\drivers\hardware_specific\portenta_h7_mcu.cpp.o
Compiling .pio\build\view\lib44f\Simple FOC\drivers\hardware_specific\rp2040_mcu.cpp.o
Compiling .pio\build\view\lib44f\Simple FOC\drivers\hardware_specific\samd21_mcu.cpp.o
Compiling .pio\build\view\lib44f\Simple FOC\drivers\hardware_specific\samd51_mcu.cpp.o
Compiling .pio\build\view\lib44f\Simple FOC\drivers\hardware_specific\samd_mcu.cpp.o
Compiling .pio\build\view\lib44f\Simple FOC\drivers\hardware_specific\stm32_mcu.cpp.o
.pio/libdeps/view/Simple FOC/src/current_sense/hardware_specific/esp32_mcu.cpp: In function 'float _readADCVoltageLowSide(int)':
.pio/libdeps/view/Simple FOC/src/current_sense/hardware_specific/esp32_mcu.cpp:60:18: warning: 'raw_adc' may be used uninitialized in this
function [-Wmaybe-uninitialized]
   return raw_adc * _ADC_CONV;
                  ^
Compiling .pio\build\view\lib44f\Simple FOC\drivers\hardware_specific\teensy_mcu.cpp.o
Compiling .pio\build\view\lib44f\Simple FOC\sensors\Encoder.cpp.o
Compiling .pio\build\view\lib44f\Simple FOC\sensors\HallSensor.cpp.o
Compiling .pio\build\view\lib44f\Simple FOC\sensors\MagneticSensorAnalog.cpp.o
Compiling .pio\build\view\lib44f\Simple FOC\sensors\MagneticSensorI2C.cpp.o
Compiling .pio\build\view\lib44f\Simple FOC\sensors\MagneticSensorPWM.cpp.o
Compiling .pio\build\view\lib44f\Simple FOC\sensors\MagneticSensorSPI.cpp.o
Compiling .pio\build\view\lib1b5\tlv\Tlv493d.cpp.o
Compiling .pio\build\view\lib1b5\tlv\util\BusInterface.cpp.o
Compiling .pio\build\view\lib1b5\tlv\util\RegMask.cpp.o
Compiling .pio\build\view\lib02a\AceButton\ace_button\AceButton.cpp.o
Compiling .pio\build\view\lib02a\AceButton\ace_button\ButtonConfig.cpp.o
Compiling .pio\build\view\lib02a\AceButton\ace_button\EncodedButtonConfig.cpp.o
Compiling .pio\build\view\lib02a\AceButton\ace_button\LadderButtonConfig.cpp.o
Compiling .pio\build\view\lib02a\AceButton\ace_button\testing\EventTracker.cpp.o
Compiling .pio\build\view\lib65c\FS\FS.cpp.o
Compiling .pio\build\view\lib65c\FS\vfs_api.cpp.o
Compiling .pio\build\view\lib725\SPIFFS\SPIFFS.cpp.o
Compiling .pio\build\view\lib067\TFT_eSPI\TFT_eSPI.cpp.o
Compiling .pio\build\view\libbf2\HX711\HX711.cpp.o
Compiling .pio\build\view\liba5e\Adafruit BusIO\Adafruit_BusIO_Register.cpp.o
Compiling .pio\build\view\liba5e\Adafruit BusIO\Adafruit_I2CDevice.cpp.o
Compiling .pio\build\view\liba5e\Adafruit BusIO\Adafruit_SPIDevice.cpp.o
Compiling .pio\build\view\lib905\Adafruit VEML7700 Library\Adafruit_VEML7700.cpp.o
Archiving .pio\build\view\libFrameworkArduinoVariant.a
Indexing .pio\build\view\libFrameworkArduinoVariant.a
Compiling .pio\build\view\FrameworkArduino\Esp.cpp.o
Compiling .pio\build\view\FrameworkArduino\FunctionalInterrupt.cpp.o
Compiling .pio\build\view\FrameworkArduino\HardwareSerial.cpp.o
Compiling .pio\build\view\FrameworkArduino\IPAddress.cpp.o
Compiling .pio\build\view\FrameworkArduino\IPv6Address.cpp.o
Compiling .pio\build\view\FrameworkArduino\MD5Builder.cpp.o
Archiving .pio\build\view\lib44f\libSimple FOC.a
Compiling .pio\build\view\FrameworkArduino\Print.cpp.o
Archiving .pio\build\view\lib1b5\libtlv.a
Compiling .pio\build\view\FrameworkArduino\Stream.cpp.o
Indexing .pio\build\view\lib1b5\libtlv.a
Compiling .pio\build\view\FrameworkArduino\StreamString.cpp.o
Compiling .pio\build\view\FrameworkArduino\WMath.cpp.o
Compiling .pio\build\view\FrameworkArduino\WString.cpp.o
Compiling .pio\build\view\FrameworkArduino\base64.cpp.o
Indexing .pio\build\view\lib44f\libSimple FOC.a
Compiling .pio\build\view\FrameworkArduino\cbuf.cpp.o
Archiving .pio\build\view\lib02a\libAceButton.a
Indexing .pio\build\view\lib02a\libAceButton.a
Compiling .pio\build\view\FrameworkArduino\esp32-hal-adc.c.o
Compiling .pio\build\view\FrameworkArduino\esp32-hal-bt.c.o
Compiling .pio\build\view\FrameworkArduino\esp32-hal-cpu.c.o
Compiling .pio\build\view\FrameworkArduino\esp32-hal-dac.c.o
Compiling .pio\build\view\FrameworkArduino\esp32-hal-gpio.c.o
Archiving .pio\build\view\libbf2\libHX711.a
Compiling .pio\build\view\FrameworkArduino\esp32-hal-i2c.c.o
Indexing .pio\build\view\libbf2\libHX711.a
Archiving .pio\build\view\lib725\libSPIFFS.a
Indexing .pio\build\view\lib725\libSPIFFS.a
Compiling .pio\build\view\FrameworkArduino\esp32-hal-ledc.c.o
Archiving .pio\build\view\liba5e\libAdafruit BusIO.a
Archiving .pio\build\view\lib65c\libFS.a
Compiling .pio\build\view\FrameworkArduino\esp32-hal-log.c.o
Compiling .pio\build\view\FrameworkArduino\esp32-hal-matrix.c.o
Indexing .pio\build\view\lib65c\libFS.a
Indexing .pio\build\view\liba5e\libAdafruit BusIO.a
Compiling .pio\build\view\FrameworkArduino\esp32-hal-misc.c.o
Archiving .pio\build\view\lib905\libAdafruit VEML7700 Library.a
Compiling .pio\build\view\FrameworkArduino\esp32-hal-psram.c.o
Indexing .pio\build\view\lib905\libAdafruit VEML7700 Library.a
Compiling .pio\build\view\FrameworkArduino\esp32-hal-rmt.c.o
Compiling .pio\build\view\FrameworkArduino\esp32-hal-sigmadelta.c.o
.pio/libdeps/view/TFT_eSPI/TFT_eSPI.cpp: In member function 'virtual int16_t TFT_eSPI::drawChar(uint16_t, int32_t, int32_t, uint8_t)':
.pio/libdeps/view/TFT_eSPI/TFT_eSPI.cpp:4220:12: warning: unused variable 'flash_address' [-Wunused-variable]
   uint32_t flash_address = 0;
            ^
.pio/libdeps/view/TFT_eSPI/TFT_eSPI.cpp:4249:11: warning: unused variable 'w' [-Wunused-variable]
   int32_t w = width;
           ^
.pio/libdeps/view/TFT_eSPI/TFT_eSPI.cpp:4250:11: warning: unused variable 'pX' [-Wunused-variable]
   int32_t pX      = 0;
           ^
.pio/libdeps/view/TFT_eSPI/TFT_eSPI.cpp:4251:11: warning: unused variable 'pY' [-Wunused-variable]
   int32_t pY      = y;
           ^
.pio/libdeps/view/TFT_eSPI/TFT_eSPI.cpp:4252:11: warning: unused variable 'line' [-Wunused-variable]
   uint8_t line = 0;
           ^
.pio/libdeps/view/TFT_eSPI/TFT_eSPI.cpp:4253:8: warning: unused variable 'clip' [-Wunused-variable]
   bool clip = xd < _vpX || xd + width  * textsize >= _vpW || yd < _vpY || yd + height * textsize >= _vpH;
        ^
In file included from .pio/libdeps/view/TFT_eSPI/TFT_eSPI.cpp:5078:0:
.pio/libdeps/view/TFT_eSPI/Extensions/Sprite.cpp: In member function 'virtual int16_t TFT_eSprite::drawChar(uint16_t, int32_t, int32_t, uint8_t)':
.pio/libdeps/view/TFT_eSPI/Extensions/Sprite.cpp:2181:12: warning: unused variable 'flash_address' [-Wunused-variable]
   uint32_t flash_address = 0;
            ^
.pio/libdeps/view/TFT_eSPI/Extensions/Sprite.cpp:2210:11: warning: unused variable 'w' [-Wunused-variable]
   int32_t w = width;
           ^
.pio/libdeps/view/TFT_eSPI/Extensions/Sprite.cpp:2211:11: warning: unused variable 'pX' [-Wunused-variable]
   int32_t pX      = 0;
           ^
.pio/libdeps/view/TFT_eSPI/Extensions/Sprite.cpp:2212:11: warning: unused variable 'pY' [-Wunused-variable]
   int32_t pY      = y;
           ^
.pio/libdeps/view/TFT_eSPI/Extensions/Sprite.cpp:2213:11: warning: unused variable 'line' [-Wunused-variable]
   uint8_t line = 0;
           ^
.pio/libdeps/view/TFT_eSPI/Extensions/Sprite.cpp:2214:8: warning: unused variable 'clip' [-Wunused-variable]
   bool clip = xd < _vpX || xd + width  * textsize >= _vpW || yd < _vpY || yd + height * textsize >= _vpH;
        ^
Compiling .pio\build\view\FrameworkArduino\esp32-hal-spi.c.o
Compiling .pio\build\view\FrameworkArduino\esp32-hal-time.c.o
Compiling .pio\build\view\FrameworkArduino\esp32-hal-timer.c.o
C:/Users/piercebrands/.platformio/packages/framework-arduinoespressif32/cores/esp32/esp32-hal-spi.c: In function 'spiTransferBytesNL':
C:/Users/piercebrands/.platformio/packages/framework-arduinoespressif32/cores/esp32/esp32-hal-spi.c:922:39: warning: initialization from incompatible pointer type [-Wincompatible-pointer-types]
                 uint8_t * last_out8 = &result[c_longs-1];
                                       ^
C:/Users/piercebrands/.platformio/packages/framework-arduinoespressif32/cores/esp32/esp32-hal-spi.c:923:40: warning: initialization from incompatible pointer type [-Wincompatible-pointer-types]
                 uint8_t * last_data8 = &last_data;
                                        ^
Compiling .pio\build\view\FrameworkArduino\esp32-hal-touch.c.o
Compiling .pio\build\view\FrameworkArduino\esp32-hal-uart.c.o
Compiling .pio\build\view\FrameworkArduino\libb64\cdecode.c.o
Compiling .pio\build\view\FrameworkArduino\libb64\cencode.c.o
Compiling .pio\build\view\FrameworkArduino\main.cpp.o
Compiling .pio\build\view\FrameworkArduino\stdlib_noniso.c.o
Compiling .pio\build\view\FrameworkArduino\wiring_pulse.c.o
Compiling .pio\build\view\FrameworkArduino\wiring_shift.c.o
Archiving .pio\build\view\libFrameworkArduino.a
Indexing .pio\build\view\libFrameworkArduino.a
Archiving .pio\build\view\lib067\libTFT_eSPI.a
Indexing .pio\build\view\lib067\libTFT_eSPI.a
Linking .pio\build\view\firmware.elf
Retrieving maximum program size .pio\build\view\firmware.elf
Checking size .pio\build\view\firmware.elf
Advanced Memory Usage is available via "PlatformIO Home > Project Inspect"
RAM:   [=         ]   5.4% (used 17648 bytes from 327680 bytes)
Flash: [===       ]  27.3% (used 357566 bytes from 1310720 bytes)
Building .pio\build\view\firmware.bin
esptool.py v3.1
Merged 1 ELF section
====================================================== [SUCCESS] Took 412.84 seconds ======================================================
Environment    Status    Duration
-------------  --------  ------------
view           SUCCESS   00:06:52.838
======================================================= 1 succeeded in 00:06:52.838 ======================================================= *  终端将被任务重用，按任意键关闭。

{/* <Aside type="note" title="Note"> The first compilation will take a bit longer as there are some plugins to download. If it keeps stopping, try switching networks or closing the current shell and clicking the compile button here to re-download. </Aside> */}

If you see output similar to the above, the compilation is complete.

Write

After the compilation is complete, click the Write button on Position 2 and the write log will look like this:

 *  正在执行任务: C:\Users\piercebrands\.platformio\penv\Scripts\platformio.exe run --target upload

Processing view (board: esp32doit-devkit-v1; platform: espressif32@3.4; framework: arduino)
-------------------------------------------------------------------------------------------------------------------------------------------
Tool Manager: Installing platformio/tool-mkspiffs @ ~2.230.0
Downloading  [####################################]  100%
Unpacking  [####################################]  100%
Tool Manager: tool-mkspiffs@2.230.0 has been installed!
Verbose mode can be enabled via `-v, --verbose` option
CONFIGURATION: https://docs.platformio.org/page/boards/espressif32/esp32doit-devkit-v1.html
PLATFORM: Espressif 32 (3.4.0) > DOIT ESP32 DEVKIT V1
HARDWARE: ESP32 240MHz, 320KB RAM, 4MB Flash
DEBUG: Current (esp-prog) External (esp-prog, iot-bus-jtag, jlink, minimodule, olimex-arm-usb-ocd, olimex-arm-usb-ocd-h, olimex-arm-usb-tiny-h, olimex-jtag-tiny, tumpa)
PACKAGES:
 - framework-arduinoespressif32 @ 3.10006.210326 (1.0.6)
 - tool-esptoolpy @ 1.30100.210531 (3.1.0)
 - tool-mkspiffs @ 2.230.0 (2.30)
 - toolchain-xtensa32 @ 2.50200.97 (5.2.0)
LDF: Library Dependency Finder -> https://bit.ly/configure-pio-ldf
LDF Modes: Finder ~ chain, Compatibility ~ soft
Found 37 compatible libraries
Scanning dependencies...
Dependency Graph
|-- Simple FOC @ 2.2.0
|   |-- Wire @ 1.0.1
|   |-- SPI @ 1.0
|-- TLV493D-Magnetic-Sensor @ 1.0.3
|   |-- Wire @ 1.0.1
|-- AceButton @ 1.9.1
|-- TFT_eSPI @ 2.4.25
|   |-- SPI @ 1.0
|   |-- SPIFFS @ 1.0
|   |   |-- FS @ 1.0
|   |-- FS @ 1.0
|-- FastLED @ 3.5.0
|   |-- SPI @ 1.0
|-- HX711 @ 0.7.5
|-- Adafruit VEML7700 Library @ 1.1.1
|   |-- Adafruit BusIO @ 1.13.2
|   |   |-- Wire @ 1.0.1
|   |   |-- SPI @ 1.0
|   |-- Wire @ 1.0.1
|   |-- SPI @ 1.0
Building in release mode
Retrieving maximum program size .pio\build\view\firmware.elf
Checking size .pio\build\view\firmware.elf
Advanced Memory Usage is available via "PlatformIO Home > Project Inspect"
RAM:   [=         ]   5.4% (used 17648 bytes from 327680 bytes)
Flash: [===       ]  27.3% (used 357566 bytes from 1310720 bytes)
Configuring upload protocol...
AVAILABLE: esp-prog, espota, esptool, iot-bus-jtag, jlink, minimodule, olimex-arm-usb-ocd, olimex-arm-usb-ocd-h, olimex-arm-usb-tiny-h, olimex-jtag-tiny, tumpa
CURRENT: upload_protocol = esptool
Looking for upload port...
Auto-detected: COM3
Uploading .pio\build\view\firmware.bin
esptool.py v3.1
Serial port COM3
Connecting......
Chip is ESP32-PICO-V3-02 (revision 3)
Features: WiFi, BT, Dual Core, 240MHz, Embedded Flash, Embedded PSRAM, VRef calibration in efuse, Coding Scheme None
Crystal is 40MHz
MAC: 98:cd:ac:e8:af:ec
Uploading stub...
Running stub...
Stub running...
Changing baud rate to 460800
Changed.
Configuring flash size...
Auto-detected Flash size: 8MB
Flash will be erased from 0x00001000 to 0x00005fff...
Flash will be erased from 0x00008000 to 0x00008fff...
Flash will be erased from 0x0000e000 to 0x0000ffff...
Flash will be erased from 0x00010000 to 0x00067fff...
Flash params set to 0x0230
Compressed 17104 bytes to 11191...
Writing at 0x00001000... (100 %)
Wrote 17104 bytes (11191 compressed) at 0x00001000 in 0.6 seconds (effective 229.4 kbit/s)...
Hash of data verified.
Compressed 3072 bytes to 128...
Writing at 0x00008000... (100 %)
Wrote 3072 bytes (128 compressed) at 0x00008000 in 0.1 seconds (effective 364.0 kbit/s)...
Hash of data verified.
Compressed 8192 bytes to 47...
Writing at 0x0000e000... (100 %)
Wrote 8192 bytes (47 compressed) at 0x0000e000 in 0.1 seconds (effective 541.4 kbit/s)...
Hash of data verified.
Compressed 357680 bytes to 190508...
Writing at 0x00010000... (8 %)
Writing at 0x00018fcf... (16 %)
Writing at 0x0002ae74... (25 %)
Writing at 0x0003201b... (33 %)
Writing at 0x00037658... (41 %)
Writing at 0x0003ce83... (50 %)
Writing at 0x0004347a... (58 %)
Writing at 0x0004c06f... (66 %)
Writing at 0x000519bf... (75 %)
Writing at 0x00057a46... (83 %)
Writing at 0x0005d864... (91 %)
Writing at 0x00063652... (100 %)
Wrote 357680 bytes (190508 compressed) at 0x00010000 in 4.4 seconds (effective 651.0 kbit/s)...
Hash of data verified.

Leaving...
Hard resetting via RTS pin...
====================================================== [SUCCESS] Took 19.27 seconds ======================================================

Environment    Status    Duration
-------------  --------  ------------
view           SUCCESS   00:00:19.271
======================================================= 1 succeeded in 00:00:19.271 =======================================================
*  终端将被任务重用，按任意键关闭。

Serial Monitor

Waiting the write task is complete, press the serial button on the Position 3 and the output is as follows:

 *  正在执行任务: C:\Users\piercebrands\.platformio\penv\Scripts\platformio.exe device monitor

--- Terminal on COM3 | 115200 8-N-1
--- Available filters and text transformations: colorize, debug, default, direct,
esp32_exception_decoder, hexlify, log2file, nocontrol, printable, send_on_enter, time
--- More details at https://bit.ly/pio-monitor-filters
--- Quit: Ctrl+C | Menu: Ctrl+T | Help: Ctrl+T followed by Ctrl+H
drv:0x00,hd_drv:0x00,wp_drv:0x00
mode:DIO, clock div:2
load:0x3fff0018,len:4
load:0x3fff001c,len:1044
load:0x40078000,len:10124
load:0x40080400,len:5828
entry 0x400806a8
Sprite created!
millilux: 0.00
HX711 reading: 669031
millilux: 0.00
HX711 reading: 668815
Press Y to run calibration          <========= // Look this
millilux: 0.00
HX711 reading: 668869
millilux: 0.00
HX711 reading: 668639
millilux: 0.00
HX711 reading: 668634
4.43
Got new config
millilux: 0.00

There is a word Press Y to run calibration, which can be used to automatically debug a set value suitable for the current device. After pressing the capital Y in the serial window, the knob will be rotated automatically, and after a while, the following result will be output in the serial port:

RESULTS:
    zero electric angle: 4.43 // The values on this side may be different for each device.
    direction: CW
    pole pairs: 7

Open motor_task.cpp file:

float zero_electric_offset = 4.43; // Replace the value with the value of zero electric angle output above.

After saving, write the firmware again. It should run successfully.

如何在 macOS 上从源码构建 manimgl

import LoopingVideo from '~/components/looping-video.astro' import { Aside } from '@astrojs/starlight/components';

Manim 是一个精确的程序化动画引擎，用于创建解释性数学视频。

<Aside type="note" title="Note"> Manim 有两个版本，一个是由 3blue1brown 维护的个人版本，另一个是由 ManimCommunity 维护的社区版本。本文将演示由 3blue1brown 维护的 macOS 上的个人版本。 </Aside>

Download source code

cd ~/projects
git clone https://github.com/3b1b/manim.git
cd manim

创建环境

conda create -n manim-build-from-source python=3.10
conda activate manim-build-from-source

安装库

mapbox-earcut

pip install mapbox-earcut

ffmpeg

brew install ffmpeg

mactex

brew install mactex

<Aside type="tip" title="Tips"> This may take a little longer. </Aside>

验证 mactex 安装

Type latex --version in the terminal.

latex --version

# Output
pdfTeX 3.141592653-2.6-1.40.26 (TeX Live 2024)
kpathsea version 6.4.0
Copyright 2024 Han The Thanh (pdfTeX) et al.
There is NO warranty.  Redistribution of this software is
covered by the terms of both the pdfTeX copyright and
the Lesser GNU General Public License.
For more information about these matters, see the file
named COPYING and the pdfTeX source.
Primary author of pdfTeX: Han The Thanh (pdfTeX) et al.
Compiled with libpng 1.6.43; using libpng 1.6.43
Compiled with zlib 1.3.1; using zlib 1.3.1
Compiled with xpdf version 4.04

如果输出如上所示，那么恭喜你，mactex 已成功安装。你可以继续下一步。

否则，请继续。我们需要修复这个问题。我不确定为什么，但有时，当 brew install mactex 完成后，它只是下载一个包到你的磁盘。你仍然需要手动安装它。

brew info mactex

# Output
❯ brew info mactex
==> mactex: 2024.0312
https://www.tug.org/mactex/
Installed
/opt/homebrew/Caskroom/mactex/2024.0312 (5.6GB)
From: https://github.com/Homebrew/homebrew-cask/blob/HEAD/Casks/m/mactex.rb
==> Name
MacTeX
==> Description
Full TeX Live distribution with GUI applications
==> Dependencies
ghostscript
==> Artifacts
mactex-20240312.pkg (Pkg)
==> Caveats
You must restart your terminal window for the installation of MacTeX CLI
tools to take effect.

Alternatively, Bash and Zsh users can run the command:

  eval "$(/usr/libexec/path_helper)"

==> Analytics
install: 3,166 (30 days), 7,794 (90 days), 30,329 (365 days)

复制高亮的路径并在终端中打开它。

open /opt/homebrew/Caskroom/mactex/2024.031

你会看到一个名为 mactex-<date>.pkg 的文件

tree /opt/homebrew/Caskroom/mactex/2024.0312
/opt/homebrew/Caskroom/mactex/2024.0312
└── mactex-20240312.pkg

1 directory, 1 file

打开这个文件并手动安装。

安装完成后，重新验证 mactex 安装，现在 mactex 应该可以正常工作。

从源码构建

pip install -e ./manim

验证 manimgl 安装

which manimgl # output: /opt/anaconda3/envs/manim-build-from-source/bin/manimgl

<Aside type="tip" title="Tips"> 这可能因系统而异，但可以通过虚拟环境的名称进行验证，只要 manimgl 来自 manim-build-from-source/bin/manimgl 目录，那么就没有问题。 </Aside>

使用 manimgl

cd ~/projects/manim
manimgl example_scenes.py TexTransformExample

你应该能够看到下面的动画。

恭喜你，你已经完成了所有步骤。

其他

如果遇到安装和使用问题，可以在这里创建一个 Issue。

查看示例场景以查看库的语法、动画类型和对象类型示例。

在 3b1b/videos 仓库中，你可以看到所有 3blue1brown 视频的代码。

基于 VSCode 构建自己的远程开发环境

import { Aside, Badge, FileTree, LinkCard } from '@astrojs/starlight/components'; import ReadMore from '~/components/read-more.astro';

平台要求:

System: Ubuntu 24.04
Node.js: v22.21.1
Docker
Fly.io CLI

<Aside title="注意"> 上述需要的平台/账号请自行注册，这里不再赘述。 </Aside>

构建 VSCode

下载 VSCode 源码

git clone https://github.com/microsoft/vscode.git
cd vscode

在这里，我们将基于一个历史版本 <Badge text='v1.99.3'/> 来构建

git checkout -b my-vscode-1.99.3 1.99.3

安装依赖

sudo apt-get install build-essential g++ libx11-dev libxkbfile-dev libsecret-1-dev libkrb5-dev python-is-python3

<ReadMore>参考 How to build and run from source</ReadMore>

编译 VSCode

cd vscode
npm install
npm run compile

构建 Docker 镜像

创建构建脚本

在项目根目录新建 Dockerfile 文件，并在scripts目录下新建 build.sh 和 entrypoint.sh 文件。

vscode
- scripts/
  - build.sh
  - entrypoint.sh
- Dockerfile </FileTree>

#!/usr/bin/env bash
set -euo pipefail

ROOT_DIR=$(cd "$(dirname "$0")/.." && pwd)
cd "$ROOT_DIR"

IMAGE_NAME="${IMAGE_NAME:-vscode-web}"
IMAGE_TAG="${IMAGE_TAG:-local}"
DOCKERFILE="${DOCKERFILE:-Dockerfile}"
WEB_DIST_DIR="${WEB_DIST_DIR:-vscode-reh-web-linux-x64}"

echo "[ENV] IMAGE_NAME=${IMAGE_NAME} IMAGE_TAG=${IMAGE_TAG} DOCKERFILE=${DOCKERFILE}"
echo "[ENV] WEB_DIST_DIR=${WEB_DIST_DIR}"

echo "[STEP] Build VS Code web dist -> ${WEB_DIST_DIR}"
rm -rf "${WEB_DIST_DIR}"
npm run gulp "${WEB_DIST_DIR}"
cp -r ../"${WEB_DIST_DIR}" ./

echo "[STEP] Docker build ${IMAGE_NAME}:${IMAGE_TAG}"
docker build \
  --build-arg WEB_DIST_DIR="${WEB_DIST_DIR}" \
  -t "${IMAGE_NAME}:${IMAGE_TAG}" \
  -f "${DOCKERFILE}" \
  "${ROOT_DIR}"

echo "[DONE] Built image: ${IMAGE_NAME}:${IMAGE_TAG}"

#!/usr/bin/env bash
set -euo pipefail

log() {
  echo "[$(date '+%Y-%m-%d %H:%M:%S')] $*"
}

APP_HOME="${APP_HOME:-/opt/vscode-web}"
HOST="0.0.0.0"
LISTEN_PORT="${IDE_PORT:-8080}"
CONNECTION_TOKEN="${CONNECTION_TOKEN:-rviFq8oBBOIp92fGXnSlWygbjNpGU2FelEeMVQp6CTRiuux0BxGKU01yCCmICBbY}"

ARGS=(
  --host "${HOST}"
  --port "${LISTEN_PORT}"
  --connection-token "${CONNECTION_TOKEN}"
)

log "[INFO] Starting VS Code Web on ${HOST}:${LISTEN_PORT}?tkn=${CONNECTION_TOKEN}"
log "[INFO] APP_HOME=${APP_HOME}"

SERVER_BIN="${SERVER_BIN:-${APP_HOME}/bin/code-server-oss}"

exec "${SERVER_BIN}" "${ARGS[@]}" "$@"

FROM ubuntu:24.04

ARG WEB_DIST_DIR=vscode-reh-web-linux-x64

ENV DEBIAN_FRONTEND=noninteractive \
    APP_HOME=/opt/vscode-web \
    IDE_PORT=8080 \
    PNPM_STORE_DIR=/home/vscode/workspace/.pnpm-store

RUN apt-get update && apt-get install -y --no-install-recommends \
    ca-certificates \
    curl \
    bash \
    dumb-init \
    git \
    unzip \
    zip \
    wget \
    net-tools \
    lrzsz \
    gnupg \
 && curl -fsSL https://deb.nodesource.com/setup_20.x | bash - \
 && apt-get install -y --no-install-recommends nodejs \
 && npm install -g pnpm@9 \
 && npm cache clean --force \
 && rm -rf /var/lib/apt/lists/*

RUN groupadd -r vscode && useradd -m -r -g vscode -s /bin/bash vscode

RUN mkdir -p "$APP_HOME" /home/vscode/workspace "$PNPM_STORE_DIR" \
 && chown -R vscode:vscode "$APP_HOME" /home/vscode

COPY ${WEB_DIST_DIR}/ "$APP_HOME"/

COPY scripts/entrypoint.sh /usr/local/bin/entrypoint.sh

RUN chmod 0755 /usr/local/bin/entrypoint.sh \
 && chown -R vscode:vscode "$APP_HOME"

USER vscode

RUN pnpm config set store-dir "$PNPM_STORE_DIR" --global \
 && git config --global user.name "vscode" \
 && git config --global user.email "vscode@local.com"

WORKDIR /home/vscode/workspace

EXPOSE 8080

ENTRYPOINT ["/usr/bin/dumb-init", "--"]
CMD ["/usr/local/bin/entrypoint.sh"]

然后开始构建镜像

cd vscode
bash scripts/build.sh

构建完成之后，可以使用 docker images 来查看构建好的镜像。

推送镜像到 Dockerhub

注册一个 Docker Hub 账号，并安装 Docker。

<Aside title="注意"> 把 {username} 替换为你自己的用户名 </Aside>

docker login
docker tag vscode-web:local {username}/vscode-web:latest
docker push {username}/vscode-web:latest

部署到 Fly.io

把 {username} 替换为你自己的用户名。
下方的 fly.toml 里面的 region。尽可能选择离自己最近的。所有可用的 region 见 Fly.io Regions。
下方的 fly.toml 里面的 app，必须是要唯一的，如果重复，会创建失败。可以添加一些随机的字符。只要保证不重复就可以。 </Aside>

登陆 Fly.io

注册一个 Fly.io 账号，并安装 Fly.io CLI。

fly auth login

配置 Token

把 ~/.fly/config.yml 文件中的 access_token 配置到 FLY_API_TOKEN 环境变量中。

export FLY_API_TOKEN=$(cat ~/.fly/config.yml | grep access_token | awk -F ': ' '{print $2}')

创建 App

fly apps create {username}-vscode-web-ide

创建 Volume

fly volumes create vscode_workspace --size 3 --region sin --app {username}-vscode-web-ide

创建 fly.toml 文件

在项目根目录新建 fly.toml 文件。

app = '{username}-vscode-web-ide'
primary_region = 'sjc'

[build]
  image = '{username}/vscode-web:latest'

[http_service]
  internal_port = 8080
  force_https = true
  auto_stop_machines = 'suspend'
  auto_start_machines = true
  min_machines_running = 0
  processes = ['app']

[[vm]]
  memory = '4gb'
  cpu_kind = 'shared'
  cpus = 8

[[mounts]]
  source = "vscode_workspace"
  destination = "/home/vscode/workspace"

然后就可以开始部署了。

fly deploy

访问 VSCode Web

如果一切正常，那么现在可以正常访问 VSCode Web 了。

https://{username}-vscode-web-ide.fly.dev?tkn=rviFq8oBBOIp92fGXnSlWygbjNpGU2FelEeMVQp6CTRiuux0BxGKU01yCCmICBbY

如何向开发者反馈

import { Aside } from '@astrojs/starlight/components';

如何向开发者反馈

不可避免地，我们在使用插件时会遇到一些问题。为了快速解决问题，我们需要一种快速有效的方式与开发者沟通。减少可能的时间损失和无用的重复操作，并尽快解决问题。

出现错误

Here, for example, we use the ChatGPT - EasyCode plugin to simulate an error.

这里的标记是:

Plgugin version info
Author's e-mail or website
Error message

尝试联系作者

如 marker 2 所示，你可以找到插件作者的定制 网站或电子邮件。首先，你可以尝试询问帮助。也可以在论坛（如果有）中寻求帮助，也许你不是唯一一个遇到这个问题的人。也可以在插件的评论页留下消息。

Anyway, the first thing to do is to make sure that there is at least one way to contact the author.

提供必要的信息

当出现错误时，开发者最需要知道的信息是以下内容：

错误日志 (在图片中的 marker 3): 这里的信息很重要。在大多数情况下，我们可以根据这些信息快速定位问题。复制这里的一切并将其作为附件发送给作者。这是非常必要的。
插件版本 (在图片中的 marker 1): 当插件出现错误时，我们通常可以看到插件版本，这也是一个重要的信息。
IDE 版本: 有时 SDK 兼容性或其他原因导致某些错误仅在特定版本的 IDE 上出现。
idea.log: 这是一个更完整的日志文件，用于记录 IDE 和插件的一些信息。在某些情况下，插件作者可能也需要你提供这个文件。

如何找到 idea.log

点击菜单栏中的 Help -> Show Log in Explorer。

选择一个名为 idea.log 的文件。这就是我们要找的文件。

这里我的文件路径是:

C:\Users\obiscr\AppData\Local\JetBrains\IntelliJIdea2023.2\log\idea.log

<Aside type="note" title="Note"> 这只是 Windows 系统的一个例子。有关日志位置的更多详细信息，请参阅 IDE 用于存储设置、缓存、插件和日志的目录 </Aside>

更复杂的情况

通常，通过以上方法，问题可以解决。但有时，会有一些奇怪的情况，甚至作者也无法解决，或者可能是 IDE 本身的一个错误。所以错误修复周期不是很固定。

总结

当出现问题时，我们可以一次性向作者提供尽可能多的信息。例如，所有上述内容。如果只有一部分，作者可能会要求你提供其他必要的信息。这种沟通通常需要更多时间。

<Aside type="note" title="Note"> 这适用于任何问题，事实上，我们可以提供尽可能多的信息，总是节省一些沟通时间，并尽快解决问题。 </Aside>

如何加速 pnpm 的 postinstall

import { Aside, Badge, FileTree } from '@astrojs/starlight/components';

问题描述

如果你的项目中有使用过 supabase cli，那么你可能遇到过这样的问题：

my-project
- node_modules/
- src/
- package.json </FileTree>

package.json 中包含如下内容：

{
  "name": "my-project",
  "version": "0.1.0",
  "private": true,
  "scripts": {
    "dev": "next dev --turbo",
    "build": "next build",
    "start": "next start",
    "lint": "next lint",
    "type-check": "tsc --noEmit",
    "check-all": "npm run lint & npm run type-check & wait"
  },
  "dependencies": {
    "react": "^18",
    "react-dom": "^18",
    "next": "14.2.23",
    "@supabase/ssr": "^0.6.1",
    "@supabase/supabase-js": "^2.49.4"
  },
  "devDependencies": {
    "typescript": "^5",
    "@types/node": "^20",
    "@types/react": "^18",
    "@types/react-dom": "^18",
    "postcss": "^8",
    "supabase": "^2.34.3",
    "tailwindcss": "^3.4.1",
    "eslint": "^8",
    "eslint-config-next": "14.2.23"
  },
  "pnpm": {
    "onlyBuiltDependencies": [
      "supabase",
      "unrs-resolver"
    ],
    "peerDependencyRules": {
      "allowAny": [
        "supabase"
      ]
    }
  }
}

运行 pnpm install 后，你会看到类似如下的输出：

(base) obiscr@192 my-project % pnpm install

   ╭──────────────────────────────────────────╮
   │                                          │
   │   Update available! 10.10.0 → 10.14.0.   │
   │   Changelog: https://pnpm.io/v/10.14.0   │
   │     To update, run: pnpm self-update     │
   │                                          │
   ╰──────────────────────────────────────────╯

 WARN  deprecated eslint@8.57.1: This version is no longer supported. Please see https://eslint.org/version-support for other options.
 WARN  6 deprecated subdependencies found: @humanwhocodes/config-array@0.13.0, @humanwhocodes/object-schema@2.0.3, glob@7.2.3, inflight@1.0.6, node-domexception@1.0.0, rimraf@3.0.2
Packages: +417
+++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++
 WARN  Failed to create bin at /Users/obiscr/EasyCodeAIProjects/myblog123/node_modules/.bin/supabase. ENOENT: no such file or directory, chmod '/Users/obiscr/EasyCodeAIProjects/myblog123/node_modules/supabase/bin/supabase'
Progress: resolved 433, reused 382, downloaded 20, added 417, done
 WARN  Failed to create bin at /Users/obiscr/EasyCodeAIProjects/myblog123/node_modules/supabase/node_modules/.bin/supabase. ENOENT: no such file or directory, chmod '/Users/obiscr/EasyCodeAIProjects/myblog123/node_modules/supabase/bin/supabase'
node_modules/supabase: Running postinstall script, failed in 3m 52.2s
node_modules/supabase postinstall$ node scripts/postinstall.js
│ Downloading https://github.com/supabase/cli/releases/download/v2.34.3/supabase_2.34.3_checksums.txt
│ Downloading https://github.com/supabase/cli/releases/download/v2.34.3/supabase_darwin_arm64.tar.gz
│ Warning: Detected unsettled top-level await at file:///Users/obiscr/EasyCodeAIProjects/myblog123/node_modules/su…
│ await main();
│ ^
└─ Failed in 3m 52.2s at /Users/obiscr/projects/my-project/node_modules/supabase
node_modules/unrs-resolver: Running postinstall script, done in 199ms
 ELIFECYCLE  Command failed with exit code 13.

过了将近4分钟，但是依旧安装失败。经过我的多次测试，这种情况在网络条件比较差的时候时有发生。

解决方法

<Aside type="note"> 本文虽然使用 <Badge text="supabase cli" variant="note" /> 作为示例，但是这个方法具有通用性。本质就是更改 postinstall.js 文件，让其在安装时优先使用本地文件，如果本地文件不存在，则执行默认逻辑从 github 下载。 </Aside>

既然是 supabase cli 的 postinstall 脚本安装失败，那么我们来看看 supabase cli 的 postinstall 脚本做了什么。

进入 node_modules/supabase 目录，结构如下：

supabase
- bin/
- scripts/
  - postinstall.js
- LICENSE
- package.json
- README.md </FileTree>

postinstall.js 中包含如下内容：

#!/usr/bin/env node

// Ref 1: https://github.com/sanathkr/go-npm
// Ref 2: https://medium.com/xendit-engineering/how-we-repurposed-npm-to-publish-and-distribute-our-go-binaries-for-internal-cli-23981b80911b
"use strict";

import binLinks from "bin-links";
import { createHash } from "crypto";
import fs from "fs";
import fetch from "node-fetch";
import { Agent } from "https";
import { HttpsProxyAgent } from "https-proxy-agent";
import path from "path";
import { extract } from "tar";
import zlib from "zlib";

// Mapping from Node's `process.arch` to Golang's `$GOARCH`
const ARCH_MAPPING = {
  x64: "amd64",
  arm64: "arm64",
};

// Mapping between Node's `process.platform` to Golang's
const PLATFORM_MAPPING = {
  darwin: "darwin",
  linux: "linux",
  win32: "windows",
};

const arch = ARCH_MAPPING[process.arch];
const platform = PLATFORM_MAPPING[process.platform];

// TODO: import pkg from "../package.json" assert { type: "json" };
const readPackageJson = async () => {
  const contents = await fs.promises.readFile("package.json");
  return JSON.parse(contents);
};

// Build the download url from package.json
const getDownloadUrl = (packageJson) => {
  const pkgName = packageJson.name;
  const version = packageJson.version;
  const repo = packageJson.repository;
  const url = `https://github.com/${repo}/releases/download/v${version}/${pkgName}_${platform}_${arch}.tar.gz`;
  return url;
};

const fetchAndParseCheckSumFile = async (packageJson, agent) => {
  const version = packageJson.version;
  const pkgName = packageJson.name;
  const repo = packageJson.repository;
  const checksumFileUrl = `https://github.com/${repo}/releases/download/v${version}/${pkgName}_${version}_checksums.txt`;

  // Fetch the checksum file
  console.info("Downloading", checksumFileUrl);
  const response = await fetch(checksumFileUrl, { agent });
  if (response.ok) {
    const checkSumContent = await response.text();
    const lines = checkSumContent.split("\n");

    const checksums = {};
    for (const line of lines) {
      const [checksum, packageName] = line.split(/\s+/);
      checksums[packageName] = checksum;
    }

    return checksums;
  } else {
    console.error(
      "Could not fetch checksum file",
      response.status,
      response.statusText
    );
  }
};

const errGlobal = `Installing Supabase CLI as a global module is not supported.
Please use one of the supported package managers: https://github.com/supabase/cli#install-the-cli
`;
const errChecksum = "Checksum mismatch. Downloaded data might be corrupted.";
const errUnsupported = `Installation is not supported for ${process.platform} ${process.arch}`;

/**
 * Reads the configuration from application's package.json,
 * downloads the binary from package url and stores at
 * ./bin in the package's root.
 *
 *  See: https://docs.npmjs.com/files/package.json#bin
 */
async function main() {
  const yarnGlobal = JSON.parse(
    process.env.npm_config_argv || "{}"
  ).original?.includes("global");
  if (process.env.npm_config_global || yarnGlobal) {
    throw errGlobal;
  }
  if (!arch || !platform) {
    throw errUnsupported;
  }

  // Read from package.json and prepare for the installation.
  const pkg = await readPackageJson();
  if (platform === "windows") {
    // Update bin path in package.json
    pkg.bin[pkg.name] += ".exe";
  }

  // Prepare the installation path by creating the directory if it doesn't exist.
  const binPath = pkg.bin[pkg.name];
  const binDir = path.dirname(binPath);
  await fs.promises.mkdir(binDir, { recursive: true });

  // Create the agent that will be used for all the fetch requests later.
  const proxyUrl =
    process.env.npm_config_https_proxy ||
    process.env.npm_config_http_proxy ||
    process.env.npm_config_proxy;
  // Keeps the TCP connection alive when sending multiple requests
  // Ref: https://github.com/node-fetch/node-fetch/issues/1735
  const agent = proxyUrl
    ? new HttpsProxyAgent(proxyUrl, { keepAlive: true })
    : new Agent({ keepAlive: true });

  // First, fetch the checksum map.
  const checksumMap = await fetchAndParseCheckSumFile(pkg, agent);

  // Then, download the binary.
  const url = getDownloadUrl(pkg);
  console.info("Downloading", url);
  const resp = await fetch(url, { agent });
  const hash = createHash("sha256");
  const pkgNameWithPlatform = `${pkg.name}_${platform}_${arch}.tar.gz`;

  // Then, decompress the binary -- we will first Un-GZip, then we will untar.
  const ungz = zlib.createGunzip();
  const binName = path.basename(binPath);
  const untar = extract({ cwd: binDir }, [binName]);

  // Update the hash with the binary data as it's being downloaded.
  resp.body
    .on("data", (chunk) => {
      hash.update(chunk);
    })
    // Pipe the data to the ungz stream.
    .pipe(ungz);

  // After the ungz stream has ended, verify the checksum.
  ungz
    .on("end", () => {
      const expectedChecksum = checksumMap?.[pkgNameWithPlatform];
      // Skip verification if we can't find the file checksum
      if (!expectedChecksum) {
        console.warn("Skipping checksum verification");
        return;
      }
      const calculatedChecksum = hash.digest("hex");
      if (calculatedChecksum !== expectedChecksum) {
        throw errChecksum;
      }
      console.info("Checksum verified.");
    })
    // Pipe the data to the untar stream.
    .pipe(untar);

  // Wait for the untar stream to finish.
  await new Promise((resolve, reject) => {
    untar.on("error", reject);
    untar.on("end", () => resolve());
  });

  // Link the binaries in postinstall to support yarn
  await binLinks({
    path: path.resolve("."),
    pkg: { ...pkg, bin: { [pkg.name]: binPath } },
  });

  console.info("Installed Supabase CLI successfully");
}

await main();

简单来讲，就是从 supabase 的 github 仓库中下载 supabase 的二进制文件，并将其安装到 node_modules 中。

那么，我们是否可以优化这个过程呢？

答案是肯定的。

我们可以将 supabase 的二进制文件下载到本地，然后将其安装到 node_modules 中。

在项目根目录终端执行下面的命令来下载文件：

curl -L -o lib/supabase/supabase_2.34.3_checksums.txt https://github.com/supabase/cli/releases/download/v2.34.3/supabase_2.34.3_checksums.txt
curl -L -o lib/supabase/supabase_darwin_arm64.tar.gz https://github.com/supabase/cli/releases/download/v2.34.3/supabase_darwin_arm64.tar.gz

在终端执行 pnpm patch supabase@2.34.3。

obiscr@192 my-project % pnpm patch supabase@2.34.3
Patch: You can now edit the package at:

  /Users/obiscr/projects/my-project/node_modules/.pnpm_patches/supabase@2.34.3

To commit your changes, run:

  pnpm patch-commit '/Users/obiscr/projects/my-project/node_modules/.pnpm_patches/supabase@2.34.3'

在 node_modules/.pnpm_patches/supabase@2.34.3 目录下，你会看到如下内容：

node_modules/
- .pnpm_patches
  - supabase@2.34.3
    - scripts
      - postinstall.js
    - LICENSE
    - package.json
    - README.md
  - state.json </FileTree>

然后编辑 postinstall.js 文件。

#!/usr/bin/env node

// Ref 1: https://github.com/sanathkr/go-npm
// Ref 2: https://medium.com/xendit-engineering/how-we-repurposed-npm-to-publish-and-distribute-our-go-binaries-for-internal-cli-23981b80911b
"use strict";

import binLinks from "bin-links";
import { createHash } from "crypto";
import fs from "fs";
import fetch from "node-fetch";
import { Agent } from "https";
import { HttpsProxyAgent } from "https-proxy-agent";
import path from "path";
import { extract } from "tar";
import zlib from "zlib";

// Mapping from Node's `process.arch` to Golang's `$GOARCH`
const ARCH_MAPPING = {
  x64: "amd64",
  arm64: "arm64",
};

// Mapping between Node's `process.platform` to Golang's
const PLATFORM_MAPPING = {
  darwin: "darwin",
  linux: "linux",
  win32: "windows",
};

const arch = ARCH_MAPPING[process.arch];
const platform = PLATFORM_MAPPING[process.platform];

// TODO: import pkg from "../package.json" assert { type: "json" };
const readPackageJson = async () => {
  const contents = await fs.promises.readFile("package.json");
  return JSON.parse(contents);
};

// Build the download url from package.json
const getDownloadUrl = (packageJson) => {
  const pkgName = packageJson.name;
  const version = packageJson.version;
  const repo = packageJson.repository;
  const url = `https://github.com/${repo}/releases/download/v${version}/${pkgName}_${platform}_${arch}.tar.gz`;
  return url;
};

const fetchAndParseCheckSumFile = async (packageJson, agent) => {
  const version = packageJson.version;
  const pkgName = packageJson.name;
  const repo = packageJson.repository;
  const checksumFileUrl = `https://github.com/${repo}/releases/download/v${version}/${pkgName}_${version}_checksums.txt`;

  // Fetch the checksum file
  console.info("Downloading", checksumFileUrl);
  const response = await fetch(checksumFileUrl, { agent });
  if (response.ok) {
    const checkSumContent = await response.text();
    const lines = checkSumContent.split("\n");

    const checksums = {};
    for (const line of lines) {
      const [checksum, packageName] = line.split(/\s+/);
      checksums[packageName] = checksum;
    }

    return checksums;
  } else {
    console.error(
      "Could not fetch checksum file",
      response.status,
      response.statusText
    );
  }
};

const errGlobal = `Installing Supabase CLI as a global module is not supported.
Please use one of the supported package managers: https://github.com/supabase/cli#install-the-cli
`;
const errChecksum = "Checksum mismatch. Downloaded data might be corrupted.";
const errUnsupported = `Installation is not supported for ${process.platform} ${process.arch}`;

/**
 * Reads the configuration from application's package.json,
 * downloads the binary from package url and stores at
 * ./bin in the package's root.
 *
 *  See: https://docs.npmjs.com/files/package.json#bin
 */
async function main() {
  const yarnGlobal = JSON.parse(
    process.env.npm_config_argv || "{}"
  ).original?.includes("global");
  if (process.env.npm_config_global || yarnGlobal) {
    throw errGlobal;
  }
  if (!arch || !platform) {
    throw errUnsupported;
  }

  // Read from package.json and prepare for the installation.
  const pkg = await readPackageJson();
  if (platform === "windows") {
    // Update bin path in package.json
    pkg.bin[pkg.name] += ".exe";
  }

  // Prepare the installation path by creating the directory if it doesn't exist.
  const binPath = pkg.bin[pkg.name];
  const binDir = path.dirname(binPath);
  await fs.promises.mkdir(binDir, { recursive: true });

  // Create the agent that will be used for all the fetch requests later.
  const proxyUrl =
    process.env.npm_config_https_proxy ||
    process.env.npm_config_http_proxy ||
    process.env.npm_config_proxy;
  // Keeps the TCP connection alive when sending multiple requests
  // Ref: https://github.com/node-fetch/node-fetch/issues/1735
  const agent = proxyUrl
    ? new HttpsProxyAgent(proxyUrl, { keepAlive: true })
    : new Agent({ keepAlive: true });

  // First, fetch the checksum map.
  const checksumMap = await fetchAndParseCheckSumFile(pkg, agent);
  // Prefer local resources if present (project root via INIT_CWD)
  const projectRoot = process.env.INIT_CWD || process.cwd();
  const resourcesDir = path.join(projectRoot, "lib", "supabase");
  const localChecksumPath = path.join(resourcesDir, `${pkg.name}_${pkg.version}_checksums.txt`);
  const localTgzPath = path.join(resourcesDir, `${pkg.name}_${platform}_${arch}.tar.gz`);
  
  // First, read checksum map from local file if available; otherwise fetch
  let checksumMap;
  try {
    const checkSumContent = await fs.promises.readFile(localChecksumPath, "utf8");
    const lines = checkSumContent.split("\n");
    checksumMap = {};
    for (const line of lines) {
      const [checksum, packageName] = line.split(/\s+/);
      if (packageName) checksumMap[packageName] = checksum;
    }
    console.info("Using local checksum file", localChecksumPath);
  } catch {
    // fallback to remote checksum
    checksumMap = await fetchAndParseCheckSumFile(pkg, agent);
  }

  // Then, download the binary.
  const url = getDownloadUrl(pkg);
  console.info("Downloading", url);
  const resp = await fetch(url, { agent });
  const hash = createHash("sha256");
  const pkgNameWithPlatform = `${pkg.name}_${platform}_${arch}.tar.gz`;

  // Then, decompress the binary -- we will first Un-GZip, then we will untar.
  const ungz = zlib.createGunzip();
  const binName = path.basename(binPath);
  const untar = extract({ cwd: binDir }, [binName]);

  // Update the hash with the binary data as it's being downloaded.
  resp.body
  let sourceStream;
  let usingLocal = false;
  try {
    await fs.promises.access(localTgzPath, fs.constants.R_OK);
    usingLocal = true;
  } catch {}
  if (usingLocal) {
    console.info("Using local tgz", localTgzPath);
    sourceStream = fs.createReadStream(localTgzPath);
  } else {
    console.info("Downloading", url);
    const resp = await fetch(url, { agent });
    sourceStream = resp.body;
  }
  sourceStream
    .on("data", (chunk) => {
      hash.update(chunk);
    })
    // Pipe the data to the ungz stream.
    .pipe(ungz);

  // After the ungz stream has ended, verify the checksum.
  ungz
    .on("end", () => {
      const expectedChecksum = checksumMap?.[pkgNameWithPlatform];
      // Skip verification if we can't find the file checksum
      if (!expectedChecksum) {
        console.warn("Skipping checksum verification");
        return;
      }
      const calculatedChecksum = hash.digest("hex");
      if (calculatedChecksum !== expectedChecksum) {
        throw errChecksum;
      }
      console.info("Checksum verified.");
    })
    // Pipe the data to the untar stream.
    .pipe(untar);

  // Wait for the untar stream to finish.
  await new Promise((resolve, reject) => {
    untar.on("error", reject);
    untar.on("end", () => resolve());
  });

  // Link the binaries in postinstall to support yarn
  await binLinks({
    path: path.resolve("."),
    pkg: { ...pkg, bin: { [pkg.name]: binPath } },
  });

  console.info("Installed Supabase CLI successfully");
}

await main();

新增的这部分逻辑，会优先使用 lib/supabase 目录下的文件，如果文件不存在，则执行默认逻辑从 github 下载。

编辑完成以后，我们提交更改。

obiscr@192 my-project % pnpm patch-commit '/Users/obiscr/projects/my-project/node_modules/.pnpm_patches/supabase@2.34.3'
Lockfile is up to date, resolution step is skipped
Packages: +20
++++++++++++++++++++
Progress: resolved 0, reused 45, downloaded 0, added 20, done
node_modules/supabase: Running postinstall script, done in 236ms

这将会在项目根目录的 patches 目录下生成 supabase@2.34.3.patch 文件。

my-project
- lib/
  - supabase/
    - supabase_2.34.3_checksums.txt
    - supabase_darwin_arm64.tar.gz
- node_modules/
- patches/
  - supabase@2.34.3.patch
- src/
- package.json </FileTree>

还会在 package.json 生成 patchedDependencies 配置。

{
  "name": "my-project",
  "version": "0.1.0",
  "private": true,
  "scripts": {
    "dev": "next dev --turbo",
    "build": "next build",
    "start": "next start",
    "lint": "next lint",
    "type-check": "tsc --noEmit",
    "check-all": "npm run lint & npm run type-check & wait"
  },
  "dependencies": {
    "react": "^18",
    "react-dom": "^18",
    "next": "14.2.23",
    "@supabase/ssr": "^0.6.1",
    "@supabase/supabase-js": "^2.49.4"
  },
  "devDependencies": {
    "typescript": "^5",
    "@types/node": "^20",
    "@types/react": "^18",
    "@types/react-dom": "^18",
    "postcss": "^8",
    "supabase": "^2.34.3",
    "tailwindcss": "^3.4.1",
    "eslint": "^8",
    "eslint-config-next": "14.2.23"
  },
  "pnpm": {
    "onlyBuiltDependencies": [
      "supabase",
      "unrs-resolver"
    ],
    "peerDependencyRules": {
      "allowAny": [
        "supabase"
      ]
    }
    },
    "patchedDependencies": {
      "supabase@2.34.3": "patches/supabase@2.34.3.patch"
    }
  }
}

然后我们把 supabase@2.34.3.patch 文件移动到 lib/supabase 目录中。

此时目录结构如下：

my-project
- lib/
  - supabase/
    - supabase_2.34.3_checksums.txt
    - supabase_darwin_arm64.tar.gz
    - supabase@2.34.3.patch
- node_modules/
- patches/
  - supabase@2.34.3.patch
- src/
- package.json </FileTree>

同时我们更改 package.json 中的 patchedDependencies 配置。

{
  "name": "my-project",
  "version": "0.1.0",
  "private": true,
  "scripts": {
    "dev": "next dev --turbo",
    "build": "next build",
    "start": "next start",
    "lint": "next lint",
    "type-check": "tsc --noEmit",
    "check-all": "npm run lint & npm run type-check & wait"
  },
  "dependencies": {
    "react": "^18",
    "react-dom": "^18",
    "next": "14.2.23",
    "@supabase/ssr": "^0.6.1",
    "@supabase/supabase-js": "^2.49.4"
  },
  "devDependencies": {
    "typescript": "^5",
    "@types/node": "^20",
    "@types/react": "^18",
    "@types/react-dom": "^18",
    "postcss": "^8",
    "supabase": "^2.34.3",
    "tailwindcss": "^3.4.1",
    "eslint": "^8",
    "eslint-config-next": "14.2.23"
  },
  "pnpm": {
    "onlyBuiltDependencies": [
      "supabase",
      "unrs-resolver"
    ],
    "peerDependencyRules": {
      "allowAny": [
        "supabase"
      ]
    },
    "patchedDependencies": {
      "supabase@2.34.3": "patches/supabase@2.34.3.patch"
      "supabase@2.34.3": "lib/supabase/supabase@2.34.3.patch"
    }
  }
}

测试更改

删除 pnpm-lock.yaml, node_modules，然后运行 pnpm install ，你应该能够看到安装速度明显加快。只需要 266ms 即可完成安装。相较于之前的接近4分钟，有了非常明显的提升。

obiscr@192 my-project % pnpm install
 WARN  deprecated eslint@8.57.1: This version is no longer supported. Please see https://eslint.org/version-support for other options.
 WARN  6 deprecated subdependencies found: @humanwhocodes/config-array@0.13.0, @humanwhocodes/object-schema@2.0.3, glob@7.2.3, inflight@1.0.6, node-domexception@1.0.0, rimraf@3.0.2
Packages: +418
++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++
 WARN  Failed to create bin at /Users/obiscr/projects/my-project/node_modules/.bin/supabase. ENOENT: no such file or directory, chmod '/Users/obiscr/projects/my-project/node_modules/supabase/bin/supabase'
Progress: resolved 433, reused 402, downloaded 0, added 418, done
 WARN  Failed to create bin at /Users/obiscr/projects/my-project/node_modules/supabase/node_modules/.bin/supabase. ENOENT: no such file or directory, chmod '/Users/obiscr/projects/my-project/node_modules/supabase/bin/supabase'
node_modules/supabase: Running postinstall script, done in 266ms
Done in 1m 25.2s using pnpm v10.10.0

总结

本文介绍了如何通过 pnpm patch 命令来加速 pnpm 的 postinstall 脚本。希望对你有用。

Intellij 自适应颜色方案

本文描述了如何使 IntelliJ 中的用户界面组件的颜色适应 IDE 主题的变化。

创建一个 UI 组件

假设我们现在有一个像这样的组件

public class UIContainer extends JBPanel<UIContainer> {

    private static final EditorColorsManager editorColorsManager = EditorColorsManager.getInstance();
    private static EditorColorsScheme scheme = editorColorsManager.getGlobalScheme();
    private static final ColorKey notificationColor =  ColorKey.createColorKey("NOTIFICATION_BACKGROUND");

    public MessageComponent() {
      // TODO init some actions...

      Color color = scheme.getColor(notificationColor);
      setBackground(color)
    }
}

我们为 UIContainer 设置了一个背景颜色，它来自当前 ColorsScheme 的 NOTIFICATION_BACKGROUND，但是很明显，在这种情况下，当我们切换主题时，UIContainer 的颜色不会与主题的颜色一起切换。

UIContainer 的颜色不会在切换主题时与主题的颜色一起切换。然而，在大多数情况下，这可能会导致 UI 具有相似的颜色和字体，因此显示的内容不可见。

那么，我们如何让 UIContainer 的背景颜色随着主题的变化而自动变化呢？

适应 IDE 主题

实现接口

让 UIContainer 实现 Disposable 和 EditorColorsListener

public class UIContainer extends JBPanel<UIContainer> implements Disposable, EditorColorsListener {
    {... rest of code}
}

添加消息事件

public class UIContainer extends JBPanel<UIContainer> implements Disposable, EditorColorsListener {

    private static final EditorColorsManager editorColorsManager = EditorColorsManager.getInstance();
    private static EditorColorsScheme scheme = editorColorsManager.getGlobalScheme();
    private static final ColorKey notificationColor =  ColorKey.createColorKey("NOTIFICATION_BACKGROUND");

    public MessageComponent() {
      // TODO init some actions...

      Color color = scheme.getColor(notificationColor);
      setBackground(color)

      MessageBusConnection connection = ApplicationManager.getApplication().getMessageBus().connect(this);
      connection.subscribe(EditorColorsManager.TOPIC, this);
    }
}

实现 globalSchemeChange

当主题改变时，globalSchemeChange 方法将被调用。

currentColorsScheme 将是选定的主题，因此我们从 currentColorsScheme 中重新获得 notificationColor 并重置组件的颜色。

public class UIContainer extends JBPanel<UIContainer> implements Disposable, EditorColorsListener {

    {... rest of code}

    @Override
    public void globalSchemeChange(@Nullable EditorColorsScheme currentColorsScheme) {
        Color color = currentColorsScheme == null ? scheme.getColor(notificationColor) :
                currentColorsScheme.getColor(notificationColor);
        setBackground(color);
        revalidate();
        repaint();
    }
}

实现 dispose

public class UIContainer extends JBPanel<UIContainer> implements Disposable, EditorColorsListener {

    {... rest of code}

    @Override
    public void dispose() {
        Disposer.dispose(this);
    }
}

Finally Code

那么，最终的代码如下

public class UIContainer extends JBPanel<UIContainer> implements Disposable, EditorColorsListener {

    private static final EditorColorsManager editorColorsManager = EditorColorsManager.getInstance();
    private static EditorColorsScheme scheme = editorColorsManager.getGlobalScheme();
    private static final ColorKey notificationColor =  ColorKey.createColorKey("NOTIFICATION_BACKGROUND");

    public MessageComponent() {
      // TODO init some actions...

      Color color = scheme.getColor(notificationColor);
      setBackground(color)

      MessageBusConnection connection = ApplicationManager.getApplication().getMessageBus().connect(this);
      connection.subscribe(EditorColorsManager.TOPIC, this);
    }

    @Override
    public void globalSchemeChange(@Nullable EditorColorsScheme currentColorsScheme) {
        if (currentColorsScheme == null) {
            return;
        }
        Color color = scheme.getColor(notificationColor);
        setBackground(color);
        revalidate();
        repaint();
    }

    @Override
    public void dispose() {
        Disposer.dispose(this);
    }
}

现在当你切换主题时，组件的颜色会自动与主题的颜色一起变化。希望这对你有帮助。

IntelliJ 平台中的 Disposer

本文是一个案例研究，旨在简化 IntelliJ 平台，并介绍 IntelliJ 平台中的 Disposer。

事实上，SDK 文档已经对这一点进行了更详细的描述：Disposer 和 Disposable，在开始之前，最好先看一下这里。

场景描述

我在这里模拟了一个场景。有一个 ToolWindow 布局如下，这里我们使用 UI Inspector 来分析布局：

一个带有 BorderLayout 的 rootPanel，顶部（North）是一个 Toolbar，中心（Center）是一个 JPanel。点击 ➕ 将添加一个随机代码片段到 Center 的 JPanel。

场景如上所示，是一个非常简单的 ToolWindow，功能也非常简单。

内存泄漏

这是代码片段的关键部分：

import com.intellij.openapi.project.Project;
import com.intellij.openapi.wm.ToolWindow;
import com.intellij.openapi.wm.ToolWindowFactory;
import com.intellij.ui.content.Content;
import com.intellij.ui.content.ContentFactory;
import com.obiscr.template.dispose.MainPanel;
import org.jetbrains.annotations.NotNull;

public class MyToolWindowFactory implements ToolWindowFactory {
    @Override
    public void createToolWindowContent(@NotNull Project project, @NotNull ToolWindow toolWindow) {
        ContentFactory contentFactory = ContentFactory.getInstance();
        MainPanel panel = new MainPanel(project);
        Content content = contentFactory.createContent(panel.getComponent(), "Dispose", false);
        toolWindow.getContentManager().addContent(content);
    }
}

and

import com.intellij.icons.AllIcons;
import com.intellij.openapi.actionSystem.AnAction;
import com.intellij.openapi.actionSystem.AnActionEvent;
import com.intellij.openapi.actionSystem.DefaultActionGroup;
import com.intellij.openapi.actionSystem.impl.ActionToolbarImpl;
import com.intellij.openapi.editor.Editor;
import com.intellij.openapi.editor.EditorFactory;
import com.intellij.openapi.editor.EditorSettings;
import com.intellij.openapi.editor.colors.EditorColorsManager;
import com.intellij.openapi.editor.colors.EditorColorsScheme;
import com.intellij.openapi.editor.ex.EditorEx;
import com.intellij.openapi.editor.highlighter.EditorHighlighter;
import com.intellij.openapi.editor.highlighter.EditorHighlighterFactory;
import com.intellij.openapi.project.Project;
import com.intellij.testFramework.LightVirtualFile;
import com.intellij.ui.components.panels.VerticalLayout;
import com.intellij.util.ui.JBUI;
import com.intellij.util.ui.UIUtil;
import org.jetbrains.annotations.NotNull;

import javax.swing.*;
import java.awt.*;
import java.io.File;
import java.time.LocalDateTime;
import java.time.format.DateTimeFormatter;
import java.util.UUID;

public class MainPanel {

    private final JPanel rootPanel;
    private final JPanel centerPanel;
    private final Project myProject;


    public MainPanel(Project project) {
        myProject = project;
        rootPanel = new JPanel(new BorderLayout());
        centerPanel = new JPanel(new VerticalLayout(JBUI.scale(10)));
        centerPanel.setBorder(JBUI.Borders.empty(10));

        DefaultActionGroup actionGroup = new DefaultActionGroup();
        AnAction addAction = new AnAction(() -> "Add Item", AllIcons.General.Add) {
            @Override
            public void actionPerformed(@NotNull AnActionEvent e) {
                String text = "// Code snippet at " + LocalDateTime.now().
                format(DateTimeFormatter.ofPattern("yyyy-MM-dd")) + "\n";
                text += HelloWorld.getRandomHelloWorldCode();
                Editor editor = createEditor(myProject, text);
                centerPanel.add(editor.getComponent());
                centerPanel.revalidate();
                centerPanel.repaint();
            }
        };
        actionGroup.add(addAction);
        ActionToolbarImpl actionToolbar = new ActionToolbarImpl("MyPanelToolbar", actionGroup, true);
        actionToolbar.setTargetComponent(rootPanel);
        actionToolbar.setBorder(JBUI.Borders.customLine(UIUtil.getBoundsColor(), 1,0,1,0));
        rootPanel.add(actionToolbar, BorderLayout.NORTH);
        rootPanel.add(centerPanel, BorderLayout.CENTER);
    }

    public JPanel getComponent() {
        return rootPanel;
    }

    private Editor createEditor(Project project, String text) {
        EditorFactory editorFactory = EditorFactory.getInstance();
        EditorEx editor = (EditorEx) editorFactory.createViewer(
                editorFactory.createDocument(text),
                project);
        // Others settings
        // ...
        return editor;
    }
}

这里我们只是创建了 Editor 对象，但当程序退出时，我们没有清理它占用的内存。

当关闭 IDE 时，会显示相关异常消息（当然，这些信息也会显示在 idea.log 中）：

根据错误日志，我们可以知道这是因为创建的 Editor 对象在应用程序关闭时没有释放，存在内存溢出的风险。

解决

好的，现在我们已经知道问题所在，接下来我们解决这个问题，解决方案也很简单，只需要关闭 IDE，释放这个对象即可。

首先，让 MainPanel 实现 Disposable 接口并重写 dispose() 方法。然后，在创建 editor 后，将 Disposer 注册到父 this 中，表示 当这个对象被释放时，Editor 将被销毁。

public class MainPanel implements Disposable {
	@Override
    public void dispose() {
        centerPanel.removeAll();
        rootPanel.removeAll();
    }

    private Editor createEditor(Project project, String text) {
        EditorEx editor = ...;
        Disposer.register(this, () -> EditorFactory.getInstance().releaseEditor(editor));
        return editor;
    }
}

此外，由于在这种情况下组件都基于 Content，我们还将 MainPanel 注册为 Content 的 Disposer。

public class MyToolWindowFactory implements ToolWindowFactory {

    @Override
    public void createToolWindowContent(@NotNull Project project, @NotNull ToolWindow toolWindow) {
        MainPanel panel = new MainPanel(project);
        Content content = ...;
        content.setDisposer(panel);
        ...
    }
}

ContentImpl.java 的源代码如下，你可以看到当 content 被销毁时，它会调用 Disposer.dispose(myDisposer); 来销毁设置的 myDisposer，也就是上面的 MainPanel。

  @Override
  public void dispose() {
    if (myShouldDisposeContent && myComponent instanceof Disposable) {
      Disposer.dispose((Disposable)myComponent);
    }

    if (myDisposer != null) {
      Disposer.dispose(myDisposer);
      myDisposer = null;
    }

    myFocusRequest = null;
    clearUserData();
  }

那么现在整个过程如下：

content.dispose() --(call)--> panel.dispose() --(call)--> EditorFactory.getInstance().releaseEditor(editor);

所以，当 content 被关闭时，Editor 对象也会被销毁。

IntelliJ 插件开发

import { Aside } from '@astrojs/starlight/components';

本文介绍了插件开发相关内容，重点是如何处理遇到的...

我相信，许多插件开发者在初期会遇到很多各种困难，但这是很正常的。到目前为止，我已经开发了许多插件，在此期间也遇到了很多问题。有些还在学习，有些还在解决。如果你有类似的问题，那么这篇文章值得一读。

For myself, when it comes to problems, there are generally so many ways to deal with them as follows:

I - IntelliJ 平台

IntelliJ 平台相当于 SDK 平台文档。包括插件、基础平台、项目模型、PSI、功能、测试、资源、API 变化、工具和其他模块的文档。

II - IntelliJ 社区

IntelliJ 社区包含很多问题和答案。

III - IntelliJ 插件

IntelliJ 插件是一个包含许多 JetBrains 自己插件的 git 仓库，你可以在这里找到好的示例进行参考。

IV - IntelliJ 代码示例

IntelliJ 代码示例是一个包含许多好的示例的 git 仓库，你可以在这里找到好的示例进行参考。

V - YouTrack

YouTrack 主要用于反馈 bug，你也可以在这里搜索相关信息，当你遇到问题时。

VI - 内部模型 & 源代码

这是一个非常有用的功能。内部模式可以从这个文档中启用。内部模式与 IntelliJ 社区版源代码一起可以解决很多问题。

<Aside type="note" title="Note"> 我非常推荐使用这种方法来解决问题。使用这种方法时，你需要阅读 IntelliJ 社区版源代码，这对你养成阅读源代码的习惯非常有帮助。 </Aside>

VII - Slack

这里你可以讨论 JetBrains IDE 和 Team Tools 的插件开发，以及所有与 JetBrains Marketplace 相关的事情。这里有很多插件开发者和官方开发者，大多数问题都可以在这里解决。

总结

这些是我过去几年在开发过程中遇到的问题的解决方案。我希望它能为需要它的开发者提供参考。

JetBrains Git Client 2025.3 EAP

import { LinkCard, } from '@astrojs/starlight/components';

今天，我想分享一些非常特别的内容。最近，我很幸运地获得了 JetBrains 新 GitClient 产品的封闭预览。值得注意的是，现在应用程序渠道已经关闭，因此今天的内容相对独家。

开始视图

首先，当我们打开工具时，我们可以选择登录 Github 或 GitLab，克隆一个项目，或打开一个现有项目。

打开项目后，我们可以看到整体 UI 仍然很干净，许多不必要的工具窗口已被删除。

设置视图

另一个重要区别是插件系统消失了。这是一个很大的区别，我希望以后能添加回来。

合并视图

在代码合并方面，整体 UI 和行为基本上与 IDE 的内置 Git 工具一致。

JIT IntelliJ 基于的 Git 客户端

import { Tabs, TabItem, Card } from '@astrojs/starlight/components';

起源

大家好，我正在基于 intellij-commiunity 重新制作这个项目。只有一小部分已经完成。

我将其命名为 Jit（来自 IntelliJ Git / JetBrains Git）并绘制了新的图标。你可以像在 IntelliJ IDEA 中一样打开一个项目，Git 工具窗口将在你打开后直接出现。

这一切都始于 YouTrack 上的一个问题：Make git client a standalone app

我认为这非常有趣。JetBrains 家族产品的 Git 客户端可能是我使用过的最好的 Git 客户端。所以我计划将 Git 功能作为单独的 Git 工具维护。

总体思路

我暂时删除了整个 Editor 部分，只保留了一些相关的工具窗口：（Git / Commit / Pull Requests / Terminal / Notification）。

这是一项很大的工作，正如我之前提到的，需要处理许多模块之间的依赖关系。我工作很忙，通常只有很少的时间用于此。但说实话，我对这个很感兴趣。

更新

预览

这里有一些当前可用的预览图像。

<Tabs> <TabItem label="Welcome"> 启动后，就像 IntelliJ IDEA 一样，你可以选择一个项目来打开。

![](../../../../assets/blog/images/welcome.png)

</TabItem> <TabItem label="About"> 在 About 中，你可以看到基本信息。名称和图标已经在这里更改。

![](../../../../assets/blog/images/about.png)

</TabItem> <TabItem label="Git"> Git 工具窗口显示有关存储库、分支和提交的基本信息，你可以通过选择提交来查看文件更改的详细信息。

![](../../../../assets/blog/images/git-view.png)

</TabItem> <TabItem label="Commit"> 在 Commit 工具窗口中，你可以看到要提交的文件并输入提交信息。

![](../../../../assets/blog/images/commit-view.png)

</TabItem> <TabItem label="Terminal"> 它还保留了终端工具窗口，你可以使用 git 命令进行更复杂的操作或其他基本操作。

![](../../../../assets/blog/images/terminal.png)

</TabItem> <TabItem label="Pull Requests"> 在 Pull Request 工具窗口中，你可以看到存储库的当前合并请求。

![](../../../../assets/blog/images/pull-requests.png)

</TabItem> <TabItem label="Notification"> 通知也保留了更好的交互体验。

![](../../../../assets/blog/images/notification.png)

</TabItem> </Tabs>

Next.js Stripe Supabase Starter - 一个完整的电子商务演示

import { Steps, Card, FileTree, Tabs, TabItem, LinkCard, CardGrid, } from '@astrojs/starlight/components';

特性

用户身份验证：使用 Supabase Auth 的电子邮件/密码登录
3 个产品类别：高级会员、云存储和 API 访问
多种定价选项：一次性支付和订阅
Stripe Checkout 集成：安全的托管支付页面
数据库集成：Supabase 用于用户数据和购买记录
Webhook 处理：自动支付确认和数据库更新
购买跟踪：从数据库获取实时购买状态
响应式设计：移动友好界面
TypeScript：完整的类型安全

技术栈

前端：Next.js 15 (App Router)
数据库：Supabase (PostgreSQL)
身份验证：Supabase Auth
支付：Stripe Checkout
样式：Tailwind CSS
语言：TypeScript
部署：Vercel (推荐)

产品结构

完整设置指南

按照以下步骤从零开始设置项目：

步骤 1：克隆并安装依赖项

# 克隆仓库
git clone https://github.com/obiscr/nextjs-stripe-supabase-starter.git
cd nextjs-stripe-supabase-starter

# 安装依赖
npm install

步骤 2：创建 .env.local 文件

在根目录下创建一个 .env.local 文件。

nextjs-stripe-supabase-starter
- src/
- .env.local create this file
- ... </FileTree>

步骤 3：创建 Supabase 账户

<Steps>

前往 Supabase 并创建一个免费账户
创建一个组织和一个新项目

前往 项目概览

将 Project URL / API Key 复制到 .env.local 文件中

# Supabase 密钥 (从 Supabase 项目仪表板 > 项目设置 > API 密钥获取)
NEXT_PUBLIC_SUPABASE_URL=https://your-project-id.supabase.co
NEXT_PUBLIC_SUPABASE_ANON_KEY=your-anon-key-here

前往 项目设置 > API 密钥

前往 项目设置 > API 密钥 将 service_role 密钥复制到 .env.local 文件中

# Supabase 密钥 (从 Supabase 项目仪表板 > 项目设置 > API 密钥获取)
NEXT_PUBLIC_SUPABASE_URL=https://your-project-id.supabase.co
NEXT_PUBLIC_SUPABASE_ANON_KEY=your-anon-key-here
SUPABASE_SERVICE_ROLE_KEY=your-service-role-key-here

<Card title="Note" icon="threads" > 请保持 SERVICE_ROLE_KEY 私密，不要与任何人分享。 </Card> </Steps>

步骤 4：创建 Stripe 账户

<Steps>

前往 Stripe 并创建一个免费账户
完成账户设置流程
前往 Stripe 仪表板
导航到 开发者 > API 密钥

复制密钥

将你的 发布密钥 和 秘密密钥 (用于开发) 复制到 .env.local 文件中

# Stripe 密钥
NEXT_PUBLIC_STRIPE_PUBLISHABLE_KEY=pk_test_your_publishable_key_here
STRIPE_SECRET_KEY=sk_test_your_secret_key_here

</Steps>

步骤 5：设置 Stripe Webhook 端点

<Tabs> <TabItem label="Local Dev"> 由于本地开发，Stripe 的 Webhook 无法直接访问，因此你需要使用 Stripe CLI 来监听 Webhook。打开终端并运行本地监听器。

```bash
> stripe listen --forward-to localhost:3000/api/webhooks/stripe
A newer version of the Stripe CLI is available, please update to: v1.28.0
> Ready! You are using Stripe API Version [2022-08-01]. Your webhook signing secret is whsec_xxxxx (^C to quit)
```

你将在终端中看到 Webhook 签名密钥。将其复制到 *.env.local* 文件中。

```bash collapse={2-3} ins={4}
# 从 Stripe 仪表板获取: https://dashboard.stripe.com/apikeys
NEXT_PUBLIC_STRIPE_PUBLISHABLE_KEY=pk_test_your_publishable_key_here
STRIPE_SECRET_KEY=sk_test_your_secret_key_here
STRIPE_WEBHOOK_SECRET=whsec_xxxxx
```

</TabItem> <TabItem label="Production"> 打开 Stripe 仪表板并导航到 开发者 > Webhook，创建一个新的 Webhook。

**API 版本**: 2025.06-30.basil

**事件**: 确保你选择了以下事件。

<FileTree>
  - Checkout
    - checkout.session.completed
  - Payment&Intent
    - payment_intent.succeeded
    - payment_intent.payment_failed
  - Product
    - product.created
    - product.updated
    - product.deleted
  - Price
    - price.created
    - price.updated
    - price.deleted
</FileTree>

完成设置步骤。打开 Webhook URL 并复制签名密钥 **whsec_xxxxx** 到 *.env.local* 文件中。

```bash collapse={2-3} ins={4}
# 从 Stripe 仪表板获取: https://dashboard.stripe.com/apikeys
NEXT_PUBLIC_STRIPE_PUBLISHABLE_KEY=pk_test_your_publishable_key_here
STRIPE_SECRET_KEY=sk_test_your_secret_key_here
STRIPE_WEBHOOK_SECRET=whsec_xxxxx
```

</TabItem> </Tabs>

步骤 6：初始化 Supabase

<Steps>

> npx supabase login
你好，Supabase！按 Enter 打开浏览器并自动登录。

这是你的登录链接，如果浏览器没有打开 https://supabase.com/dashboard/cli/login?session_id=uuid&token_name=cli_@hostname&public_key=string

Enter your verification code: c4d28d97
Token cli_@hostname created successfully.

You are now logged in. Happy coding!

初始化 Supabase

> npx supabase init
Generate VS Code settings for Deno? [y/N] N
Generate IntelliJ Settings for Deno? [y/N] N
Finished supabase init.

链接到你的 Supabase 项目

> npx supabase link --project-ref your-project-id
输入你的数据库密码 (或留空跳过): // 输入你的数据库密码
Connecting to remote database...
NOTICE (42P06): schema "supabase_migrations" already exists, skipping
Finished supabase link.
WARNING: Local config differs from linked project. Try updating supabase/config.toml
diff supabase/config.toml your-project-id
--- supabase/config.toml
+++ your-project-id
@@ -54,8 +54,8 @@

[auth]
enabled = true
-site_url = "http://127.0.0.1:3000"
-additional_redirect_urls = ["https://127.0.0.1:3000"]
+site_url = "http://localhost:3000"
+additional_redirect_urls = []
jwt_expiry = 3600
enable_refresh_token_rotation = true
refresh_token_reuse_interval = 10
@@ -96,9 +96,9 @@
[auth.email]
enable_signup = true
double_confirm_changes = true
-enable_confirmations = false
+enable_confirmations = true
secure_password_change = false
-max_frequency = "1s"
+max_frequency = "1m0s"
otp_length = 6
otp_expiry = 3600
[auth.email.template]

应用迁移

> npx supabase db push
Connecting to remote database...
你想将这些迁移推送到远程数据库吗？
• 20250710080949_init.sql

[Y/n] Y
NOTICE (42P06): schema "supabase_migrations" already exists, skipping
NOTICE (42P07): relation "schema_migrations" already exists, skipping
NOTICE (42701): column "statements" of relation "schema_migrations" already exists, skipping
NOTICE (42701): column "name" of relation "schema_migrations" already exists, skipping
Applying migration 20250710080949_init.sql...
NOTICE (42710): extension "uuid-ossp" already exists, skipping
Finished supabase db push.

</Steps>

步骤 7：初始化 Stripe 产品

运行自动化脚本来创建产品和服务在你的 Stripe 账户中：

> npm run stripe:init

# 你将看到以下输出。

> nextjs-stripe-app@0.1.0 stripe:init
> ts-node scripts/stripe-init.ts

(node:76080) ExperimentalWarning: Type Stripping is an experimental feature and might change at any time
(Use `node --trace-warnings ...` to show where the warning was created)
(node:76080) [MODULE_TYPELESS_PACKAGE_JSON] Warning: Module type of file:///Users/obiscr/projects/nextjs-stripe-supabase-starter/scripts/stripe-init.ts is not specified and it doesn't parse as CommonJS.
Reparsing as ES module because module syntax was detected. This incurs a performance overhead.
To eliminate this warning, add "type": "module" to /Users/obiscr/projects/nextjs-stripe-supabase-starter/package.json.
[dotenv@17.2.0] injecting env (7) from .env.local (tip: ⚙️  load multiple .env files with { path: ['.env.local', '.env'] })
🚀 Starting Stripe initialization...


📋 Processing product: Premium Membership
──────────────────────────────────────────────────
📦 Creating product: Premium Membership
✅ Product created: ************** - Premium Membership
💰 Creating price: Premium Monthly - $29.99
✅ Price created: ************** - Premium Monthly
💰 Creating price: Premium Yearly - $99.99
✅ Price created: ************** - Premium Yearly
💰 Creating price: Premium Lifetime - $199.99
✅ Price created: ************** - Premium Lifetime
✨ Completed Premium Membership with 3 prices

📋 Processing product: Cloud Storage
──────────────────────────────────────────────────
📦 Creating product: Cloud Storage
✅ Product created: ************** - Cloud Storage
💰 Creating price: 50GB Storage - $9.99
✅ Price created: ************** - 50GB Storage
💰 Creating price: 100GB Storage - $19.99
✅ Price created: ************** - 100GB Storage
💰 Creating price: 500GB Storage - $49.99
✅ Price created: ************** - 500GB Storage
✨ Completed Cloud Storage with 3 prices

📋 Processing product: API Access
──────────────────────────────────────────────────
📦 Creating product: API Access
✅ Product created: ************** - API Access
💰 Creating price: Basic API - $19.99
✅ Price created: ************** - Basic API
💰 Creating price: Pro API - $49.99
✅ Price created: ************** - Pro API
💰 Creating price: Enterprise API - $99.99
✅ Price created: ************** - Enterprise API
✨ Completed API Access with 3 prices

🎉 Stripe initialization completed successfully!

📊 Summary:
────────────────────────────────────────────────────────────

🏷️  Premium Membership (**************)
   💰 Premium Monthly: ************** - $29.99
   💰 Premium Yearly: ************** - $99.99
   💰 Premium Lifetime: ************** - $199.99

🏷️  Cloud Storage (**************)
   💰 50GB Storage: ************** - $9.99
   💰 100GB Storage: ************** - $19.99
   💰 500GB Storage: ************** - $49.99

🏷️  API Access (**************)
   💰 Basic API: ************** - $19.99
   💰 Pro API: ************** - $49.99
   💰 Enterprise API: ************** - $99.99

✅ You can now run your application and see the products!
🔗 Stripe Dashboard: https://dashboard.stripe.com/products

这将创建配置中定义的所有产品和价格。你可以在 Stripe 仪表板中查看它们。

此时，你可以在 Stripe Webhook 仪表板中看到 Webhook 触发器。

A newer version of the Stripe CLI is available, please update to: v1.28.0
> Ready! You are using Stripe API Version [2022-08-01]. Your webhook signing secret is whsec_xxxxx (^C to quit)
2025-07-10 21:44:51   --> product.created [evt_******************]
2025-07-10 21:44:52   --> plan.created [evt_******************]
2025-07-10 21:44:52  <--  [200] POST http://localhost:3000/api/webhooks/stripe [evt_******************]
2025-07-10 21:44:52   --> price.created [evt_******************]
2025-07-10 21:44:53  <--  [200] POST http://localhost:3000/api/webhooks/stripe [evt_******************]
2025-07-10 21:44:53   --> plan.created [evt_******************]
2025-07-10 21:44:53  <--  [200] POST http://localhost:3000/api/webhooks/stripe [evt_******************]
2025-07-10 21:44:53   --> price.created [evt_******************]
2025-07-10 21:44:54  <--  [200] POST http://localhost:3000/api/webhooks/stripe [evt_******************]
2025-07-10 21:44:54   --> price.created [evt_******************]
2025-07-10 21:44:54  <--  [200] POST http://localhost:3000/api/webhooks/stripe [evt_******************]
2025-07-10 21:44:54   --> product.created [evt_******************]
2025-07-10 21:44:54  <--  [200] POST http://localhost:3000/api/webhooks/stripe [evt_******************]
2025-07-10 21:44:55  <--  [200] POST http://localhost:3000/api/webhooks/stripe [evt_******************]
2025-07-10 21:44:55   --> price.created [evt_******************]
2025-07-10 21:44:56  <--  [200] POST http://localhost:3000/api/webhooks/stripe [evt_******************]
2025-07-10 21:44:56   --> price.created [evt_******************]
2025-07-10 21:44:57   --> price.created [evt_******************]
2025-07-10 21:44:57  <--  [200] POST http://localhost:3000/api/webhooks/stripe [evt_******************]
2025-07-10 21:44:58   --> product.created [evt_******************]
2025-07-10 21:44:58  <--  [200] POST http://localhost:3000/api/webhooks/stripe [evt_******************]
2025-07-10 21:44:58  <--  [200] POST http://localhost:3000/api/webhooks/stripe [evt_******************]
2025-07-10 21:44:58   --> price.created [evt_******************]
2025-07-10 21:44:59   --> price.created [evt_******************]
2025-07-10 21:44:59  <--  [200] POST http://localhost:3000/api/webhooks/stripe [evt_******************]
2025-07-10 21:45:00   --> price.created [evt_******************]
2025-07-10 21:45:00  <--  [200] POST http://localhost:3000/api/webhooks/stripe [evt_******************]
2025-07-10 21:45:01  <--  [200] POST http://localhost:3000/api/webhooks/stripe [evt_******************]

If everything goes well, you will see the product and product item data in supabase.

步骤 8：生成数据类型

> npm run supabase:gen-types

> nextjs-stripe-app@0.1.0 supabase:gen-types
> supabase gen types typescript --linked > lib/database.types.ts

步骤 9：启动开发服务器

npm run dev

在浏览器中打开 http://localhost:3000。

完成完整的购买流程

<Steps>

注册新用户
- 点击 "登录" 按钮,
- 切换到 "注册" 标签
- 使用电子邮件和密码创建一个新帐户
浏览产品
- 查看 3 个产品类别
- 每个产品有多个定价层
进行测试购买
- 点击任何产品上的 "立即购买"
- 你将被重定向到 Stripe Checkout
- 使用测试卡号: 4242 4242 4242 4242
- 使用任何未来的到期日期和 CVC
- 完成支付
支付成功
- 你将被重定向到成功页面
验证购买
- 返回主页
- 购买的商品应显示 "已购买" 状态
</Steps>

总结

这是一个使用 Stripe 和 Supabase 的简单示例。你可以使用它作为你自己的项目的起点。

你可以在以下位置找到源代码：

使用 ProGuard 混淆你的插件

import { Aside } from '@astrojs/starlight/components';

插件混淆已经在官方文档中详细描述，请参阅：obfuscate the plugin

所以，本文将向你展示一个逐步演示，使用 ProGuard 混淆你的插件，从真实示例开始。

要查看比较文件，ProGuard 混淆的关键代码已添加到此 commit，所有代码都在此 repository 中。

添加 ProGuard

在 build.gradle.kts 中，添加 buildscript 节点以导入 proguard 依赖项

buildscript {
    repositories {
        maven {
            setUrl("https://maven.aliyun.com/repository/public/")
            setUrl("https://maven.aliyun.com/nexus/content/groups/public/")
            setUrl("https://plugins.gradle.org/m2/")
            setUrl("https://oss.sonatype.org/content/repositories/snapshots/")
        }
        mavenCentral()
        gradlePluginPortal()
    }

    dependencies {
        classpath("com.guardsquare:proguard-gradle:7.3.2")
    }
}

配置 ProGuard

在 build.gradle.kts 中注册一个新 task：

    // Register a new task, task name is "proguard"
    register<proguard.gradle.ProGuardTask>("proguard") {
        dependsOn(instrumentedJar)
        verbose()

        val javaHome = System.getProperty("java.home")
        File("$javaHome/jmods/").listFiles()!!.forEach { libraryjars(it.absolutePath)}

        // Use the jar task output as a input jar. This will automatically add the necessary task dependency.
        injars("build/libs/instrumented-${properties("pluginName")}-${properties("pluginVersion")}.jar")
        outjars("build/obfuscated/output/instrumented-${properties("pluginName")}-${properties("pluginVersion")}.jar")


        libraryjars(configurations.compileClasspath.get())

        dontshrink()
        dontoptimize()

        adaptclassstrings("**.xml")
        adaptresourcefilecontents("**.xml")

        // Allow methods with the same signature, except for the return type,
        // to get the same obfuscation name.
        overloadaggressively()

        // Put all obfuscated classes into the nameless root package.
        repackageclasses("")
        dontwarn()

        printmapping("build/obfuscated/output/${properties("pluginName")}-${properties("pluginVersion")}-ProGuard-ChangeLog.txt")

        target(properties("pluginVersion"))

        adaptresourcefilenames()
        optimizationpasses(9)
        allowaccessmodification()

        keepattributes("Exceptions,InnerClasses,Signature,Deprecated,SourceFile,LineNumberTable,*Annotation*,EnclosingMethod")

        keep("""
            class * implements com.intellij.openapi.components.PersistentStateComponent {*;}
             """.trimIndent()
        )

        keepclassmembers("""
            class * {public static ** INSTANCE;}
             """.trimIndent()
        )
        keep("class com.intellij.util.* {*;}")
    }


    prepareSandbox {
        if (properties("enableProGuard").toBoolean()) {
            dependsOn("proguard")
            pluginJar.set(File("build/obfuscated/output/instrumented-${properties("pluginName")}-${properties("pluginVersion")}.jar"))
        }
    }

<Aside type="note" title="Note"> 这些是 ProGuard 的语法，更多规则请参阅：Official ProGuard Documentation，我们重点关注最后两个 keep 和 keepclassmembers。 </Aside>

构建测试

配置完成后，运行插件，调试消息如下：

21:40:12: Executing 'runIde'...

Starting Gradle Daemon...
Connected to the target VM, address: '127.0.0.1:12563', transport: 'socket'
Gradle Daemon started in 915 ms
> Task :initializeIntelliJPlugin
> Task :patchPluginXml UP-TO-DATE

> Task :verifyPluginConfiguration
[gradle-intellij-plugin :verifyPluginConfiguration] The following plugin configuration issues were found:
- The Java configuration specifies sourceCompatibility=11 but IntelliJ Platform 2022.3.3 requires sourceCompatibility=17.
See: https://jb.gg/intellij-platform-versions

> Task :compileKotlin NO-SOURCE
> Task :compileJava UP-TO-DATE
> Task :processResources UP-TO-DATE
> Task :classes UP-TO-DATE
> Task :setupInstrumentCode
> Task :instrumentCode UP-TO-DATE
> Task :jar UP-TO-DATE
> Task :inspectClassesForKotlinIC UP-TO-DATE
> Task :instrumentedJar UP-TO-DATE
> Task :proguard <=== proguard task 已经成功执行。
> Task :prepareSandbox
Disconnected from the target VM, address: '127.0.0.1:12563', transport: 'socket'
Connected to the target VM, address: 'localhost:12616', transport: 'socket'

混淆结果

混淆后：

左侧是文件名已混淆，右侧是文件类名、方法名和变量名已混淆。

<Aside type="note" title="Note"> 这只是非常基本的混淆效果，如果你需要更复杂的混淆，可以参考上面提到的 ProGuard 官方文档。 </Aside>

特殊情况

在 IntelliJ 插件项目中，有一些文件不需要混淆。本演示中列出了两个案例。

通过反射调用

项目中的一个文件是 MyDefaultFileType.java。这个文件添加了一个新的文件类型，我们称之为 J-file，具有 *.j 或 *.J 文件扩展名。

这个文件已经在 plugin.xml 中注册

<extensions defaultExtensionNs="com.intellij">
    ...
    <fileType name="MyNativeFile" implementationClass="com.obiscr.template.MyDefaultFileType" fieldName="INSTANCE"
              extensions="j;J" order="first"/>
    ...
</extensions>

关键点是 fieldName 属性：INSTANCE，它对应于 MyDefaultFileType.java 中的 INSTANCE。换句话说，它们必须相同。否则，当反射调用时，属性将找不到。

例如，一旦我们删除了 proguard task 的

    register<proguard.gradle.ProGuardTask>("proguard") {
        ...

        // keepclassmembers("""
        //     class * {public static ** INSTANCE;}
        //      """.trimIndent()
        // )
        ...
    }

运行插件并获取错误：

2023-09-24 21:31:18,647 [   3018]   WARN - #c.i.e.RunManager - Must be not called before project components initialized
Info  | RdCoroutineScope          | 53:DefaultDispatcher-worker-35 | RdCoroutineHost overridden
2023-09-24 21:31:21,580 [   5951] SEVERE - #c.i.o.f.i.FileTypeManagerImpl - INSTANCE
java.lang.NoSuchFieldException: INSTANCE
    at java.base/java.lang.Class.getDeclaredField(Class.java:2610)
    at com.intellij.openapi.fileTypes.impl.FileTypeManagerImpl.instantiateFileTypeBean(FileTypeManagerImpl.java:492)
    at com.intellij.openapi.fileTypes.impl.FileTypeManagerImpl.mergeOrInstantiateFileTypeBean(FileTypeManagerImpl.java:463)

这表明 INSTANCE 属性找不到。因此，对于这种情况，你可以使用 proguard 的 keepclassmembers 来保持 INSTANCE 属性在所有类中不被混淆。当然，如果你愿意，你也可以保持 INSTANCE 在所有实现 INativeFileType 的类中不被混淆。这是一种更精确的控制。

你可能想知道，既然这个问题可以通过在 plugin.xml 中将 fieldName 与 MyDefaultFileType.java 中的 INSTANCE 保持相同来避免，为什么不通过将它改为相同的值来避免这个问题？

是的，这在原则上是可以的。然而，混淆每次都会生成一个随机变量名。也就是说，属性 fieldName 必须首先被指定为某个确切的值，然后开始打包，在打包后的类文件中，INSTANCE 不一定是上面指定的值。因此，我们仍然需要从混淆规则中排除 INSTANCE 以避免这个问题。

本地数据存储

在许多情况下，需要存储一些本地数据，例如设置数据、环境数据等。在这种情况下，你需要使用 @State 来指定一个文件来存储数据。在这种情况下，你需要使用 @State 来指定存储文件。例如，

package com.obiscr.template;

import com.intellij.openapi.components.*;
import com.intellij.openapi.project.Project;
import com.intellij.util.xmlb.XmlSerializerUtil;
import org.jetbrains.annotations.NotNull;
import org.jetbrains.annotations.Nullable;

@State( name = "com.obiscr.template.MyState", storages = @Storage("my-state/state.xml"))
public class MyState implements PersistentStateComponent<MyState> {
    public String currentVersion = "";
    public Boolean enableFeature = true;
    public String myCustomKey = "";

    public static MyState getInstance(@NotNull Project project) {
        return project.getService(MyState.class);
    }

    @Nullable
    @Override
    public MyState getState() {
        return this;
    }

    @Override
    public void loadState(@NotNull MyState state) {
        XmlSerializerUtil.copyBean(state, this);
    }

}

这里定义了一个存储文件和一些属性，它将在项目 .idea 目录的 my-state 目录中创建一个新 state.xml 文件，内容如下

<?xml version="1.0" encoding="UTF-8"?>
<project version="4">
  <component name="com.obiscr.template.MyState">
    <option name="currentVersion" value="v1.0.1" />
    <option name="enableFeature" value="false" />
    <option name="myCustomKey" value="value" />
  </component>
</project>

同样，这里的 option 中的 name 属性对应于 MyState.java 中的三个属性。这些属性不应该被混淆；如果它们被混淆，原始数据将不会被读取。例如，如果你设置：

currentVersion： v1.0.1
enableFeature：false
myCustomKey：value

混淆后，假设 MyState.java 中有以下属性：

currentVersion -> a
enableFeature -> d
myCustomKey -> c

state.xml 中的数据无法读取。因为 option 中没有 name 是：a, d, c 的数据，所以最终读取出的值是 MyState.java 中定义的默认值，一旦这个值发生变化，将在 xml 中再次添加一个新属性。name 是混淆后的变量名。

现在 currentVersion 已经被混淆为 a，所以如果 currentVersion 的值发生变化，将其更改为 v1.0.2，那么 state.xml 将如下所示

<?xml version="1.0" encoding="UTF-8"?>
<project version="4">
  <component name="com.obiscr.template.MyState">
    <option name="currentVersion" value="v1.0.1" />
    <option name="enableFeature" value="false" />
    <option name="myCustomKey" value="value" />
    <!-- Added -->
    <option name="a" value="v1.0.2" />
  </component>
</project>

将添加一个 <option name="a" value="v1.0.2" />。因此，只要混淆后的变量名不同，它就会继续添加。所以这里有一个解决方法：

    register<proguard.gradle.ProGuardTask>("proguard") {
        ...

        keep("""
            class * implements com.intellij.openapi.components.PersistentStateComponent {*;}
             """.trimIndent()
        )
        ...
    }

这个规则忽略所有实现 PersistentStateComponent 的类。

总结

本文简要介绍了如何使用 ProGuard 混淆 IntlliJ 插件并将其集成到 gradle 任务中。

实际上，我更喜欢称之为一个框架。具体的混淆规则需要根据你自己的项目进行定制。我希望它能帮助你。

免责声明

这只是一个研究项目，请根据你自己的项目使用。

我不会对使用这种混淆方案造成的任何损害负责。

有用的链接

ResoLine App - 你的专业屏幕分辨率助手工具

import { LinkCard } from '@astrojs/starlight/components';

ResoLine 是一个专业的屏幕分辨率助手工具，帮助你直观地预览和比较屏幕上不同分辨率的实际显示效果。

安装 ResoLine

Features

Localization

目前支持简体中文和英文。

自定义外观

你可以自定义：

对于线条：线条类型 / 颜色 / 厚度。
对于预览文本：字体颜色 / 背景颜色 / 透明度。

自定义分辨率

系统已经有一些常见的分辨率内置，你也可以根据需要添加自定义分辨率。

账号	使用额度
q*******@b*.com	17.3866
t*******@j*.com	16.89172
l*******@z*.com	16.8178
f*******@e*.com	16.6888
x*******@d*.com	16.68422
v*******@s*.com	16.63994
a*******@f*.com	16.52996
4*******@e*.com	16.5265
p*******@e*.com	16.49332
-@c**.com	16.30722
w*******@d*.com	16.29588
a*******@d*.com	16.0017
s*******@f*.com	15.82358
-@b**.com	10.73738
b*******@s*.com	7.83864
t*******@v*.com	7.42252
s*******@d*.com	7.29326
v*******@d*.com	7.17466
v*******@h*.com	7.17252
9*******@n*.com	7.17116
2*******@a*.com	7.0543
y*******@p*.com	0
1*******@b*.com	0
p*******@f*.com	0

OBISCR's Blog

在线64卦变换表

绘制SVG图标

原理说明

像素计算

代码实现

国内首个AIGC黑客马拉松

赛事介绍

更多详情

关注思否

参与

易经的变卦

本卦

错卦（覆卦）

综卦

变卦（之卦）

互卦

反卦（游卦）

对卦

卦宫

归魂卦

别卦

How to build manimgl from source on macOS

Download source code

Creating an environment

Install libraries

mapbox-earcut

ffmpeg

mactex

Verify mactex installation

Build from source

Verify manimgl installation

Use manimgl

Additional

Build Your Own Remote Dev Environment Based on VSCode

Build VSCode

Download VSCode Source Code

Install Dependencies

Compile VSCode

Build Docker Image

Create Build Script

Push Image to Dockerhub

Deploy to Fly.io

Login Fly.io

Configure Token

Create App

Create Volume

Create fly.toml file

Access VSCode Web

ChatGPT插件全球首发

预览

安装

兼容的版本

相关链接

ExcelReader reaches 1 million downloads

What's ExcelReader

Why this project

Some interesting history

Conclusion

解决 intellij 插件构建时 gradle 下载缓慢的问题

下载 IDE

下载发行版

下载发行版源码包

相关工具

How to give developers feedback

How to give developers feedback

An error occurs

Try contacting the author

Providing necessary information

How to find idea.log

More complex situations

Summarize

How to speed up pnpm postinstall

Problem description

Solution

Test changes

Conclusion

Intellij Adaptive Color Scheme

Create a UI Component

Adaptive to IDE theme