Vscode plug-in, by the way, bloggers write the background map plugin

Source: Internet
Author: User

Original: Http://www.cnblogs.com/lianmin/p/5499266.html#dev


write in front to share a Vscode plugin background (used to change the background). Click to jump directly to the Vscode plugin development step

Do Vscode plug-in, long time have this idea, but always because of this, such things delay, give up n times. But it does give me a visual understanding of the document.

Last weekend because the test sister paper to work overtime test, let me also to the company overtime, waiting for possible bugs this reason listen to the nonsense

Of course a group of sister paper is waiting for the company, I must go ... So in the time of waiting for the bug to look at the official documents, here to write a bit of their own results.

This article is divided into 2 parts, 1 is to share their own to do a demo,2 to share their own exploration of some of the production plug-in after the pit of a little experience. official Vscode plugin documentation Https://code.visualstudio.com/docs/extensions/overview Vscode-background plug-in address Https://marketplace.visualstudio.com/items?itemName=shalldie.background GitHub Address Https://github.com/shalldie/vscode-background

Do a vscode background plugin, you can try F1 input ext install background to try, only tested win7,win10.
BY:2016/5/19 Cross All themes! All themes are supported!
By:2016/8/29 a few days ago, added support for Mac

Installation:

There are 3 commands:

Effect Diagram:

specific how to use should be able to understand,,, each operation step I have a Chinese and English tips, as well as the watermark hint. If still do not understand, can play casually, play bad big deal re-install Bai =. = Vscode plug-in development steps, little experience

Say no more than to do it again, here we come together step by step to do a plug-in. On the official network of the Demo,wordcounter, used to count the current page word volume. The official website is typescript, I will not ... Here is an example with Nodejs. I. Setting up the environment and preparing for work

First of all of course is installed Nodejs and Vscode, here I skipped, do not have my mouth.

The Vscode team, which provides a tool for plug-in development, installs this globally and then executes yo code to start our work.

npm install-g yo Generator-code

Yo code


We choose the second item, here need to note: The general situation can be adjusted with the keyboard ↑↓ key, but win10 sometimes pressed the response, this time can enter 2 return to the car, to achieve the same purpose.

Then the following series of options will appear, all the way to the return ... Believe that the name will not everyone, in fact, I myself many times for a variable name will be delayed for a long time, changed many times. 囧

It then automatically executes the NPM install to load the Vscode dependency. I do not have a network here, so the direct difference, I installed with cnpm install, no impact, can be directly closed.

Now that we're ready to work, we're going to start coding. second, the structure of the introduction

.. Third, Hello world,vscode loading plug -In process

Pull so much, first look at the effect of HelloWorld. Press F5 directly

No accident, a prompt message pops up: "Hello World" vscode, how to load and run the plugin.

Here I refer to a lot of information, official website of the documents, and other articles. Level four English, the first time to feel a little effect. Https://code.visualstudio.com/docs/extensionAPI/activation-events http://www.3fwork.com/b102/002764MYM005691/ Https://code.visualstudio.com/docs/extensionAPI/extension-manifest

1.package.json informs Vscode about the events that they define, and how they trigger events

1 2 3 4 5 6 7 8 9 "Activationevents": ["OnCommand:extension.sayHello"], "contributes"

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.