code-box: a browser extension for copying code and downloading articles from CSDN, Zhihu, Juejin and similar sites

The problem code-box targets: login walls and copy buttons that do not work

Chinese developer content sites commonly gate reading and copying behind an account. The README lists the exact behaviours code-box removes: on CSDN, an unlogged-in visitor gets a forced login popup, a "follow the author to read the rest" prompt, a VIP prompt, and code blocks whose copy button only works after login. Zhihu shows "expand to read the full text" behind a login. 51CTO, php中文网, 脚本之家 and 简书 have variants of the same pattern, plus mobile redirects into a native app. code-box is for people who read those sites daily and want the article body and its code samples without creating accounts on each one. It is not for scraping arbitrary websites; the README names a fixed set of hosts, and the extension is built around their page structures.

How the Plasmo extension is put together

The repository is a Plasmo project. package.json declares plasmo 0.90.5 as a dependency and the scripts wrap plasmo dev and plasmo build, so the extension is generated from the Plasmo manifest pipeline rather than a hand-written manifest.json. The top-level directories map to extension surfaces: background/ for the service worker, contents/ for content scripts injected into the supported sites, popup/ and sidepanel/ for the UI, options/ for settings, tabs/ for tab pages, and locales/ for the __MSG_extensionName__ and __MSG_extensionDescription__ placeholders used in the manifest. The default_locale is en. Rendering uses React 19.2.3 with antd 6.1.2. Article conversion to Markdown goes through @joplin/turndown and @joplin/turndown-plugin-gfm, which are the Joplin forks of Turndown with GitHub Flavored Markdown support, so tables and fenced code survive the conversion. PDF and image capture use html2canvas, file saving uses file-saver, and zipping uses jszip. Storage is @plasmohq/storage and cross-context messaging is @plasmohq/messaging. The manifest permissions visible in package.json include activeTab and downloads, which is consistent with a tool that reads the current page and writes files to disk.

Installing code-box and running a first export

The README recommends the extension stores and lists Chrome, Edge, 360 Browser and Firefox. Search for codebox in the store you use, or follow the direct store links in the README: the Chrome listing ID is acnnhjllgegbndgknlliobjlekgilbdf, the Edge listing is cfpdbfmncaampihkmejogihjkenkonbn, and the Firefox add-on is published as code-box on addons.mozilla.org. The README also offers a WeChat public account download path and a source build. For the source build, clone the repository and use pnpm, not npm:

 git clone https://github.com/027xiguapi/code-box.git
 pnpm install
 pnpm dev
 pnpm build

pnpm dev starts the Plasmo development build with hot reload; pnpm build produces the packaged extension and a zip. Note the build:firefox script uses --target=firefox-mv3, so the Firefox artifact is Manifest V3, not the older MV2 format. To load the development build, open chrome://extensions, enable developer mode, and load the unpacked folder that Plasmo generates. Once installed, open a supported article, for example any CSDN blog post, and the README states that an unlogged-in user can select code directly or use the copy button in the top-right corner of the code block. The article download actions (HTML, Markdown, PDF) are exposed from the extension UI, and the options page has fields for custom CSS, downloading all images, and choosing the export format. The README does not document what the generated Markdown filename looks like or where the file lands beyond the browser's normal download behaviour.

Where code-box breaks or is the wrong tool

The most obvious limitation is scope. The README enumerates CSDN, Zhihu, 脚本之家, 博客园, 51CTO博客, php中文网, 掘金, 微信, 百度 and 简书. Anything outside that list is not covered, and there is no documented way to add a site without writing code. Because the features depend on each site's DOM, they are also fragile by construction: a layout change on CSDN or Zhihu can break the code-copy button or the login-wall removal until the selectors are updated. The README does not describe a fallback path when a selector fails, and the repository has no retrieved releases, so there is no changelog to check for selector fixes. Two more constraints matter in practice. First, the permissions in package.json include activeTab and downloads, and an extension that reads page content and saves files needs that access; the privacy policy is a separate web page, not part of the README. Second, the licence is GPL-3.0, which matters if you fork it. Finally, the README does not document rollback, uninstall behaviour, or how the extension behaves on pages that mix multiple supported hosts, so those are unknowns rather than stated guarantees.

code-box versus userscripts and general-purpose clippers

The realistic alternatives are userscripts and general web clippers. The README's own reference list points at userscripts: a Greasy Fork script for exporting WeChat public account articles to PDF, and another for downloading WeChat article images. Those are single-purpose scripts installed in a userscript manager such as Tampermonkey, and they run only where their @match rules say. code-box takes the opposite approach: one extension, one install, many hosts, with shared settings for CSS injection and export format. The cost of that approach is the manifest permission set and the store review process, which a userscript avoids. A general clipper such as a web-to-Markdown extension goes the other way again: it works on any page but does nothing about login walls or site-specific copy buttons, which is precisely the part code-box exists to handle. If your problem is "I want this page as Markdown", a generic clipper is enough. If your problem is "CSDN will not let me copy this snippet without logging in", code-box is aimed at that.

Maintenance, licence and upgrade cost

The last push to the repository was on 2026-05-11. The repository is not archived. The declared version in package.json is 2.0.2, and the build scripts pin plasmo to 0.90.5 and React to 19.2.3, so upgrading means moving those pins and re-testing the content scripts against every supported host. That is the real maintenance cost: the extension has no server component that would let you fix a broken selector remotely, so a site redesign requires a new build and a new store submission. On licensing, code-box is GPL-3.0 and the repository carries a COPYING file. If you redistribute a modified build, GPL-3.0 obligations attach to the derivative work; if you only install the published extension, that is not a redistribution. This is a description of the licence, not legal advice, and the store listings may impose additional terms of their own.

Editorial conclusion

Adopt code-box if you regularly read CSDN, Zhihu, Juejin, 51CTO, php中文网, 脚本之家, 博客园, 简书 or WeChat articles and want code copying and offline exports without logging in. Skip it if you need a general-purpose clipper for arbitrary sites, or if you cannot accept a GPL-3.0 derivative work and a host-permission extension. Before installing, check the manifest permissions in package.json, confirm the store listing matches version 2.0.2, and read the privacy policy at 027xiguapi.github.io/code-box/privacy-policy.html, since the README does not describe what data leaves the browser.

Frequently asked questions

Official sources

1. 027xiguapi/code-box on GitHub
2. Issues
3. License: GPL-3.0
4. Project website
5. README