The following is a tutorial column of sublime to compare sublime and vscode. I hope it will be helpful to friends in need!
The reason is that I installed eslint to automatically check and complete the code. I installed n plug-ins and still got an error. In addition, the original cracked version of sublime recently opened a pop-up. box prompt. So, with the help of my friends, I tried vscode and my experience was perfect.
1. Comparison between sublime and vscode
Advantages of sublime
- Mainstream front-end development editor
-
- Small size, fast operation, fast startup
-
- Powerful text function
-
- Supports compilation, and the output can be seen on the console
-
- A large number of plug-ins can be installed to meet customized needs (ctrl shift p, ip, search for plug-in installation)
-
- Lightweight, use small projects
Disadvantages of sublime:
- Paid closed source, slow bug fixing time
-
- When installing a plug-in, there is only a list of plug-ins and a simple description is displayed. Plug-in configuration is inconvenient. Many plug-ins sublime2 and sublime3 are incompatible.
vscode advantages:
- Free, the most important thing is no money.
-
- There are many plug-ins. Recently, vscode has been developing rapidly. It is convenient and simple to install plug-ins. There is a detailed introduction to plug-ins.
-
- Low memory usage, startup speed, and opening speed are relatively fast
-
- Full platform, with built-in strong support for JavaScript, TypeScript and Node.js, C, C#, Python, PHP and other languages
vscode Disadvantages:
- Not stable enough
-
- Startup speed and opening speed are not as fast as sublime, so it is more suitable for large projects.
2. vscode installation
Official website download, install directly
https://code.visualstudio.com/
3. vscode commonly used Plug-in installation
View--Extensions (or shortcut key ctrl shift .
- HTML Snippets, prompts basic h5 code snippets, tags, etc.
-
- HTML CSS Support, let the html tag be written with class, and intelligently prompt the styles supported by the current project.
-
- view in browsers, ctrl f1 in the default browser, run the current html
-
- vscode-icon, add the corresponding icon to the vscode folder directory. (If it does not take effect, reselect the setting in [File-Preferences-File Icon Theme])
-
- path intellisense, the file path is automatically completed.
-
- npm intellisense, require reference package completion
-
- bracket pair colorizer, let the brackets have independent colors
-
- auto rename tag, modify the tag to close
-
- vetur, vue plug-in, syntax highlighting, intelligent perception, emmet
-
- tortoiseSvn, svn plug-in
-
- auto close tag, automatically add html and xml closing tags
-
- beautify, formatting code
-
- change-case, modify more explicit formats of text, camel case naming, underscore split naming, etc.
-
- chinese(Simplified)Language Pack for Visual Studio, students who are not used to English in vscode can download and install this, Chinese Simplified Language Pack
-
- color info, hover the cursor over the color to preview the detailed information of the color model in the color block,
-
- css peek, trace to the place where the css class and id are defined in the style sheet. In the right-click menu of the html file, when clicking the selector, select "go to definition" and it will jump to the css style code segment
-
- debugger for chrome, front-end debugging
-
- eslint, check syntax errors in js programming
-
- html boilerplate, html template plug-in, create html files with one click
-
- htmlHint, html code format detection
-
- image preview, the mouse is on the image path to display the image preview
-
- intelliSense for CSS class names in HTML, put the names in the css files in the project and intelligently prompt them in html
-
- JavaScript (ES6) code snippets, es6 code snippet tips
The above is the detailed content of Compare sublime and vscode. For more information, please follow other related articles on the PHP Chinese website!