Changed Log Cleaner

Extension VS Code hỗ trợ kiểm tra code trước khi commit: phát hiện text chưa i18n trong các file Git đã thay đổi, chèn console.log chi tiết để debug và xóa an toàn các lệnh console độc lập. Extension quét file modified, staged và untracked.

Tính năng

• Quét đúng các file đang thay đổi trong Git, kể cả tên file có khoảng trắng.
• Hỗ trợ JavaScript, TypeScript, JSX, TSX, MJS, CJS, MTS và CTS.
• Xóa được console.log nhiều dòng và lời gọi optional chaining.
• Bỏ qua chuỗi, comment, template literal và regular expression.
• Chỉ xóa call độc lập; giữ nguyên call đang được dùng như một giá trị để tránh làm hỏng cú pháp.
• Hiển thị xác nhận trước khi sửa file.
• Thay đổi được áp dụng qua VS Code WorkspaceEdit nên có thể Undo.
• Cảnh báo khi file đã stage cần được stage lại.
• Check i18n trong các file đã thay đổi và log ra file còn text chưa i18n.
• Thêm console.log chi tiết cho selection hoặc biến dưới cursor, tương tự Turbo Console Log.

Xóa log trong file đã thay đổi

Command Changed Log Cleaner: Xóa log trong các file đã thay đổi quét các file Git modified, staged và untracked, sau đó xóa những lệnh console.log(...) độc lập. Log nằm trong biểu thức hoặc được dùng làm giá trị sẽ được giữ lại để tránh làm hỏng code.

Phím tắt mặc định: Cmd+K, Cmd+Option+C trên macOS hoặc Ctrl+K, Ctrl+Alt+C trên Windows/Linux.

Ví dụ trước khi chạy:

export function getUser(id: string) {
  console.log("loading user", id);

  return userRepository.findById(id);
}

Sau khi chạy:

export function getUser(id: string) {
  return userRepository.findById(id);
}

Extension cố ý không xóa trường hợp sau vì call đang được dùng như một giá trị:

const result = console.log("value");
const callback = () => console.log("clicked");

Chạy extension khi phát triển

1. Mở folder này bằng VS Code.
2. Nhấn F5.
3. Trong cửa sổ Extension Development Host, mở một Git repository có file thay đổi.
4. Nhấn Cmd/Ctrl + Shift + P.
5. Chạy Changed Log Cleaner: Xóa log trong các file đã thay đổi, Changed Log Cleaner: Check i18n trong các file đã thay đổi hoặc Changed Log Cleaner: Thêm log chi tiết.

Command cũng xuất hiện ở thanh tiêu đề của Source Control.

Phím tắt

Extension dùng chord hai bước để hạn chế trùng với shortcut phổ biến. Nhấn tổ hợp đầu tiên, thả ra, rồi nhấn tổ hợp thứ hai:

Keybinding do người dùng khai báo trong VS Code luôn được ưu tiên hơn keybinding mặc định của extension. Có thể đổi hoặc bỏ shortcut tại Preferences: Open Keyboard Shortcuts bằng cách tìm Changed Log Cleaner.

Thêm log chi tiết

Command Changed Log Cleaner: Thêm log chi tiết chạy trong editor hiện tại. Bôi đen một biến/expression hoặc đặt cursor lên biến, sau đó chạy command từ Command Palette, editor title hoặc menu chuột phải.

Phím tắt mặc định: Cmd+K, Cmd+Option+L trên macOS hoặc Ctrl+K, Ctrl+Alt+L trên Windows/Linux.

Ví dụ khi chọn user.name ở dòng 12 trong src/user.ts, extension sẽ chèn dòng bên dưới:

console.log("[src/user.ts:12] user.name:", user.name);

Command hỗ trợ nhiều cursor/selection và sẽ giữ indentation của dòng hiện tại.

Check i18n

Command Changed Log Cleaner: Check i18n trong các file đã thay đổi chỉ đọc file và log kết quả ra Output Channel Changed Log Cleaner. File nào còn text có khả năng hiển thị cho user nhưng chưa nằm trong t(...), i18n.t(...) hoặc translate(...) sẽ được liệt kê kèm dòng và preview ngắn.

Phím tắt mặc định: Cmd+K, Cmd+Option+I trên macOS hoặc Ctrl+K, Ctrl+Alt+I trên Windows/Linux.

Ví dụ sẽ bị log:

const title = "Save changes";
return <button>Submit form</button>;

Ví dụ được xem là đã i18n:

const title = t("settings.saveChanges");
return <button>{i18n.t("settings.submitForm")}</button>;

Cấu hình

Ví dụ xóa cả console.debug và console.info:

{
  "changedLogCleaner.consoleMethods": ["log", "debug", "info"]
}

Test

Project không có runtime dependency. Test chạy trực tiếp bằng Node.js:

npm test
npm run check

Test bao gồm scanner và một Git repository tạm với file modified, staged, untracked, ignored và deleted.

Đóng gói VSIX

Trước tiên thay các giá trị sau trong package.json:

• publisher
• repository.url
• bugs.url
• homepage

Sau đó chạy:

npm install
npm run check
npm run package:vsix

File check-i18n-0.1.0.vsix sẽ được tạo ở thư mục gốc.

Cài thử:

code --install-extension check-i18n-0.1.0.vsix

Publish Marketplace

vsce login <publisher-id>
vsce publish

Mỗi lần cập nhật:

vsce publish patch

Lưu ý về file staged

Nếu extension sửa một file đã được stage, Git index vẫn đang giữ nội dung cũ. Hãy kiểm tra Source Control và chạy git add lại file trước khi commit.

Giới hạn an toàn

Extension chỉ xử lý dạng truy cập trực tiếp:

console.log("message");
console?.log?.("message");

Các dạng window.console.log(...), console["log"](https://github.com/DiepHoang19/vscode-extensions/blob/HEAD/...) hoặc call nằm trong biểu thức được giữ nguyên để tránh sửa code quá mức.

License

MIT