前端路上

Claude Code + OpenSpec：让 AI 编码更可控的规范驱动开发

2025-12-18T08:30:00.000Z

用 Claude Code 写代码久了，你可能会遇到这样的场景：一个需求聊着聊着就跑偏了，AI 理解的和你想要的总是差那么一点；或者一个复杂功能做到一半，上下文丢了，AI 又要重新理解一遍。

这种时候，你需要的不是更强的 AI，而是一套能让 AI “按规矩办事”的方法。OpenSpec 就是干这个的。

OpenSpec 是什么

OpenSpec：让 AI 编程从碰运气到有章可循

2025-01-04T08:00:00.000Z

用 AI 写代码久了，你可能会遇到这些场景：

和 AI 反复拉扯，修改了 N 遍还是不对
明明上次说好的规范，新会话又忘了
代码改完不敢合并，因为不知道到底改了啥
几个人一起用 AI 开发，结果代码风格完全不统一

如果这些问题你都遇到过，说明你不是一个人。这篇文章想聊聊为什么会这样，以及如何用 OpenSpec 来解决这些问题。

Node.js开发必看系列之-如何在ES模块中正确使用dirname和filename

2024-05-26T07:38:02.000Z

引言

在Node.js中，__dirname是一个非常有用的全局变量，它返回当前正在执行的脚本所在的目录名。然而，随着Node.js对ES模块（ESM）的支持，直接在ES模块中使用__dirname会导致“__dirname is not defined in ES module scope”的错误信息。本文将探讨这一问题，并提供有效的解决方案。

理解ES模块与CommonJS

Oh My Zsh 自动化：轻松管理多个 Git 用户身份信息

2024-04-23T06:05:00.000Z

在 Git 工作流中，有时需要在同一台电脑上针对不同的项目设置不同的用户身份。例如，开发人员可能需要在个人项目和公司项目之间切换，而这两个项目可能需要不同的 Git 用户名和电子邮件地址。Oh My Zsh 提供了强大的自定义功能，允许我们通过编写自定义的 shell 函数来实现这一需求。本文将展示如何使用 Oh My Zsh 的 chpwd 函数来自动设置特定目录及其子目录、孙目录下的 Git 用户配置。

开始之前

假设你对git身份信息和ssh key概念有比较清晰的认识和了解其基础使用，比如git身份信息是用户名和邮箱，在你使用git commit的时候进行记录；而ssh key是一个凭证（分为公钥和私钥），用于远端身份信息验证，和git没有直接关系，也可以用于其他场景使用，比如ssh登录远程主机。

使用Github Action自动化发布npm包

2024-04-20T08:32:00.000Z

GitHub Actions 提供了一种强大的自动化构建和发布流程的方式，通过组合github action的方式形成了workflow，来实现CI/CD。我们完全可以将 npm 包的发布流程集成到 GitHub workflow中，做到自动化发包，这可以可以提高效率并减少人为错误。以下是如何使用 GitHub Actions 实现自动化发布的详细指南。

0. 原理解释

github actions是一个github推出的CI/CD工具，可以模拟平台（比如linux等）自动化执行一些操作。
npm可以通过token实现免登陆发布包，并且Github Secrets能很好的保护token不被泄露（后面会说简单说一下为什么），这样就避免了在登陆信息在CI/CD时泄露

如何使用Github Actions实现自动化部署Hexo博客

2024-04-19T06:01:02.000Z

Hexo 是一个基于 Node.js 的静态博客框架，它以简洁的速度和易用性受到许多开发者的青睐。如果你的博客部署在github上，那么这里有一种新的部署方式可能让摆脱频繁提交部署的苦恼！GitHub Actions 为自动化部署Hexo提供了一种解决方案，极大地简化了部署流程和节省了时间，可以让我们更多的专注到写作本身。

为什么使用Github Actions

将文章源文件和部署文件分离，有助于保护源文件中的隐私和你的草稿文件等
节省手动部署的时间，专注于写作本身
学习Github Actions相关知识，不折腾不作死发作了

使用conda快速初始化项目python

2024-03-07T05:15:00.000Z

python的环境管理方案很多，社区有很多解决方案，本文介绍一种常用的、支持多版本python、多人协作的、方便快捷的环境管理方案：miniforge-conda

前言

进行项目的依赖管理，最根本的情况有以下几种：

Mac提示”xxx.app已损坏，无法打开，你应该将它移到废纸篓”的解决方法

2021-09-14T11:50:48.000Z

随着mac系统的升级，对app安全控制越来越严，经常遇到一些非官方渠道安装的app，安装后无法打开的情况，如提示”xxx.app已损坏，无法打开，你应该将它移到废纸篓”，一般情况下，出现该问题是因为软件没有签名，所以被MAC系统禁止运行。可以尝试以下解决方案

老系统：设置允许任何来源下载的App

比较老的版本系统，可以按以下步骤操作：
打开”系统偏好设置 -> 安全与隐私 -> 通用”选项卡，检查是否已经启用了”任何来源”选项。如果没有启用，先点击左下角的小黄锁图标解锁，然后选中”任何来源”。（由于作者mac系统比较新，故此图来源网络）

ubuntu云服务器安装docker及docker-compose保姆级教程

2021-07-03T12:55:52.000Z

本文记录在ubuntu云服务器上安装docker和docker-compose的完整过程及踩坑

为什么安装docker时会卡在添加秘钥这一步？
为什么安装docker-compose时，下载总是失败？
为什么安装的docker-compose不是最新版本？
…
且看下文，帮你解惑~

卸载旧版本

使用Npm Token免登陆发包

2019-10-12T06:01:24.000Z

在使用 npm 包管理器进行包的发布时，通常需要手动登录 npm 账户，并且我们在本地使用npm时因为某些不可抗原因，使用了非npm官方源，导致我们每次发布都需要切换到官方源，显得非常繁琐。现在，通过使用 npm Token，可以避免手动登录，切换源等步骤，实现自动化发布流程，特别是在持续集成/持续部署（CI/CD）环境中。

1. 准备工作

在开始之前，请确保：

如何解决“cannot remove directory not empty”

2019-05-29T09:43:30.000Z

在windows系统下，删除文件或者文件夹，出现”Cannot remove xxx: Directory not empty”，如果在使用各种删除方法（比如使用命令行删除，解除占用，kill相关进程等）都得到相同的提示后，那么一般是磁盘存在问题，可以尝试使用CHKDSK命令来修复磁盘解决问题

CHKDSK

CHKDSK的全称是check disk，就是磁盘检查的意思。该工具基于被检测的分区所用的文件系统，可以检查硬盘文件系统的完整性，并可以修复FAT16、FAT32和NTFS硬盘上的各种文件系统错误，创建和显示磁盘的状态报告。CHKDSK 还会列出并纠正磁盘上的错误。

Node.js版本神器之nvm

2018-07-21T11:47:23.000Z

简介

Node Version Manager (nvm) 是一个易于使用的工具，可以帮助您在不同Node.js版本之间进行切换，以满足不同项目的需求。

背景

Git系列之SSH Key配置

2018-03-08T10:03:07.000Z

在使用Git进行版本控制时，SSH密钥是一种常见的身份验证方式。当你需要在同一台机器上管理多个Git账户时，如何配置和使用多个SSH密钥呢？本文将为你提供一份的教程

说明

本篇文章以github仓库为例来进行说明

Git系列常用命令之放弃修改

2018-01-20T11:52:00.000Z

Git 是一种流行的分布式版本控制系统，它允许开发者在不同的分支上进行工作，同时保持代码的完整性和历史记录。在使用 Git 进行版本控制的过程中，我们可能会遇到需要放弃当前工作进度的情况，例如，当发现当前分支的修改与主分支的代码不兼容，或者需要切换到另一个分支继续工作时。

概述

这篇文章会介绍如何在 Git 中放弃对文件的修改，包括以下几个方面：

风继续吹

2017-11-29T14:53:37.000Z

最近在某些比较看重的事情上，处理的很失败，感觉整个心态都发生了变化。下班独行的那段路上，突然惊醒自己也许需要做出一些改变，晚饭后静静的思考了一阵：似乎勇往前行才是我最需需要的改变。古语有云：走自己的路，让别人去说吧。是的，生活需要你不断踽踽独行，活在他人的世界里是可怕的，特别他（她）还是陌生人。随手记录一些句子，它们是我最近的心态和生活的写照，也以此鞭策自己砥砺前行。

时间不会因你沮丧而停滞不前
生活不会因你懊恼而雨过天晴

常用javascript代码片段

2017-11-26T14:37:45.000Z

下面记录的主要是本人在项目中遇到的一些问题的解决方案或者个人觉得精妙的代码，方案也许来自于自己的想法，也有可能来自于网络（我尽量给出出处，以便大家追源溯流），也许干脆就是一个插件库（实际在项目中对于一些小的功能个人是拒绝引入不纯粹的三方库的）。肯定，这其中有些方案也不是尽善尽美，我会一一列出。如果对于某个问题在你看来有更好的解决方案，请不吝指出！

placeholder属性支持

有时候项目中placeholder也许要兼容某些特殊的浏览器，所以才有了下面这段代码。这种方案有一个缺点就是：如果你恰好要对这个输入框绑定focus事件并操作它的值，必须要小心处理

一道小小的题目引发对javascript支持正则表达式相关方法的探讨

2017-11-24T01:57:10.000Z

以前对于正则是非常惧怕的，因为看不懂和学不会。但最近项目中频繁的使用到了正则，因此强迫自己去学习了解，慢慢的体会到了他的魅力与强大。当然学习正则初入门的时候有些枯燥难懂，但越学越觉得轻松。本文不准备说关于正则本身的事儿，而是说一说关于javascript中关于正则的几个方法中被很多人忽略的地方。

工具

说到正则，很多人都是从抄到改到自己写，这个过程可能有时候很漫长。如一些工具能帮助你快速分析和学习正则，那么学习的过程你肯定要轻松得多。下面我推荐两个我经常使用的正则在线可视化工具，正则可视化工具图解符合铁路图规律（其实不明白什么是铁路一样很容易看懂，只是一些细微的地方和我们的常规思维有点差别）。

vue中慎用style的scoped属性

2017-11-15T11:09:16.000Z

在vue组件中，在style标签上添加scoped属性，以表示它的样式作用于当下的模块，很好的实现了样式私有化的目的，这是一个非常好的机制。但是为什么要慎用呢？在实际业务中我们往往会对公共组件样式做细微的调整，如果添加了scoped属性，那么样式将会变得不易修改。初写这篇文章时，本人没有找到一个好的方法去解决这个问题，后来经过大伙的解答，才让我恍然大悟。

何为谨慎使用

谨慎使用不是不用，而是持一种审视的目光去看待它。scoped肯定是解决了样式私有化的问题，但同时也引入了新的问题—样式不易（可）修改，而很多时候，我们是需要对公共组件的样式做微调的。所以我才说要谨慎使用

如何写一个日历组件

2017-11-02T02:08:43.000Z

众所周知，虽然javascript中关于时间的API有不少，我们可以通过方法单独的获取年、月、日、时、分、秒、毫秒…貌似很多，最近写了一个日历（以前写的，但写得很烂，最近优化一下），所以下面简单的记录一下如何写一个日历，列出了一些我在写日历过程中自己封装的一些方法

效果图

先来一张效果图，由于没有UI设计，所以就自己简单的设计了一个样式（好歹我也是设计专业的，虽然已不做设计很多年），虽然略丑，但重要的是功能！！！

慎重用for...in与for...of

2017-10-27T06:43:12.000Z

for...in和for...of都是用于数据的遍历。for...in是ES5标准，用于遍历对象属性（键），而for...of是ES6标准，是对for...in的修正，用于遍历对象元素（值），for...of兼容性不是很好（除了PC端老顽固IE之外，移动端某些安卓机和浏览器也是不支持它，具体可以查看MDN）。

for…in

Object.prototype.objMethod = function() {};
Array.prototype.arrMethod = function() {};

var arr = [2, 9, 5], obj = { name: '2ue', w: 130 };
arr.msg = 'hello';
obj.msg = 'hello';

for (var i in arr) {
  console.log(i); // "0", "1", "2", "msg", "arrCustom", "objCustom"
}

for (var i in arr) {
  if (arr.hasOwnProperty(i)) {
    console.log(i); // "0", "1", "2", "msg"
  }
}
for (var i in obj) {
  console.log(i); // "name", "w", "msg", "objCustom"
}

for (var i in obj) {
  if (obj.hasOwnProperty(i)) {
    console.log(i); // "name", "w", "msg"
  }
}