Vscode plug-in recommendation (Vue, small program, webapp fried chicken easy to use)

Time:2021-3-5

Auto close tag – auto close HTML tag

Auto rename tag – when modifying HTML tags, automatically modify the matching tags

Background – background

Beautiful – Javascript, JSON, CSS, sass, HTML code highlighting

Beautify CSS / sass / SCSS / less – Code highlight

CSS peek – automatically find CSS files

Debugger for chrome – debugging JavaScript

Easy sass – SCSS / sass files can be automatically generated and synchronously compiled into CSS files with the same name

Easy wxless – wechat applet wxss file dedicated, save, automatically generated and synchronously compiled into the same name CSS file

File peek – move the mouse to the pathname and press and hold Ctrl to open the file

Git History — git log

Gitlens – displays the latest commit and author of the file, and displays the commit information of the current line

HTML class suggestions – class name naming tips

HTML CSS support — an intelligent complement to CSS

HTML snippets – enter or tap to generate Tags

Identifier – indent highlight

IntelliSense for CSS class names – CSS class name intelligent naming tips

JavaScript (ES6) code snippets – JS syntax tips

JavaScript snippet pack code fragment (tab or enter completion), console command, DOM document object model, loop, function, timer, nodejs, BDD, Misc

Live server – HTTP server (equivalent to HTTP server using nodejs, preferences settings user settings configurable change port): ” liveServer.settings.port ”: 8999)

NPM – run NPM command

NPM IntelliSense – when importing a module, the module name will be prompted

Onedark pro – atom’s ionic theme (preferences – color theme, modify theme)

Output colorizer – color output information

Path IntelliSense – automatically complete the path when you enter it in the editor

Prettier code formatter – code formatting (four spaces indented): ” prettier.tabWidth ”: 4)

Px2rem – Px value to REM

Stylelint – CSS / SCSS / less checking tool
Preferences settings user settings configuration:

"stylelint.enable": true, 
"css.validate": false, 
"scss.validate": false 

Svg viewer – Preview SVG images

Vetur Vue syntax highlighting

Vscode great icons – file icon (preferences – file icon theme modification)

Vscode element helper – elementui syntax prompt highlight

Vue Vue syntax highlighting
Preferences settings user settings configuration:

"emmet.syntaxProfiles": { 
    "vue-html": "html", 
    "vue": "html" 
}

Vue 2 snippets – syntax highlighting is added based on the latest Vue official syntax highlighting file, and code completion is added according to Vue 2 API

Vue peek – find Vue component files

Vuehelper – Vue code prompt plug-in, including all vue2 API, vue-router2 and vuex2 code prompt

Preferences settings user settings configuration:
Applet syntax highlight:

"files.associations": { 
    "*.vue": "vue", 
    "*.wpy": "vue", 
    "*.wxml": "html", 
    "*.wxss": "css" 
}

Personal habit configuration:

" editor.fontSize ": 14, // font 
" editor.wordWrap ":" on "// Wrap 
" editor.formatOnSave ": true // save AutoFormat code

reference resources:reference resources

Recommended Today

Practice analysis of rust built-in trait: partialeq and EQ

Abstract:Rust uses traits in many places, from simple operator overloading to subtle features like send and sync. This article is shared from Huawei cloud community《Analysis of rust built-in trait: partialeq and EQ》Author: debugzhang Rust uses traits in many places, from simple operator overloading to subtle features like send and sync. Some traits can be automatically […]