Mẹo Và Thủ Thuật Visual Studio Code
--- Bài mới hơn ---
Màn hình giới thiệu của Visual Studio
Màn hình chứa bảng lệnh có sẵn mà bạn cần
- Default keyboard shortcuts (phím tắt mặc định)
Tất cả lệnh nằm trong Command Palette đều có sự liên kết ràng buộc với key (nếu nó tồn tại). Nếu bạn quên một lệnh nào đó, có thể dùng Command Palette để tìm lệnh bạn cần.
- Bảng tổng hợp phím tắt trong Visual Studio
Gõ các lệnh edit và term sau khoảng trắng sẽ hiển thị một danh sách được thả xuống
Điều hướng giữa các tệp được mở gần đây
Lặp lại phím tắt Quick Open để xoay vòng nhanh giữa các tệp được mở gần đây.
Mở nhiều file từ Quick Open
Bạn có thể mở nhiều file từ Quick Open bằng cách nhấn phím mũi tên bên phải. Thao tác này sẽ mở file được chọn trong nền và bạn có thể tiếp tục chọn file từ Quick Open.
Điều hướng giữa các Folder được mở gần đây và không gian làm việc(workspaces)
Open Recent
Code VS (Visual Studio) có giao diện dòng lệnh mạnh mẽ (CLI) cho phép bạn tùy chỉnh cách khởi chạy trình chỉnh sửa để hỗ trợ các tình huống khác nhau.
# open code with current directory code . # open the current directory in the most recently used code window code -r . # create a new window code -n # change the language code --locale=es # open diff editor code --goto package.json:10:5 # see help options code --help # disable all extensions code --disable-extensions .
Các file cụ thể của workspaces nằm trong một .vscode folder root.
Ví dụ: tasks.json đối với Task Runner và launch.json cho debugger.
Lỗi và cảnh báo
Phím tắt: Ctrl + Shift + M
Nhanh chóng nhảy đến phần cảnh báo và lỗi bên trong project
Bạn có thể lọc các vấn đề theo loại (‘errors’, ‘warnings’) hoặc khớp văn bản.
- Thủ thuật – Change language mode (Chế độ thay đổi ngôn ngữ)
Nếu bạn muốn duy trì ngôn ngữ mới cho file đó, bạn có thể sử dụng lệnh Conp File Association for liên kết để mở rộng file hiện tại với ngôn ngữ đã được cài.
Có rất nhiều điều bạn có thể làm để tùy chỉnh code VS.
Thay đổi theme
- Thay đổi phím tắt
- Điều chỉnh cài đặt
- Thêm xác thực JSON
- Tạo đoạn trích
- Cài đặt tiện ích mở rộng
Thay đổi theme
Keymaps
Tùy chỉnh phím tắt của bạn
Phím tắt: Ctrl + K Ctrl + S
Bạn có thể tìm kiếm các phím tắt và thêm các tổ hợp phím của riêng bạn vào file keybindings.json.
Điều chỉnh cài đặt của bạn
Theo mặc định, VS hiển thị trình chỉnh sửa Settings, bạn có thể tìm thấy các cài đặt được liệt kê bên dưới trong thanh tìm kiếm, nhưng vẫn có thể chỉnh sửa settings.json file bên dưới bằng cách sử dụng lệnh Open Settings (JSON) hoặc bằng cách thay đổi trình chỉnh sửa cài đặt mặc định của mình bằng cài đặt workbench.settings.editor.
Mở User setting settings.json
Phím tắt: Ctrl +,
Thay đổi phông chữ của các thành phần UI khác nhau
// Main editor "editor.fontSize": 18, // Terminal panel "terminal.integrated.fontSize": 14, // Output panel "": { }
Tips: Bạn cũng có thể tạo cài đặt cụ thể cho ngôn ngữ bằng lệnh Conp Language Specific Settings.
Thêm xác thực JSON
Được bật theo mặc định cho nhiều loại tệp. Tạo lược đồ và xác nhận của riêng bạn trong settings.json
"json.schemas": , "url": "./myschema.json" } ]
hoặc một lược đồ tùy chỉnh
"json.schemas": }
Vertical rulers
Nhấn phím Alt cho phép cuộn nhanh trong trình chỉnh sửa và Explorers. Theo mặc định, cuộn nhanh sử dụng hệ số nhân tốc độ 5X nhưng bạn có thể điều khiển hệ số nhân với cài đặt Editor: Fast Scroll Sens Sens (editor.fastScrollSensitivity)
Sao chép dòng lên / xuống
Di chuyển dòng lên và xuống
Shrink / expand selection
Go to Symbol in File
Phím tắt: Ctrl + Shift + O
Bạn có thể nhóm các biểu tượng theo loại bằng cách thêm dấu hai chấm, @: .
Go to Symbol in Workspace
Phím tắt: Ctrl + T
Outline view
Khung nhìn Outline trong File Explorer (mặc định được thu gọn ở phía dưới) hiển thị cho bạn các ký hiệu của file hiện đang mở.
Điều hướng đến một dòng cụ thể
Phím tắt: Ctrl + G
Hoàn tác vị trí con trỏ
Phím tắt: Ctrl + U
Cắt khoảng trắng dấu
Phím tắt: Ctrl + K Ctrl + X
Chuyển đổi lệnh văn bản
Bạn có thể thay đổi văn bản đã chọn thành chữ hoa, chữ thường và trường hợp tiêu đề bằng các lệnh Transform từ Command Palette.
Định dạng mã
Mã nguồn được chọn hiện tại: Ctrl + K Ctrl + F
Toàn bộ định dạng tài liệu: Shift + Alt + F
Code formatting
Bạn cũng có thể fold / unfold tất cả các vùng trong trình chỉnh sửa bằng Fold All (Ctrl + K Ctrl + 0) và Unfold All (Ctrl + K Ctrl + J).
Chọn dòng hiện tại
Phím tắt: Ctrl + L
Điều hướng đến đầu và cuối tệp
Mở xem trước Markdown
Trong tệp Markdown, sử dụng
Phím tắt: Ctrl + Shift + V
Chỉnh sửa và xem trước Markdown
Trong tệp Markdown, sử dụng
Phím tắt: Ctrl + K V
Bản xem trước và trình chỉnh sửa sẽ đồng bộ hóa với cuộn của bạn trong cả hai chế độ xem.
IntelliSense
Ctrl + Space để kích hoạt Suggestions widget.
Bạn có thể xem các phương thức có sẵn, gợi ý tham số, tài liệu ngắn, v.v.
Peek
Chọn một biểu tượng sau đó nhập Alt + F12 . Ngoài ra, bạn có thể sử dụng menu ngữ cảnh.
Go to Definition
Go to References
Chọn một biểu tượng sau đó nhập Shift + F12. Ngoài ra, bạn có thể sử dụng menu ngữ cảnh.
Thủ thuật – Rename Symbol
Chọn một biểu tượng rồi nhấn F2. Bạn cũng có thể sử dụng menu ngữ cảnh để thao tác.
Thủ thuật – tìm kiếm và sửa đổi
Bên cạnh việc tìm kiếm và thay thế các biểu thức, bạn cũng có thể tìm kiếm và sử dụng lại các phần của những gì đã khớp, sử dụng các biểu thức thông thường với các nhóm capturing. Bật biểu thức chính quy trong hộp tìm kiếm bằng cách nhấp vào nút Use Regular Expssion .* và sau đó viết biểu thức chính quy và sử dụng dấu ngoặc đơn để xác định nhóm. Sau đó bạn có thể tái sử dụng các nội dung phù hợp trong mỗi nhóm bằng cách sử dụng $1, $2 vv trong Replace field.
.eslintrc.json
Cài đặt Extension ESLint . Cấu hình linting theo cách bạn muốn. Tham khảo ESLint specification để biết chi tiết về các quy tắc và tùy chọn linting..
Đây là cấu hình để sử dụng ES6.
{ "env": { "browser": true, "commonjs": true, "es6": true, "node": true }, "parserOptions": { "ecmaVersion": 6, "sourceType": "module", "ecmaFeatures": { "jsx": true, "classes": true, "defaultParams": true } }, "rules": { "no-const-assign": 1, "no-extra-semi": 0, "semi": 0, "no-fallthrough": 0, "no-empty": 0, "no-mixed-spaces-and-tabs": 0, "no-redeclare": 0, "no-this-before-super": 1, "no-undef": 1, "no-unreachable": 1, "no-use-before-define": 0, "constructor-super": 1, "curly": 0, "eqeqeq": 0, "func-names": 0, "valid-typeof": 1 } }
Gói .json
Xem IntelliSense cho package.json tệp của bạn.
Cú pháp Emmet
Support for Emmet syntax
Snippets
Tạo snipptes tùy chỉnh
"create component": { "pfix": "component", "body": }
Đôi khi có vấn đề với thế hệ tự động. Kiểm tra các tài liệu để làm cho mọi thứ hoạt động đúng.
Thủ thuật – chạy các tác vụ từ menu Terminal
Chọn Terminal từ menu cấp cao nhất, chạy lệnh Run Task và chọn tác vụ bạn muốn chạy. Chấm dứt tác vụ đang chạy bằng cách chạy lệnh Terminate Task
Xác định các phím tắt cho các tác vụ
Bạn có thể xác định một phím tắt cho bất kỳ tác vụ. Từ Command Palette ( Ctrl + Shift + P), chọn Preferences: Open Keyboard Shortcuts File , liên kết phím tắt mong muốn với workbench.action.tasks.runTask lệnh và xác định Task là args.
Ví dụ: để liên kết Ctrl + H với Run tests tác vụ, hãy thêm vào như sau:
{ "key": "ctrl+h", "command": "workbench.action.tasks.runTask", "args": "Run tests" }
Chạy npm scripts dưới dạng tasks from the explorer
Với cài đặt npm.enableScriptExplorer, bạn có thể kích hoạt Explorer hiển thị các tập lệnh được xác định trong workspace của bạn.
Từ Explorer, bạn có thể mở một script trong trình soạn thảo, chạy nó như một tác vụ và khởi chạy nó với trình gỡ lỗi nút (khi tập lệnh xác định tùy chọn gỡ lỗi như thế nào -inspect-brk). Hành động mặc định khi nhấp là để mở tập lệnh. Để chạy tập lệnh chỉ bằng một cú nhấp chuột, hãy đặt npm.scriptExplorerAction thành “run”. Sử dụng cài đặt npm.exclude để loại trừ các tập lệnh trong package.json các tệp có trong các thư mục cụ thể.
Với cài đặt npm.enableRunFromFolder, bạn có thể kích hoạt để chạy các tập lệnh npm từ menu ngữ cảnh của Explorer cho một thư mục. Cài đặt cho phép lệnh NPM Script in Folder… khi thư mục được chọn. Lệnh hiển thị danh sách Quick Pick các tập lệnh npm có trong thư mục này và bạn có thể chọn tập lệnh sẽ được thực thi dưới dạng task.
Portable mode (Chế độ di động)
VS Code có Portable mode cho phép bạn giữ các cài đặt và dữ liệu ở cùng vị trí với cài đặt của bạn, ví dụ: trên ổ USB.
Insiders builds (bản thử nghiệm)
- Dành cho người dùng sớm: các bản insiders có các thay đổi để người dùng và người viết được dùng thử
- Bản dựng thường xuyên: Bản cập nhật mỗi ngày với các tính năng sửa lỗi mới nhất.
- Cài đặt song song: Người dùng nội bộ cài đặt bên cạnh bản ổn định cho phép bạn sử dụng độc lập.
--- Bài cũ hơn ---