Giter Club home page Giter Club logo

vscode-snippet's Introduction

vscode-snippet

The MIT License GitHub GitHub Marketplace

A Visual Studio Code extension for cht.sh. Watch this lightning talk to learn more.

Features

  • Zero configuration: works out of the box.
  • Automatically detects programming language from current editor window.

Config options

  • openInNewEditor: open snippets or in new editor window (default) in line with current document.
  • verbose: add comments around code snippets.
  • baseUrl: base url of the cheat server (see cheat.sh documentation)
  • http.proxy: VS Code proxy setting. If set, requests made by vscode-snippet will be sent through provided proxy (see Visual Studio Code network settings)
  • defaultLanguage: Programming language name in lower case to use as default language when there is no open editor window.
  • title: Template string of a snippet title. You can use the following variables:
    • ${language} - the programming language
    • ${query} - the snippet query (search text)
    • ${index} - the index of the snippet (e.g. 2 for the third answer)
  • insertWithDoubleClick: insert snippet with double click.
  • showCopySuccessNotification: Whether to show a notification after the snippet is copied to the clipboard.
  • saveBackups: Whether to create backups of the snippets.

Installation

Install this extension from the VSCode Marketplace

Usage

Search for a snippet

  1. Hit โŒ˜ Command + โ‡ง Shift + p
  2. Run Snippet: Find.
  3. Type your query and hit enter.

Preview

Moving between answers

Sometimes the first answer is not what you're looking for. In that case, use Snippet: Show next answer and Snippet: Show previous answer to show alternative snippets.

Search for snippet based on selected text

  1. Select some text in an editor window.
  2. Right click and choose "Find snippet from selected text"

Preview

Alternatively, you can also run the Snippet: Find Selected Text from the command menu:

Preview

You can configure a keyboard shortcut. By default this is โŒ˜ Command + โ‡ง Shift + s:

Preview

Saving a snippet

  1. Select some text in an editor window.
  2. Right click and choose "Save snippet"
  3. Select a folder for the snippet
  4. Enter a name of the snippet
  5. Press Enter

Preview

Inserting a snippet

  1. Open the Explorer by clicking Ctrl + Shift + E
  2. Open the Snippets section
  3. Click on the snippet that you want to insert

Preview

Creating a folder for the snippets

  1. Open the Snippets section
  2. Click on the + icon (alternatively, you can right click on any snippet or a folder and select "New Folder")
  3. Enter a name of the folder
  4. Press Enter

Preview

Renaming a snippet or a folder

  1. Open the Snippets section
  2. Right click on the snippet or a folder that you want to rename
  3. Select "Rename"
  4. Enter a new name
  5. Press Enter

Preview

Deleting a snippet or a folder

  1. Open the Snippets section
  2. Right click on the snippet or a folder that you want to delete
  3. Select "Delete"
  4. Confirm your choice

Preview

Copying a snippet to the clipboard

  1. Open the Snippets section
  2. Right click on the snippet that you want to copy
  3. Select "Copy"

Moving a snippet or a folder

You can move snippets or folders in the Snippets view by dragging and dropping them

Preview

IntelliSense

Saved snippets are displayed in IntelliSense

Preview

Searching for saved snippets

Preview

Restoring snippets from backups

Restoring with the built-in backup mechanism

vscode-snippet creates backups of your snippets when you delete, rename, move or save snippets. These backups are stored locally on your computer.

To restore a backup:

  1. Open the Snippets section
  2. Click on the History icon icon (alternatively, you can run the "Restore backups" command)
  3. Select one of the backups from the list

Demo of restoring backups

Restoring with the VSCode settings sync

If you have VSCode settings sync enabled, you can restore snippets by using VSCode's built-in backup mechanisms: https://code.visualstudio.com/docs/editor/settings-sync#_restoring-data

Exporting snippets

VSCode stores snippets in the state.vscdb file in a JSON format.

To export the snippets:

  1. Find the state.vscdb file
    • On Ubuntu Linux: ~/.config/Code/User/globalStorage/state.vscdb
    • On Windows: AppData\Roaming\Code\User\globalStorage\state.vscdb
    • On macOS: ~/Library/Application Support/Code/User/globalStorage/state.vscdb
  2. Inspect the content of this file using some tool that can open SQLite files, for example: https://inloop.github.io/sqlite-viewer
    1. On this website, upload the state.vscdb file and run the following command:
    SELECT * FROM 'ItemTable' WHERE key like 'vscode-snippet.snippet'
    SQLite Viewer 2. Then click "Execute". You should get a single row with the key vscode-snippet.snippet and a JSON value. This JSON contains all of your snippets.

Contributing

See CONTRIBUTING.md

vscode-snippet's People

Stargazers

 avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar

Watchers

 avatar  avatar  avatar  avatar  avatar  avatar

vscode-snippet's Issues

Grab error messages from the command line

We should have a way to grab error messages from the command line. In VSCode, we've got "output", "debug console" and "terminal" and each can contain things to search for. Not sure how we could do this yet, but I'm open for suggestions and pull requests. ๐Ÿ˜‰

request: add to OpenVSX

Users who installed VSCode from the Arch or Manjaro repositories can't find the extension as the OpenVSX marketplace is used instead of the one from Microsoft. See alo here: microsoft/vscode#107997 (comment)

Currently vscode-snippet is not listed on OpenVSX. Users could workaround by downloading the package from the MS marketplace as a vsix file and then install from local.

Loading status bar does not hide

While i was working in #5 i noticed an error. If you press Ctrl+Shift+P and then select Snippet: Find or Snippet: Find Inplace or Snippet: Find in new editor window and then press Esc the Loading Snippet... show up in status bar and doesn't hide. I think that when I fixed #8 I forgot to handle with this situation.

The error that occur and is prompted to console is:

TypeError: Cannot read property 'replace' of undefined
extensionHostProcess.js:89
	at asyncRequest (/home/gian/repos/vscode-snippet/out/extension.js:50:36)
...

The line that is causing this error is:

let query = encodeURI(queryRaw.replace(/ /g, '+'))

Turning loadingStatus into a global variable and adding a try/catch block in the line that is causing the error and calling loadingStatus.hide() in it should solve the error.

http_proxy_agent_1.HttpProxyAgent is not a constructor

Trying to find a snippet behind a proxy fails with

notificationsAlerts.ts:38 Error: http_proxy_agent_1.HttpProxyAgent is not a constructor
at Object. (C:\Users\b275aj3.vscode\extensions\vscode-snippet.snippet-0.6.1\out\query.js:80:25)
at Generator.next ()
at fulfilled (C:\Users\b275aj3.vscode\extensions\vscode-snippet.snippet-0.6.1\out\query.js:4:58)

This seems to be related to the HttpProxyAgent call

let agent = new HttpProxyAgent(proxy)

or the corresponding import

import { HttpProxyAgent } from 'http-proxy-agent'

Wild guess: It seems that HttpProxyAgent is regarded as type 'any' when I look at the file in vscode, so maybe the dependency wasn't loaded correctly.

Extension version: 0.6.1
VS Code version: Code 1.36.1 (2213894ea0415ee8c85c5eea0d0ff81ecc191529, 2019-07-08T22:59:35.033Z)
OS version: Windows_NT x64 10.0.17134

System Info
Item Value
CPUs Intel(R) Core(TM) i5-6500 CPU @ 3.20GHz (4 x 3192)
GPU Status 2d_canvas: enabled
flash_3d: enabled
flash_stage3d: enabled
flash_stage3d_baseline: enabled
gpu_compositing: enabled
multiple_raster_threads: enabled_on
native_gpu_memory_buffers: disabled_software
oop_rasterization: disabled_off
protected_video_decode: unavailable_off
rasterization: enabled
skia_deferred_display_list: disabled_off
skia_renderer: disabled_off
surface_synchronization: enabled_on
video_decode: enabled
viz_display_compositor: disabled_off
webgl: enabled
webgl2: enabled
Load (avg) undefined
Memory (System) 15.88GB (2.74GB free)
Process Argv
Screen Reader no
VM 0%

[Feature request] Visual Studio IDE's ToolBox alternative for VSCode

Visual Studio IDE has a nice feature: ToolBox, witch gives you ability to save and use pieces of boilerplate code:

tImg

Can't find a similar extension for VSCode. There many extensions with the similar name but they serve different job and are a bit complicated for me.

Can you add similar feature to your extention please?

Also add ability to group different commands in different folders like on the gif.

P.S. I' not talking about snippets which are built in VSCode, this is different.

Export, import

Hello! Your app is incredibly convenient. However, I can't figure out how I can transfer (export, import) my snippets from one computer to another. Is it posible?

Send request snippet error

Hi,

love the extension but I ran into an error when I searched for "send request" from a javascript file (I also tried "send request javascript").

It created a file with this inside:

>>> import requests
>>> r = requests.post("http://bugs.python.org", data={'number': 12524, 'type': 'issue', 'action': 'show'})
>>> print(r.status_code, r.reason)
200 OK
>>> print(r.text[:300] + '...')

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
<head>
<title>
Issue 12524: change httplib docs POST example - Python tracker

</title>
<link rel="shortcut i...
>>> 

Thanks!

Update package.json

It's nice to update the package dependencies from time to time.

What would have to be done:

  1. Update the package.json using npm update
  2. Test if the plugin still works by installing the development build and testing it.
  3. Create a pull request with the updated package.json and package.lock.

This ticket is ideal for people who are interested in getting started with VSCode plugin development.

Allow result to be opened in unnamed editor

Right now, the result from cheat.sh will be directly inserted at the current cursor position.
It would also be cool if we could show the result in a separate (unnamed) editor window - similar to a buffer in VIM.
Maybe there is a way to open a new window when the user hits Shift + Enter instead of Enter after typing in the query?
In addition to that, we could offer a config option for changing the default behavior.

Add unit tests

Since this plugin is slowly gaining popularity, I'd like to avoid breaking it with a bad release.
Hence, I'd like to add some unit tests. I have no idea how to do that in the VSCode/Typescript ecosystem.
Probably something like this from VSCodeVim: https://github.com/VSCodeVim/Vim/tree/master/test
If anyone has an idea or can give me some pointers, I'd be very thankful.

Add own snippets or private snippets

An easy way of adding own snippets would be very nice to have. Adding directly to cheat.sh/ following some template for QC - or just private snippets.

Catch error when making axios request

The request handling of this VSCode plugin is not handling errors at the moment.
Here is the request code:

private async _doRequest(): Promise<AxiosResponse> {
let query = encodeURI(this.currQuery.replace(/ /g, "+"));
let url = this.getUrl(this.currLanguage, query);
let data = this.requestCache[url];
if (data) {
return data;
}
let res = await axios.get(url, this._requestConfig());
this.requestCache[url] = res;
return res;
}
}

As you can see, we don't check for errors in line 106.
It would be great to catch errors there and show and error message to the user.
You can test this by going offline and searching for a snippet. In this case it should show an error message (and not silently fail).

Fixing this issue will probably help troubleshooting #77, so there is some real user value.

Refactor codebase

vscode-snippet is now quite popular and we kept adding features but the codebase has grown without too much prior planning.
As a consequence, we should do some clean up now to get it back in shape.

Here are some thoughts:

  • Split functionality across files.
  • Move repetitive code into separate functions.
  • Separate request handling from commands to allow for unit testing.
  • Add some unit tests for the core logic.

If anyone wants to tackle this, feel free to send PRs.

request about python makes command palette unresponsive

When searching for a snippet in any language other than python, it works as intended and return meaningful results.

But when doing the same for python language though, no matter the keywords, it always return the same result:

#  Does Python have a ternary conditional operator?
#  
#  Yes, it was [added][1] in version 2.5. The expression syntax is:

a if condition else b
...

Then the command palette becomes unresponsive and I need to reload the window.

python is the language i use the most and It was working before without any issue.

I tried to

  • uninstall-reinstall the extension
  • delete the ..\.vscode\extensions\vscode-snippet.snippet-0.8.1 folder

Can't make it to work ๐Ÿ˜ฟ

Vscode: 1.56.1 (system setup)
vscode-snippet:  0.8.1
OS: Windows_NT x64 10.0.18363

Error running

I can't save any snippet. So when i click on add it shows me this error msg:
Error running command snippet.createFolder: command 'snippet.createFolder' not found. This is likely caused by the extension that contributes snippet.createFolder.

I reset the extension setting. Disable it and then able it and it still the same error.

I tried to remove so many vs code extension and it still getting the same error.

What it cause this? What is the solution?

Thank you for the support

Link Checker Report

Errors were reported while checking the availability of links.


๐Ÿ“ Summary
---------------------
๐Ÿ” Total...........16
โœ… Successful......15
โณ Timeouts.........0
๐Ÿ”€ Redirected.......0
๐Ÿ‘ป Excluded.........0
๐Ÿšซ Errors...........1

Errors in README.md
โœ— https://cht.sh/ (HTTP status server error (500 Internal Server Error) for url (https://cht.sh/))

Full Github Actions output

Link Checker Report

Errors were reported while checking the availability of links.


๐Ÿ“ Summary
---------------------
๐Ÿ” Total...........16
โœ… Successful......15
โณ Timeouts.........1
๐Ÿ”€ Redirected.......0
๐Ÿ‘ป Excluded.........0
๐Ÿšซ Errors...........0

Errors in README.md
โง– https://vsmarketplacebadge.apphb.com/installs/vscode-snippet.Snippet.svg?style=flat-square

Full Github Actions output

Implement new live-suggestion feature of cheat.sh

In #5, @chubin mentioned a new interface for live suggestions in cheat.sh:

$ curl cheat.sh/python/create+empty?query=complete
create empty list
create empty array
create empty file
create empty dict
create empty set

(See here: #5 (comment))

This is a tracking ticket for this feature.
As soon as it becomes available, we should add it to vscode-snippet, as it provides a lot of value in my opinion.

Link Checker Report

Errors were reported while checking the availability of links.


๐Ÿ“ Summary
---------------------
๐Ÿ” Total...........16
โœ… Successful......15
โณ Timeouts.........1
๐Ÿ”€ Redirected.......0
๐Ÿ‘ป Excluded.........0
๐Ÿšซ Errors...........0

Errors in README.md
โง– https://code.visualstudio.com/docs/setup/network

Full Github Actions output

Toggle the comments off/on for a single snippet

It would be nice to be able to toggle the comments off/on (for one snippet).
It is possible to fully disable comments completely, but it is not the same,
because usually, you want to get an answer with the comments, read them, and then remove them if you don't need them.

Not sure how to implement that yet, but pull requests and links to similar projects are welcome.
Further discussion: chubin/cheat.sh#93

A little more documentation

Is it possible to add a little more documentation?

I was creating a snippet for the launch.json file, but could not get the $1 and $2 variables working at all, so I ended up just using \t.

And how do we specify something like ${workspaceFolder} without the engine stripping the {} characters?

Example:
"\t\"program\": \"${workspaceFolder}/bin/debug/netcoreapp3.1/compiled.dll\",",

Result:
"program": "workspaceFolder/bin/debug/netcoreapp3.1/compiled.dll",

Desired result:
"program": "${workspaceFolder}/bin/debug/netcoreapp3.1/compiled.dll",

Link Checker Report

Errors were reported while checking the availability of links.


๐Ÿ“ Summary
---------------------
๐Ÿ” Total...........16
โœ… Successful......14
โณ Timeouts.........0
๐Ÿ”€ Redirected.......0
๐Ÿ‘ป Excluded.........0
๐Ÿšซ Errors...........2

Errors in README.md
โœ— https://img.shields.io/github/release/mre/vscode-snippet.svg?style=flat-square (HTTP status server error (525 <unknown status code>) for url (https://img.shields.io/github/v/release/mre/vscode-snippet.svg?style=flat-square))
โœ— https://img.shields.io/badge/Marketplace-Snippet-blue.svg?colorA=24292e&colorB=0366d6&style=flat&longCache=true&logo=data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAA4AAAAOCAYAAAAfSC3RAAAABHNCSVQICAgIfAhkiAAAAAlwSFlzAAAM6wAADOsB5dZE0gAAABl0RVh0U29mdHdhcmUAd3d3Lmlua3NjYXBlLm9yZ5vuPBoAAAERSURBVCiRhZG/SsMxFEZPfsVJ61jbxaF0cRQRcRJ9hlYn30IHN/+9iquDCOIsblIrOjqKgy5aKoJQj4O3EEtbPwhJbr6Te28CmdSKeqzeqr0YbfVIrTBKakvtOl5dtTkK+v4HfA9PEyBFCY9AGVgCBLaBp1jPAyfAJ/AAdIEG0dNAiyP7+K1qIfMdonZic6+WJoBJvQlvuwDqcXadUuqPA1NKAlexbRTAIMvMOCjTbMwl1LtI/6KWJ5Q6rT6Ht1MA58AX8Apcqqt5r2qhrgAXQC3CZ6i1+KMd9TRu3MvA3aH/fFPnBodb6oe6HM8+lYHrGdRXW8M9bMZtPXUji69lmf5Cmamq7quNLFZXD9Rq7v0Bpc1o/tp0fisAAAAASUVORK5CYII= (HTTP status server error (525 <unknown status code>) for url (https://img.shields.io/badge/Marketplace-Snippet-blue.svg?colorA=24292e&colorB=0366d6&style=flat&longCache=true&logo=data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAA4AAAAOCAYAAAAfSC3RAAAABHNCSVQICAgIfAhkiAAAAAlwSFlzAAAM6wAADOsB5dZE0gAAABl0RVh0U29mdHdhcmUAd3d3Lmlua3NjYXBlLm9yZ5vuPBoAAAERSURBVCiRhZG/SsMxFEZPfsVJ61jbxaF0cRQRcRJ9hlYn30IHN/+9iquDCOIsblIrOjqKgy5aKoJQj4O3EEtbPwhJbr6Te28CmdSKeqzeqr0YbfVIrTBKakvtOl5dtTkK+v4HfA9PEyBFCY9AGVgCBLaBp1jPAyfAJ/AAdIEG0dNAiyP7+K1qIfMdonZic6+WJoBJvQlvuwDqcXadUuqPA1NKAlexbRTAIMvMOCjTbMwl1LtI/6KWJ5Q6rT6Ht1MA58AX8Apcqqt5r2qhrgAXQC3CZ6i1+KMd9TRu3MvA3aH/fFPnBodb6oe6HM8+lYHrGdRXW8M9bMZtPXUji69lmf5Cmamq7quNLFZXD9Rq7v0Bpc1o/tp0fisAAAAASUVORK5CYII=))

Full Github Actions output

backup and local file

Hi,
Is there a way to store the snippets I added to local file so I can backup them?

Not work in remote container

I run my code inside the container on remote machine. I link remote container with vscode ssh, and I install Snippet extension inside the container, but when I use Snippet find, it takes long time to load, and then open a empty file, no result shows in the file.

It seems there is a network error, but I'm sure my docker connect the network well. I can connnect the internet by the docker terminal inside the vscode terminal panel, and I also can install vscode extensions to the the container, so I'm not sure why this happens, is there any log files can I inspect the errors?

I also tested Snippet on the my local machine, and it works fine.

Make snippet title configurable

As soon as #27 gets merged, we could add a config option for changing the snippet title.
The default would be [language] snippet query, e.g. [python] split string, but we could make that adjustable.
For instance, users could decide to set it to split string - python or anything else.

To make this work, we document the variable names that are supported for the title string:

  • ${language} - the programming language
  • ${query} - the snippet query (search text)
  • ${index} - the number of the snippet (e.g. 3 for the third answer)
  • maybe more

Not all available languages are listed

It seems that not all languages that are available from cht.sh, are available through the plugin.

For example, I was trying to look up a git command (https://cht.sh/git), but the list of languages doesn't list 'git'.

image

I understand that 'git' is not a language and not a file type, but it would be helpful to be able to look up git commands using the plugin.

PS. Thank you so much for the plugin!

Rewrite as virtual document provider

VSCode has this fancy feature called "virtual document providers".

With that, vscode-snippet would simply become a provider that gets triggered whenever a certain URL gets requested, e.g. snippet://read+file.
The cool thing about it would be that we could have "read only" documents instead of the current "untitled" documents that have to be closed manually. We can also set a document title, e.g. the search query and the programming language (i.e. [python] read file).
On top of that, I assume that this would also reduce the code size quite a bit as a lot gets handled by VSCode itself.

Here is an example on how to implement it.
If anyone wants to give this a go, help would be really appreciated!

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    ๐Ÿ–– Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. ๐Ÿ“Š๐Ÿ“ˆ๐ŸŽ‰

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google โค๏ธ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.