I have a file which contains YAML at the top and asciidoc at the bottom. The yaml is surrounded by two lines of ---. The file extension is yaml which is required by the application where it's used.
The only way i know to get a preview out of vscode is to manually rename the file every time i need one and rename it back afterwards.
Is there a way to open the asciidoc preview in vscode while ignoring its extension, e.g. giving a hint, add a configuration or something similar?
The docs only describe that
The extension activates automatically when opening an AsciiDoc file
(.adoc, .ad, .asc, .asciidoc).
Here's a example file:
---
# yaml here
---
asciidoc here
This is surprisingly simple:
https://code.visualstudio.com/docs/languages/overview#_changing-the-language-for-the-selected-file
In VS Code, we default the language support for a file based on its
filename extension. However, at times you may want to change language
modes, to do this click on the language indicator - which is located
on the right hand of the Status Bar. This will bring up the Select
Language Mode dropdown where you can select another language for the
current file.
Tip: You can get the same dropdown by running the Change Language Mode command (Ctrl+K M).
Somebody who used Notepad++ clearly knows about applying custom syntax highlighting to any text, by selecting an option from the "Language" menu, as shown the screenshot below;
This way, one can highlight the text, as he wish. I would like to know, is there any similar mechanism in Visual Studio Code editor, so that I can manually highlight the text even if its not done automatically.
Thanks.
You can change the Language used for a particular instance by clicking on the Language ID field in the Status bar and select the new language from the list.
This executes the command workbench.action.editor.changeLanguageMode or Change Language Mode from the Command palette.
To do a permanent Language ID selection based on the file extension define a setting
"files.associations": {
"*.myext": "html",
"*.myfoo": "css"
}
I am missing this feature from Sublime Text so much. Go to Symbol in Workspace feels so close to it and yet so far away.This is very useful in the following examples:
You have many classes that have the same symbol/function name, Pre-filtering the file lets you jump to the exact definition very fast
You know the name of the file, but you are not sure about the exact symbol/function name. Fuzzy searching it is super fast
You want to quickly preview the available symbols/functions in a given file
Here is a sample video demonstrating this feature in Sublime Text:
https://youtu.be/48f3N0hCaBU?t=109
If this is not currently possible, is it possible to implement as extension?
This is being added in v1.44. See https://github.com/microsoft/vscode-docs/blob/vnext/release-notes/v1_44.md#navigate-from-files-into-symbols
You can now continue to navigate into symbols of a file result simply
by typing #. For the file that is currently selected, all symbols will
appear and the editor will open in the background to reveal the active
symbol.
I created an extension that provide similar functionality:
https://marketplace.visualstudio.com/items?itemName=Cmacu.gotoanything
I've recently started using the Visual Studio Code editor. I'm really loving it, but there's one critical feature (for me) that I haven't been able to find. Is there a method list, similar to the Navigator in NetBeans or Member dropdown in Visual Studio?
Yes, there is the workbench.action.gotoSymbol command. On Windows and Linux it's set to CTRL+Shift+O by default, on Mac it's Cmd+Shift+O.
If this command isn't available for the file types you are working with then you should take a look at the VSCode extensions. Not all languages support this feature.
Update: As stated in the comments by #jeff-xiao this extension is Deprecated and it's now a built in feature of Visual Studio code. It should be available at the bottom of file explorer as "Outline" view.
Previous text:
There is now an Extension that supports this. Code Outline creates a panel in the "Explorer" section and for JavaScript, will list variables and functions in a file. I've been using this for a while now and it scratches the itch I had. Other commenters have mentioned it supports Python and PHP well.
It still seems to be in development but I haven't had any issues. Development version available on GitHub. If you're the author reading this - thanks!
This is how it looks:
If Code Outline is not visible, you can show it by:
Invoke Code's Go to symbol command:
macOS: cmd+shift+o (the letter o, not zero)
Windows/Linux: ctrl+shift+o
Typing a colon (:) after invoking Go to symbol will group symbols by type (classes, interfaces, methods, properties, variables). Then just scroll to the methods section.
In 2020 version of VSCode
Cmd+P
# - Find symbol across files
# - Find symbol within file
#: - Group symbols within a file
In VSCode 1.24 you can do that.
Right click on EXPLORER on the side bar and checked Outline.
There is a new release that can do that!
Check here the latest release notes regarding code outline
UPDATE: The extension features are now built-in and the extension itself is now deprecated
I have found this extention: Code Outline.
This is how it looks like:
I believe that is what you have been looking for.
There's no such feature today,
the CTRL+SHIFT+O == CTRL+P # doesn't work for all languages.
As a last resort you can use the search panel - although it is not so fast an easy to use as you'd like - you can enter this regex in the search panel to find all functions:
function\s([_A-Za-z0-9]+)\s*\(
For PHP users :)
Make sure you have 'PHP Symbol' plugin then you can get all methods and class in 'OUTLINE' Sidebar's Bottom.
Press ⌘ command + ⇧ shift + O in "macOS" or Ctrl + Shift + O while using "Windows"
OUTLINE:
#Symbol:
For python in Explorer View, click on OUTLINE as below:
Visual Studio Code market place has a very nice extension named Go To Method for navigating only methods in a code file.
Hit Ctrl+Shift+P and type the install extensions and press enter
Now type Add to method in search box of extensions market place and press enter.
Click install to install the extension.
Last step is to bind a keyboard shortcut to the command workbench.action.gotoMethod to make it a real productivity thing for a developer.
Watch this link: https://code.visualstudio.com/updates/v1_40#_type-filters-for-outline-and-breadcrumbs
Explorer -> OUTLINE, you can choose what you want to show (only methods and functions in your case) and the result is similar to Netbeans:
Open symbol by name :
CTRL+T
might be what you are looking for. Works perfectly with my TypeScript project.
It is an extra part to the answer to this question here but I thought it might be useful. As many people mentioned, Visual Studio Code has the OUTLINE part which provides the ability to browse to different function and show them on the side.
I also wanted to add that if you check the follow cursor mark, it highlights that function name in the OUTLINE view, which is very helpful in browsing and seeing which function you are in.
ctrl+shift+o // This should work for javascript files by default
For PHP install the extension PHP SYMBOLS
FOR PYTHON install the extension PYTHON
On Reload, this will work fine
in-built code OUTLINE available now with VS code
There is a plugin called show functions which lists all the function definitions in a file. It also allows you to sort the function so can search them easily.
CTRL+F12 (CMD+F12 for Mac) - opens for me all methods and members in PHP class.
For find method in all files you can press CTRL + P and then start search with #
example : #signin
Take a look at Show Functions plugin.
It can list functions, symbols, bookmarks by configurable regular expressions. Regular expressions are a real saver, expecially when you're not using a mainstream language and when CodeOutline doesn't do the job.
It's ugly to see a split window with these functions (CodeOutline seems to be better integrated) but at least there's something to use
If you are using typescript you can use this extension "Code navigator for typescript".
I have been trying it and found it useful to list my typescript class methods.
I have several Mako templates in my project that are named things like header.html.tmpl and settings.py.tmpl. I would like to add file associations to Eclipse to open these with the appropriate editors. For example, I would like header.html.tmpl to be opened in the HTML editor, settings.py.tmpl to be opened in the Python editor, etc. I go to Preferences->File Associations and I try adding *.py.tmpl to the list but after I click "Ok" nothing happens and the desired extension does not appear in the list. If I try instead using .py.tmpl I can add it to the list and add the Python editor to its associated editors but when I double-click a .py.tmpl file it doesn't use the correct editor.
Obviously it would probably work to just use -tmpl instead of .tmpl, but I'm wondering if anyone knows a way around this or can confirm that it's a bug/missing feature.
Its a bug: https://bugs.eclipse.org/bugs/show_bug.cgi?id=168573