Công cụ chuyển sang kebab-case
Chuyển camelCase, snake_case hoặc văn bản thường sang kebab-case (dash-case) cho class CSS, URL và tên file. Xử lý từ viết tắt và chữ số theo từng dòng.
Ví dụ: userAccountId → user-account-id
Mỗi dòng được chuyển đổi riêng. Từ được tách tại khoảng trắng, dấu câu, _ - . / và ranh giới camelCase; từ viết tắt như XML được giữ nguyên, chữ số dính với từ đứng trước.
Công cụ Liên quan
Xem Tất cảkebab-case là gì?
Công cụ này chuyển định danh và cụm từ sang kebab-case (còn gọi là dash-case): các từ viết thường nối bằng dấu gạch ngang, dùng cho class CSS, thuộc tính HTML, cờ dòng lệnh và đường dẫn URL.
Cách sử dụng kebab-case
- Gõ hoặc dán văn bản vào ô Đầu vào – mỗi dòng một định danh hoặc cụm từ (hoặc bấm Tải ví dụ).
- Văn bản dạng kebab-case xuất hiện ngay trong ô Đầu ra.
- Bấm Sao chép để sao chép kết quả.
Ví dụ
getHTTPResponseCode
get-http-response-code
Khi nào nên dùng kebab-case
Dùng cho tên class CSS, tên file component hoặc tùy chọn dòng lệnh. Để tạo URL SEO từ tiêu đề có dấu, công cụ tạo slug có loại bỏ dấu sẽ phù hợp hơn.
kebab-case hoạt động như thế nào
Đầu vào được tách thành các từ, mọi từ được viết thường và nối với nhau bằng -. Từ được tách tại dấu cách, dấu câu và các ký tự phân tách _ - . /, cũng như tại chỗ đổi kiểu chữ bên trong định danh: fooBar → foo + Bar, còn một chuỗi từ viết tắt được giữ liền (XMLHttpRequest → XML + Http + Request). Chữ số dính với từ đứng trước (Request2Go → Request2 + Go), dấu nháy đơn bên trong từ bị bỏ (don't → dont), và chữ cái của mọi hệ chữ (é, ñ, Kirin, Hy Lạp…) đều được hỗ trợ. Mỗi dòng được chuyển đổi riêng.
Các Trường Hợp Sử Dụng Phổ Biến
- Tạo tên class CSS từ tên component
- Chuyển tên component React thành tên file
- Tạo tên tùy chọn dòng lệnh (CLI)
- Tạo đoạn đường dẫn URL từ định danh
Lưu Ý Bảo Mật
Mọi thứ chạy cục bộ trong trình duyệt của bạn; đoạn mã bạn dán vào không được tải lên đâu cả.
Câu Hỏi Thường Gặp
kebab-case có giống slug không?
Gần giống, nhưng công cụ này giữ chữ có dấu; công cụ tạo slug thường chuyển chúng thành ASCII.
Từ viết tắt được xử lý thế nào?
getHTTPResponseCode thành get-http-response-code.
Có dùng được với nhiều dòng không?
Có, mỗi dòng được chuyển đổi riêng.