Cách Sử Dụng Sublime Text 3

Hướng dẫn các cách sử dụng sublime text 3 mới nhất 2020

Xếp hạng bài viết này

cách sử dụng sublime text 3 là một trong những từ khóa được search nhiều nhất trên google về chủ đề cách sử dụng sublime text 3. Trong bài viết này,lamweb.vn sẽ viết bài viết Hướng dẫn các cách sử dụng sublime text 3 mới nhất 2020.

Cách Sử Dụng Sublime Text 3

Mục lục

Hướng dẫn các cách sử dụng sublime text 3 mới nhất 2020.

Tận dụng phím tắt

sử dụng phím tắt để thực hiện tác vụ luôn mau hơn sử dụng chuột hay thực đơn. Bạn k nhất thiết phải học thuộc lòng mọi phím tắt này, mà chỉ cần nhớ là chúng có tồn tại để easy bề “lục lọi” khi cần.

Chung
Ctrl+Shift+P xây dựng Command Prompt
Ctrl+K, Ctrl+B Ẩn/hiện side bar
Chỉnh sửa
Ctrl+Shift+↑ chuyển dịch dòng/vùng chọn lên 1 thể loại
Ctrl+Shift+↓ chuyển dịch dòng/vùng chọn xuống 1 thể loại
Ctrl+L lựa chọn dòng cho đến nayliên tục bấm Ctrl+L để chọn dạng tiếp theo
Ctrl+D chọn một từ, liên tục nhấn Ctrl+D để chọn những từ giống vậy
Ctrl+Shift+D Nhân đôi dạng bây giờ
Ctrl+M Đi tới dấu đóng ngoặc gần nhất – Lặp lại để đi tới dấu xây dựng ngoặc
Ctrl+Shift+M chọn tất cả nội dung trong dấu ngoặc
Ctrl+Shift+K Xóa toàn bộ dạng
Ctrl+] Lùi thể loại bây giờ vào trong 1 tab
Ctrl+[ Lùi thể loại hiện giờ ra ngoài 1 tab
Ctrl+/ Comment/Un-comment dòng/vùng chọn bây giờ
Điều hướng/di chuyển
Ctrl+P xây dựng mau file bằng tên
Ctrl+R Đi đến kí tự cần tìm
Ctrl+; Đi đến từ trong file hiện tại
Ctrl+G Đi đến định dạng trong file bây giờ
search và thay thế
Ctrl+F Tìm
Ctrl+H Thay thế
Ctrl+Shift+F Tìm trong các file vừa mới xây dựng
Tabs
Ctrl+Shift+T xây dựng tab đã đóng gần nhất
Ctrl+Tab Di chuyển qua lại giữa các tab
Ctrl+W Đóng tab bây giờ
Alt+[NUM] Đi tới tab thứ [NUM]
Chia màn hình
Alt+Shift+NUM Chia màn hình thành [NUM] cột
Alt+Shift+5 Chia màn hình thành grid gồm 4 groups
Alt+Shift+8 Chia màn tạo dựng 2 hàng
Ctrl+[NUM] Đi tới group thứ [NUM]
Ctrl+[NUM] Chuyển file tới nhóm thứ [NUM]
Bookmarks
Ctrl+F2 Bookmarks/Bỏ bookmarks
F2 Đi tới bookmarks tiếp theo
Shift+F2 Đi tới bookmarks trước
Ctrl+Shift+F2 Xóa all bookmarks
Thao tác với văn bản
Ctrl+K, Ctrl+U Chuyển vùng chọn sang chữ in hoa
Ctrl+K, Ctrl+L Chuyển vùng lựa chọn sang chữ thường

Tô màu mã gốc với các gói mở rộng ngôn ngữ

Sau khi setup, Sublime hỗ trợ đến hơn 50 ngôn ngữ lập trình. ngoài ra, nếu làm việc với Angular, Vue, React hay những framework/ngôn ngữ mới, bạn cần phải cài đặt thêm các phần xây dựng rộng để Sublime đủ sức hiểu và tô màu mã nguồn. Tùy nhu cầu cụ thể mà bạn đủ sức tìm thấy plugin tương ứng trên Package Control. Ehkoo liệt kê dưới đây những plugin phổ biến nhất.

Ngôn ngữ

  • Babel (React): bên cạnh hỗ trợ các chức năng mới trong ES6, ES7, plugin này cũng hỗ trợ tô màu cho JSX
  • Better CoffeeScript
  • Flow
  • TypeScript

Thư viện

  • AngularJS
  • Vue Syntax Highlight
  • EmberScript

Emmet

Với lập trình viên front-end, Emmet là plugin không thể thiếu rồi. Emmet cho phép bạn viết HTML “nhanh như chảo chớp” bằng hướng dẫn sử dụng biểu thức mô tả HTML, sau đó Emmer sẽ mở rộng biểu thức này. Chẳng hạn, khi bạn viết #content>p.text*5>lorem, Emmet sẽ “úm ba la” thành:

emmet v6sguq Lamweb.vn

k chỉ hỗ trợ làm việc với HTML, Emmet cũng biểu thức HTML bên trong JSX. Để nghiên cứu thêm về hướng dẫn viết biểu thức, bạn có thể tham khảo ở đây.

Các gói snippets hữu dụng

JavaScript & NodeJS Snippets, như tên gọi, bao gồm các snippets dành riêng cho JavaScript, giúp bạn gõ một đoạn mã thông dụng nhanh hơn. ví dụ, thay vì gõ document.querySelector('selector');, bạn chỉ cần gõ qsclick Tab, và Sublime sẽ giúp phần việc còn lại giúp bạn. Hoặc gi giống như ví dụ dưới đây.

Lamweb.vn

Nếu thấy Emmet hơi khó khăn, bạn đủ sức sử dụng một plugin không giống tương tự là HTML Snippets. Plugin này có ít tính năng hơn, nhưng easy sử dụng hơn.

e4f7dae026dace69b92b7fc96e8d6f7d2816d117 imqusj Lamweb.vn

EHKOO @ FACEBOOK

Like us on Facebook

Tặng một likethể hiện tình cảm nha!

bên cạnh đó, cũng đừng quên những gói snippets khi làm việc với các thư viện/framework, chẳng hạn giống như ReactJS Snippets, AngularJS Snippets, VueJS Snippets…

Với CSS, bạn chỉ cần cài CSS Snippets là có support CSS, LESS, SASS và Stylus.

định hướng mã nguồn

Lamweb.vn
Bằng phương pháp sử dụng HTMLBeautify, CSS Format, Pretty JSON hoặc jsfmt, bạn đủ sức lựa chọn auto định hướng mã gốc khi lưu files. Nếu là fan của Prettier, bạn đừng quên plugin JsPrettier.

Canh hàng với Alignment

align my1rf8 Lamweb.vn

Alignment giúp bạn canh hàng khi khai báo nhiều biến. k chỉ hoạt động trên JS, Alignment còn hỗ trợ PHP. Để tùy chỉnh plugin này, bạn đủ sức nhìn thấy hướng dẫn.

Loại bỏ khoảng trắng dư thừa bằng Trimmer

Trimmer giúp bạn loại bỏ những khoảng trắng thừa một phương pháp gấp rútngoài ra plugin này còn có chức năng Replace Smart Characters, giúp thay thế những ký tự đặc biệt giống như « thành <<.

dùng DocBlockr để viết tài liệu

Trong tiến trình viết code, thỉnh thoảng chúng ta phải viết thêm ebook mô tả về hàm hay lớp đã xây dựngmục tiêu là để tiến trình bảo trì ứng dụng không khó khăn hơn, các member mới du nhập team cũng easy nắm bắt thông tin hơn. Doc​Blockr là plugin giúp bạn viết những ebook này khẩn trươngtiện dụng. Chỉ cần để con trỏ ở trước hàm hay phương pháp, gõ /** và Tab, DocBlockr sẽ auto nhận biết các tham số và giá trị trả về.

Lamweb.vn

DocBlockr k chỉ support JavaScript mà còn sử dụng được với nhiều ngôn ngữ khác giống như PHP, CoffeeScript, TypeScript…

sử dụng việc với git và GitHub

Git

Lamweb.vn

Plugin này giúp bạn sử dụng Git trực tiếp bên trong Sublime, bao gồm khá nhiều chức năng đa dạng, chẳng hạn như thêm files, tạo commits, xem logs… mà k cần rời khỏi trình biên soạn thảo.

GitGutter

Lamweb.vn

GitGutter theo dõi repo ở thư mục bây giờ, cho bạn biết tình trạng của mỗi dòng và mang đến một cái Nhìn tổng quan về những refresh trong tập tin đã được chỉnh sửa.

GitHubinator

3e8d982a16c2689eec272dfb39baf3f93585593c mrzmme Lamweb.vn

GitHubinator là một plugin cho phép bạn bôi đen code trong Sublime text, và hightlight đoạn code đó trên remote repo của Github (nếu như đoạn code đó tồn tại).

Gist
Gist cho phép bạn send đoạn code được lựa chọn lên dịch vụ Gist của Github.

Linter

Sublime Linter

4433bce011a7db90487417bb2a4c7238fc178735 dzlc93 Lamweb.vn

Trong công cuộc code, việc mắc phải những lỗi về cú pháp là không thể tránh khỏi. Plugin này cung cấp một nền tảng để các chương trình check lỗi, ví dụ như ESLint, có thể được kết hợp vào Sublime. Sau khi cài đặt Sublime Linter, bạn cần cài riêng các gói riêng cho từng ngôn ngữ.

Nâng cấp sidebar

Side Bar Enhancements

Lamweb.vn

Sidebar mặc định của Sublime cung cấp số chọn hạn chế để thao tác với tập tin hay kiếm tìmdùng plugin này, bạn sẽ có thêm khoảng 20 lựa chọn mới, gồm có Open in browser, Duplicate, cải thiện, Reveal…

AdvancedNewFile

newfile jpp0in Lamweb.vn

AdvancedNewFile là plugin giúp gia tăng tốc tạo tập tin mới. Bạn chỉ cần nhấn Ctrl + Alt + N trong Windows, Super + Alt + N trong Mac/Linux để trực tiếp gõ đường dẫn đến tập tin mới. Và yên tâm, nếu tập tin nằm trong thư mục chưa tồn tại, thư mục mới sẽ được xây dựng luôn.

lựa chọn màu mau với ColorPicker

ColorPicker

Untitled vdzcur Lamweb.vn

Plugin này sẽ cho bạn một hộp thoại nhỏ để lựa chọn màu từ bảng màu, hoặc bạn cũng đủ nội lực dùng Eye dropper để lựa chọn màu từ bất kì vị trí nào trên màn ảnh của bạn.

Color Highlighter

Xme7H5J mjuw0d Lamweb.vn

dùng plugin này, bạn có thể nhìn thấy trực quan những màu sắc tương ứng với mỗi trị giá màu giống như HEX, RGBA…ngay trong mã nguồn.

Ghost​Text

b34dc4d3dfe0069426110bd1669198433961cd30 v1ar2e Lamweb.vn

Đây là một plugin thực sự rất thú vị. Nó giúp bạn liên kết Sublime text đến một vùng text trên browser. gợi ý, bạn đủ nội lực làm việc với CodePen, nhưng tất cả quá trình code của bạn sẽ được thực hiện trên Sublime text, và bạn có thể sử dụng tất cả những tính năng, plugin của Sublime text. Sau khi cài plugin này, bạn cần cài thêm extension cho browser.

Bonus

Emoji

undefined zuii3s Lamweb.vn

sử dụng plugin này, bạn đủ sức chèn thêm emoji từ Command palette. Có lẽ không quan trọng lắm với những ai dùng Mac vì bạn có thể xây dựng emoji panel bằng cách bấm Control + Command + Space rồi.

Nguồn: internet.com

Leave a Comment

Email của bạn sẽ không được hiển thị công khai. Các trường bắt buộc được đánh dấu *


Notice: ob_end_flush(): failed to send buffer of zlib output compression (1) in /home/locone/public_html/lamweb.vn/wp-includes/functions.php on line 5309

Notice: ob_end_flush(): failed to send buffer of zlib output compression (1) in /home/locone/public_html/lamweb.vn/wp-includes/functions.php on line 5309