Vs development easy-to-use Extension

Source: Internet
Author: User

First, introduce the development font andProgramDevelopment,CodeReadability, helping developers improve development efficiency

So I will introduce youProgrammer font.

 

After installing vs, I went to the official website to find a few vs extensions, which made my vs2010 much more comfortable to use.

I have installed these extensions here. I hope you can share your comments below after reading them. Let's talk about them one by one. Vs extensions, including controls, templates, and tools. Tools are equivalent to small plug-ins. I installed these tools, which greatly expanded the original functions of the vs environment. Choose tool menu> extended Manager

 

The Extension Manager displays installed extensions that can be enabled or disabled. You can also download new extensions through the online library.

I. Productivity Power Tools My favorite features: 1. Enhanced scrollbar (enhanced scroll bar). Different color points are used to display additional information on the scroll bar on the right of the code window.

Green indicates the saved code after modification, yellow indicates the code that has not been saved after modification, and blue indicates the position of the current cursor. Others include breakpoints, bookmarks, and all the positions where the cursor is located in the document.

2. Solution Navigator (solution Navigator ). This is so easy to use. With it, I have switched off vs's solution Resource Manager. In addition to all functions of vs's own manager, it mainly adds the ability to filter and display files in the solution according to various conditions.

ALL: Show All, open: show only opened files, unsaved: Files Not saved after modification, Edited: There are modified files. In the code, you can also use the CTRL + 1 and CTRL + 2 shortcut keys. If you have any surprises, please explore for yourself.

3. Tab well UI (improved document tag) 4. searchable add reference Dialog (searchable add reference dialog box ). When adding a reference, you can search by keyword. 5. Quick access ). Another powerful feature. Press Ctrl + 3 to open the quick access dialog box. Enter the keyword and press enter to run the menu commands including vs, select the opened document tag, and search for documents in the solution. For example, enter console and press enter to open the Create Project dialog box and select create console application template. 6. Automatic brace completion (this will not translate >_< ). When you enter {, help you complete the input}, and press the tab key to jump to the end. Others also support () [] <> ""'' 7. CTRL + Click Go to definition (CTRL + mouse click to go to definition), not explained. 8. colorized parameter help (parameter help coloring). The parameter data type and keywords are colored in the display tooltip when a method is called.

Download and introduction: http://visualstudiogallery.msdn.microsoft.com/d0d33361-18e2-46c0-8ff2-4adea1e34fef/ Ii. Collapse Selection in Solution Explorer This extension tool provides simple functions, that is, to collapse all the expanded nodes in solution manager with one click. It is useful when there are many projects and documents in the solution. Can be used as a supplement to the solution navigator of the previous tool. Two Operation Methods: Click the toolbar icon of Solution Explorer, and press the shortcut key. The default value is CTRL + ALT + -, you can choose tools> Options> keyboard. Download and introduction: http://visualstudiogallery.msdn.microsoft.com/cb0ec47d-05a4-40a7-ba39-9a2da6492f1c/ Iii. indent guides Add reference lines for code indentation. The code looks much more neat.

Download and introduction: http://visualstudiogallery.msdn.microsoft.com/e792686d-542b-474a-8c55-630980e72c30   Iv. Javascript parser My favorite features: 1. The tree list of all JS functions in the current document. When you hover your mouse over the functions in the list, the comments in the function are displayed.

2. display functions of dynamically registered scripts in debug mode. For example, if a verification control is used on the page, you can display the functions that the verification control adds at runtime.

3. When a function is named by the camel name, you can quickly search for a function by typing the first word of each word. 4. display the // todo comments in the function. This tool has just been installed, and other features continue to be explored... Download and introduction: http://visualstudiogallery.msdn.microsoft.com/288a2b0f-1357-47b4-8215-1134c36bdf30   5. nuget Package Manager Nuget is an online third-party class library. With this manager, you can browse and search for a large number of third-party class libraries online, download them back to your local computer, and reference them to your project. Pretty good.

 

Introduction and download: http://docs.nuget.org/docs/start-here/overview Newest vs web development tool Extension: Web Essentials

Web essentials is the best vs extension tool that we have seen so far. Please wait for me to describe the specific functions.

First, install Extension Manager: the latest version is version 2.5 released on the 19th.

 

 

Restart your vs development environment to use the convenient functions provided by it.

Web essentials provides many quick functions for CSS, JavaScript, and HTML. The specific list is as follows:

CSS

◆ Instantly preview live web Preview

During each modification, you can use the CTRL + ALT + enter shortcut or right-click the live web preview option on the solution to preview your modified page in real time, after each HTML modification or corresponding CSS modification, after Ctrl + S is saved, the real-time window will take effect immediately.

 

 

◆ Compatibility CSS code generation

Many css3 codes are incompatible, and different browsers have different languages. With this extension, you can automatically add special CSS tags, such as-Moz,-WebKit, CSS starting with-MS and-O can only be selected in a specific browser.

 

 

The production code result is as follows:

 

 

If you have added a part of the code, the extension will only add CSS code other than this part, and will not be added again.

◆ Up and down arrows can change numeric values

When you place a keyboard prompt on a number or after a number, such as 5px, 25%, 0.6em, or 23, you can use Ctrl + up or Ctrl + down to increase or decrease the value.

 

 

Supports CSS, sass, less, and JavaScript files

◆ The URL address can be replaced by strings in base64 format.

If you reference the background image through the URL, you can directly convert the reference to the base64 format through the embed resource as base64 feature provided by this extension.

 

 

If the content is too long, you can use the folding function.

 

 

◆ Supports shortcut key comments and reverse comments.

You can use Ctrl + k, CTRL + C or Ctrl + k, CTRL + u to uncomment the code, which is the same as the shortcut key used for C # programming in.

◆ Special support for todo annotations

If any comment includes the todo keyword, a gray special mark will be displayed on the left, prompting you that this part is not complete yet.

 

 

◆ Color Preview

When you move the mouse over the color, you can preview and change the color, or preview the color directly in the CSS editor.

 

 

 

 

◆ Font Preview

 

 

◆ Image Preview

 

 

◆ Fold Function

You need a life selector. Right-click it and you can see surround with region to fold the code.

 

 

After the feature is selected, it will automatically locate the default myregion name, allowing you to modify the name of your folding outline.

 

 

◆ Character sorting

When you click any selector, you can sort the CSS definition of the selector.

 

 

◆ Matching brackets

Currently, matching of {}, [], and () is supported.

◆ Compressed code

The extension uses the ajaxmin library to compress CSS code.

 

 

◆ Code folding

 

 

◆ Drag and drop supported

Supports image and font dragging. For example, if you drag a tomxu.jpg image to the CSS selector, the following code is automatically generated (the font is similar ):

    1. Background-image: URL ('../Tomxu.jpg');

Colors can be directly converted to each other in hexadecimal format, RGB format, and name format.

 

 

You can define only the browser versions supported on the selector.

 

 

You can define only the browser versions supported in the CSS syntax.

 

 

Javascript

◆ Support region folding

    1. // # Region myregion
    2.  
    3. Function example (){
    4.  
    5. }
    6.  
    7. // # Endregion

◆ Code folding supported

 

 

◆ Matching brackets

Currently, matching of {}, [], and () is supported.

◆ Same-word highlight

In all the code of a file, if you select a variable, all the same variables in the code will be highlighted, the same as in C.

◆ Compressed code

The ajaxmin library is used to compress the code. It not only compresses the code, but also uses obfuscation!

◆ Add files quickly

In the solution, when adding a new item, you can directly add a Javascript file or a stylesheet file, which is convenient!

 

 

Html

◆ Supports drag and drop of User Controls

In the past, when we were developing Asp.net webform, we automatically generated a connection when dragging the user control to the ASPX page or template container with the mouse. After using this extension, the naming control is automatically registered, and the code with <UC: Name/> is generated. You can use it directly.

◆ Supports drag and drop of video and audio files

◆ Supports drag and drop of audio and video files.

 

 

Jsenhancements.

Writing JS or CSS code in VISAUL studio 2010 lacks the folding function like when writing C # code. It is inconvenient when there are too many codes.

Today, we found that the vs2010 extension supports this function, which is jsenhancements.

It feels good to use it. To define region, you only need to write # region in the comment.

A good vs plug-in. I believe many people like the code folding feature of vs very much. You can fold a method or class into a row, however, it is a pity that this function cannot be used more than JS and CSS. It is assumed that JS is playing a higher and higher role in development due to the rise of Ajax, but with the lengthy and unfoldable code. Jsenhancements is a perfect complement to this feature, which allows us to fold JS and CSS code in an orderly manner, just as we deal with C # code!

You can see the function as follows:

In some projects, you often need to write a lot of JS Code. In a JS file, there are often many objects and methods, so I said I like this plug-in very much, with another plug-in"Javascript parser", Which is quite powerful!

 

 

Contact Us

The content source of this page is from Internet, which doesn't represent Alibaba Cloud's opinion; products and services mentioned on that page don't have any relationship with Alibaba Cloud. If the content of the page makes you feel confusing, please write us an email, we will handle the problem within 5 days after receiving your email.

If you find any instances of plagiarism from the community, please send an email to: info-contact@alibabacloud.com and provide relevant evidence. A staff member will contact you within 5 working days.

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.