Đang tải...

Trung Lê Thành

Trung IT


27

Một số Extension hữu ích trong Visual Studio Code

Trung Lê Thành
Trung Lê Thành

5 năm trước · 3 phút đọc

Lời Ngỏ

Chào anh em f8, anh em có biết Extension là gì không? image.png

Extension - tiện ích trong VS Code là một yếu tố giúp tiết kiệm thời gian coder của bạn ==> mà có nhiều thời gian thì bạn sẽ có nhiều tiền. Thế thôi!

Nội Dung

1. Auto Rename Tag

Đây là một tiện ích nên cài đặt khi học các khóa học về HTML trên F8.

Giới thiệu: là một tiện ích mở rộng giúp tự động sửa tên các thẻ trong HTML, XML. Nói nôm na, ví dụ bạn đang cần sửa thẻ <div></div> sang thẻ a. Bạn sửa thẻ mở hoặc thẻ đóng đổi thành a thì nó tự động sửa. image.png

2. Prettier - Code formatter

Giới thiệu: là một tiện ích giúp format lại định dạng code. Hiểu đơn giản là làm đẹp code của bạn. Extension hỗ trợ JavaScript, TypeScript, Flow, JSX, JSON CSS, SCSS, LessHTML, Vue, Angular.

Cách sử dụng: Chuột phải vào giao diện code của bạn => Chọn Format Code With => Chọn Prettier

image.png

Extension này có cái này hơi dở (theo mình). Nó thực hiện đẩy thuộc tính của một thẻ X xuống từng hàng. Nếu bạn không thích tính năng này có thể xem extension thứ 3.

image.png

3. JS-CSS-HTML Formatter

Giới thiệu: là một tiện ích tương tự như tiện ích thứ 2. Tuy nhiên, ở tiện tích này nó chỉ thực hiện căn chỉnh tab - lề không tự ý xóa các dòng enter trống. image.png

Trong VS Code đã có chức năng Format (phím tắt Shift + Alt + F hoặc chuột phải màn hình code => chọn Format Document) rồi. Tuy nhiên nó còn hạn chế. Nên tùy theo nhu cầu của bạn mà cần cài thêm hay không nhé.

4. Darcula Theme

Giới thiệu: là một tiện ích thay đổi theme chế độ tối của VS Code. Theme này phù hợp cho anh em code vào ban đêm đỡ chói mắt. image.png

5. VS Code Icons

Giới thiệu: tiện ích này giúp bạn hiển thị các icon cho các file, folder khiến giao diện trở nên trực quan hơn. image.png

6. [Deprecated] Debugger for Chrome

Giới thiệu: khi bận cần debug javascript trên trình duyệt Chrome thì đây là extension hay dành cho bạn. Khi bạn thực hiện đặt breakpoint trong VS Code, khi chương trình chạy tới breakpoint sẽ dừng lại.

Debug một chương trình là một bước quan trọng trong việc kiểm tra lỗi hay tính năng của phần mềm.

image.png

Lời kết

Các tiện ích, nếu bạn lạm dụng quá nhiều sẽ tốn dung lượng và tốc độ khi build ứng dụng. Nên các bạn cân nhắc cái nào cần thiết thì mình hẳn cài nhé.

Trên đây là một số tiện ích mình đã và đang dùng. Nếu có sai sót, bạn phản hồi lại giúp mình nhé. Cảm ơn bạn đã theo dõi bài viết.

Nguồn hình ảnh: Internet.

#TT