QuickTips

We need you! The extension stil lacks a lot of useful tips in package.json
. Feel free to propose new ones on our GitHub repository.
Description
QuickTips is a VS Code extension which displays some useful tips and tricks in a popup.

It helps newcomers getting more productive with the editor and its extensions by occasionally learning a new tip.
Note: The QuickTips popup will never be automatically opened at VS Code startup ;-)
QuickTips allows extensions developers to add their own tips in package.json
without declaring it as a dependency. See the API section if you want to add quick tips for your own VS Code Extension.
List of supported extensions
Usage
Press F1
and select the command with title: QuickTips: Display a useful tip about VS Code and its installed extensions
.
Tip: Unless you have a conflicting extension, using the tip
or quicktips
keywords should be sufficent.
This will open a popup displaying a randomly selected tip.

Clicking on More Info will open a new webpage with more detailed information about the tip.
Clicking on New Tip will open a new random tip.
Installation
With Visual Studio Code
Hit Ctrl+P
and enter the ext install quicktips
command.
With Git
** Note ** Prefer the previous solution unless you are aware of the consequences.
In a command-line shell, cd
into your local extensions folder:
- Windows:
%USERPROFILE%\.vscode\extensions
- Mac / Linux:
$HOME/.vscode/extensions
Once done, enter the following commands:
git clone https://github.com/bbenoist/vscode-quicktips
cd vscode-quicktips
npm install
npm run compile
Issues / Feature requests
You can submit your issues and feature requests on the GitHub issues page.
Contributing
New quick tips are welcome!
Simply add your own in package.json
and open a new pull request.
See CONTRIBUTING.md
for more detailed guidelines.

API
QuickTips can automatically load additional tips from the package.json
file of other extensions.
Which means that you simply have to add a quickTips
property in it to have them included in the QuickTips command.
That's it, no additional npm dependency is required. End-users of your extension will not be forced to install QuickTips.
Each item of the quickTips
property must be an object with the following fields:
{
// The message to display in the popup.
tip:string,
// An optional URL to open when clicking on the More Info button.
url?:string
}
QuickTips eats its own dogfood. Which means that you can see a working example in the package.json
file of this extension.
Note: Be sure to list your extension in the dedicated wiki page to make your end-users aware of your QuickTips support.
Here is an alternative example based on the Hello World VS Code extension tutorial:
{
"name": "myFirstExtension",
"description": "",
"version": "0.0.1",
"publisher": "",
"engines": {
"vscode": "^0.10.1"
},
"categories": [
"Other"
],
"activationEvents": [
"onCommand:extension.sayHello"
],
"main": "./out/src/extension",
"contributes": {
"commands": [{
"command": "extension.sayHello",
"title": "Hello World"
}]
},
"scripts": {
"vscode:prepublish": "node ./node_modules/vscode/bin/compile",
"compile": "node ./node_modules/vscode/bin/compile -watch -p ./"
},
"devDependencies": {
"typescript": "^1.7.5",
"vscode": "^0.11.x"
},
"quickTips": [
{
"tip": "You can add your own quick tips with the quicktips public API.",
"url": "https://github.com/bbenoist/vscode-quicktips"
},
{ "tip": "URL is optional, you are not forced to use it" }
]
}
Credits
Icon made by Freepik from www.flaticon.com.