[Sangat disyorkan] Ringkasan terkini pengembangan VSCode!

Artikel berikut akan memperkenalkan anda kepada sambungan VSCode yang biasa digunakan, saya harap ia akan membantu anda!

1. Pengembangan

🎜>

Nama	Penerangan ringkas
Auto Auto Import	import gesaan
Auto Namakan Teg	Apabila mengubah suai teg HTML, ubah suai teg yang sepadan secara automatik
Babel JavaScript	pemalam babel, penyerlahan sintaks
Babelrc	.babelrc file highlight prompt
Cantik css / sass/scss/less	css/sass/less format
Selaraskan Lebih Baik	Selaraskan simbol tugasan dan ulasan
Komen yang Lebih Baik	Tulis komen yang lebih mesra pengguna
Penanda Halaman	Tambahkan penanda halaman baris
Kanta Kurung	Prompt kod di kepala kurungan di kurungan penutup
Pewarna Pasangan Kurung 2	Serlahkan kurungan padan dengan warna berbeza
Bolehkah Saya Guna	Semakan keserasian penyemak imbas untuk HTML5, CSS3, SVG
Rangka Kod	Paparkan pokok struktur kod
Lari Kod	Jalankan segmen kod yang dipilih (menyokong kebanyakan bahasa)
Pemeriksa Ejaan Kod	Pemeriksa ejaan perkataan
CodeBing	Buka Bing dengan cepat dan cari, enjin carian boleh dikonfigurasikan
Sorotan Warna	Nilai warna diserlahkan dalam kod
Maklumat Warna	Tetingkap kecil memaparkan nilai warna, rgb, hsl, cmyk, hex, dll.
Pemilih Warna	Pemilih Warna
CSS-in-JS	Petua sorotan CSS-dalam-JS dan Tukar
Dash	Integrate Dash
Penyahpepijat untuk Chrome	Penyahpepijat untuk Chrome
Dokumenkan Ini	Penjanaan dokumen anotasi
DotENV	.env penonjolan fail
Edit csv	Edit fail CSV
EditorConfig untuk Kod VS	Pemalam EditorConfig
Emoji	Masukkan emoji dalam kod
endy	Lompat kursor input ke penghujung baris semasa
Ralat Longkang	Kod ralat segera pada nombor baris
ESLint	ESLint plug-in, highlight prompt
Fail Peek	Mengikut rentetan laluan, cepat cari fail
saiz fail	Bar status menunjukkan saiz fail semasa
Cari-Lompat	Cepat melompat ke perkataan yang ditentukan kedudukan
Kod hebat fon untuk html	FontAwesome coretan kod gesaan
ftp-sync	Segerakkan fail ke ftp
Git Blame	Menunjukkan baris semasa daripada Git dalam Maklumat bar status
Sejarah Fail Git	Semak imbas fail tunggal Perubahan komit sejarah dengan cepat
Git Graf	Git Graph View, mudah untuk menyemak imbas dan operasi
Git History (git log)	Lihat git log
Git Tree Compare	Perbandingan pokok Git, lihat perbezaan antara cawangan yang berbeza
gitignore	.gitignore sintaks fail
GitLens	Paparkan komit terbaharu dan pengarang fail, dan paparkan maklumat komit baris semasa
GraphQL untuk VSCode	sorotan dan petua graphql
Panduan	Serlahkan garis dasar inden
Serlahkan Coretan Gulp	Coretan Gulp
Serlahkan Teg Padanan	Serlahkan padanan tag terpilih
Penyelesaian Kelas CSS HTML	Petua kelas CSS
Sokongan HTML CSS	petunjuk css (menyokong vue)
HTMLHint	Petua Format HTML
htmltagwrap	Balut cepat tag html
htmltagwrap	Sertakan HTML
Import Beautify	import mengumpulkan, menyusun, memformat
Kos Import	Saiz pakej yang diimport (import/memerlukan) ialah dipaparkan sebaris
Indentikator	Inden Sorotan
IntelliSense untuk nama kelas css	gesaan input kelas css
coretan kod JavaScript (ES6)	coretan kod sintaks ES6
Gaya Standard JavaScript	Gaya Standard
Jest Runner	Menyokong pelaksanaan fail ujian tunggal Jest atau penggunaan tunggal kes
JS Refactor	Alat pembinaan semula kod, pengekstrakan Fungsi, penamaan semula pembolehubah, dsb.
JSON kepada TS	Struktur JSON ditukar kepada antara muka skrip taip
Alat JSON	Formatkan dan mampatkan JSON
gelombang	Lompat cepat ke kedudukan perkataan yang ditentukan
stylus bahasa	Penyertaan dan Petua Sintaks Stylus
Kurang IntelliSense	kurang pembolehubah dan pembayang campuran
Lodash	Lodash coretan kod
Pembungkus Log	Menghasilkan kod untuk mencetak pembolehubah terpilih
markdownlint	Petua pemformatan markdown
MochaSnippet	Coretan kod Mocha
Modul nod menyelesaikan	Navigasi cepat ke modul Nod
npm	Jalankan arahan npm
npm Intellisense	Apabila mengimport modul, ia menggesa bahawa nama modul yang dipasang ialah
Pewarna Output	Maklumat output warna
Beza Separa	Bandingkan dua keping kod atau fail
Petua Parameter	Nyatakan nama parameter pada panggilan fungsi
Autolengkap Laluan	Gesaan Penyiapan Laluan
Path Intellisense	Gesaan penyelesaian Laluan Lain
Polacode	Jana kod ke dalam imej
PostCss Sorting	css pengisihan
Lebih Cantik - Pemformat kod	palam rasmi yang lebih cantik -dalam
Prettify JSON	JSON Berformat
Pengurus Projek	Tukar projek dengan cepat
Quokka.js	Tidak perlu dijalankan secara manual, hasil pembolehubah dipaparkan sebaris
Rainbow CSV	Fail CSV memaparkan lajur berbeza menggunakan warna pelangi
React Native Storybooks	storybook preview plugins, menyokong react
React Playground	Menyediakan persekitaran berjalan komponen tindak balas untuk editor, yang memudahkan Penyahpepijatan
React Coretan kod Gaya Standard	bertindak balas blok kod Gaya standard
REST Client	Hantar permintaan HTTP gaya REST
Sass	pemalam sass
Segerakan Tetapan	Tetapan VSCode disegerakkan ke Gist
Isih baris	Isih baris yang dipilih
Isih Import Skrip Taip	isih import skrip taip
Manipulasi Rentetan	Pemprosesan penukaran rentetan (kes unta, permulaan modal, garis bawah, dll. )
stylelint	gaya kod css/sass/kurang
SVG Viewer	SVG Viewer
Menyegerakkan	tetapan vskod disegerakkan ke inti
Penjana Spesifikasi Ujian	Penjanaan kes ujian (menyokong chai, should, jasmine)
TODO Parser	Todo Management
Todo Todo Tree	Kumpulkan ulasan TODO dalam kod dan sokong carian pantas
Togol Petikan	Togol petikan dalam JS, " -> ' - > `
TS/JS postfix siap	gesaan akhiran ts/js
TSLint	sintaks TypeScript semak
Jenis auto installer	Pemasangan automatik @types mengisytiharkan kebergantungan
TypeScript Hero	TypeScript Helper Plug- masuk, urus import, garis besar, dsb.
Import TypeScript	Import automatik TS
Penyusun Import TypeScript	pengisihan import
coretan kod Typescript React	Coretan TypeScript React
TypeSearch	Carian fail pengisytiharan TS
Versi Lens	Fail package.json memaparkan versi semasa dan terkini modul
vetur	Vue Plugin
Volar	Pemalam Vue, menyokong Vue3
Lihat Pakej Nod	Buka halaman utama dan repositori kod modul yang dipilih dengan cepat
Visual Studio IntelliCode	Gesaan kod berasaskan AI
VS Live Share	Bantuan berbilang pemain masa nyata
Ikon Hebat VSCode	Pelanjutan ikon fail
vscode-database	Pangkalan data operasi, menyokong mysql dan postgres
vscode-icons	Ikon fail, mudah untuk mencari fail
vscode-random	Penjana Rentetan Rawak
vscode-spotify	Sepadukan spotify, mainkan muzik
komponen gaya vskod	sokongan menonjolkan komponen gaya
vscode-styled-jsx	styled-jsx highlighting support
Vue Peek	Menyokong melompat ke fail definisi komponen Vue
Vue TypeScript Snippet	Vue TypeScript Snippet
VueHelper	coretan kod Vue2 (termasuk Vue2 api, vue -router2, vuex2)
Wallaby.js	Palam Ujian Langsung -dalam
Balut Console Log Lite	Ya Pilih kod untuk cepat console.log

2. Tema

Nama	Pratonton
Tema Atom One Light
bluloco-gelap
bluloco-light
Tema Enki
eppz! (Tema C# untuk Perpaduan)
Tema Eva
UI Rata
Tema GitHub
Monokai Pro
New Moon VSCode
One Dark Pro
Plastic
spacegray-vscode
Splus

三、个人首选项配置（仅供参考）

{  "breadcrumbs.enabled": true,  "editor.tabSize": 2,  "editor.renderWhitespace": "boundary",  "editor.cursorBlinking": "smooth",  "editor.minimap.renderCharacters": false,  "editor.fontFamily": "'Fira Code', 'Droid Sans Mono', 'Courier New', monospace, 'Droid Sans Fallback'",  "editor.fontLigatures": true,  "explorer.confirmDragAndDrop": false,  "extensions.autoUpdate": false,  "files.insertFinalNewline": true,  "git.autofetch": true,  "git.path": "F:\\Program Files\\Git\\cmd\\git.exe",  "search.exclude": {    "**/node_modules": true,    "**/dist": true
  },  "typescript.locale": "en",  "window.titleBarStyle": "custom",  "window.title": "${dirty}${activeEditorMedium}${separator}${rootName}",  "window.zoomLevel": 1,  "workbench.activityBar.visible": true,  "workbench.colorTheme": "Plastic - deprioritised punctuation",  "workbench.iconTheme": "vscode-great-icons",  "workbench.startupEditor": "newUntitledFile",  "eslint.autoFixOnSave": true,  "eslint.validate": ["javascript", "javascriptreact", "vue"],  "vsicons.projectDetection.autoReload": true,  "vsicons.dontShowNewVersionMessage": true,  "tslint.autoFixOnSave": true,  "debugwrapper.wrappers": {    "default": "console.log('$eSEL', $SEL)"
  },  "prettier.tslintIntegration": true,  "cSpell.userWords": [    "Unmount"
  ],  "jest.autoEnable": false,
}

Atas ialah kandungan terperinci [Sangat disyorkan] Ringkasan terkini pengembangan VSCode!. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!