can I add custom default code in visual studio code - visual-studio-code

Can I create a default code on VSC, that whenever I open a new page to write a code my default code(my written code) is there already?

you can use the extension: File Templates
You can specify global or project templates, based on name and extension.

Related

Share Visual Studio Code editor settings for alternate file extensions

How can I configure VS Code settings so that the editor for an alternate file type (different file extension) that contains text in the format of a well-known existing editor type can reuse/share the existing editor and editor settings?
A couple of editors where this might be common are custom file extensions that might contain YAML, JSON, or XML. I have alternative file extensions with this content but want to use the existing editor and settings.
One example is essentially telling VS Code that a RAML file should be edited as YAML. There are many examples for each of YAML, JSON, and XML where this would be useful.
p.s. I know that if there is an editor extension available for a specific file extension, this would not be necessary. This is for the case where either there is no editor extension or the extension does not provide editor customization (tabs, etc.)

How can I open a new Visual Studio Code file with pre-set template code inside it?

I would like to know if it is possible to open a new file in Visual Studio Code with code already written inside it, like a template code.
This is to save time instead of writing the same line of code on every new file I create for a project.
I found that what I was asking for was essentially how to create a code snippet that holds a template code. In Visual Studio Code:
Use Ctrl+Shift+P (Windows) and search preferences:Configure User Snippits
Then search javascript.json
Then write in your code (if you don't know the format use: https://snippet-generator.app/ or search how to write it)
Then add that code and use your assigned prefix keyword to generate the template on your file.

Is there a way to put a VS Code snippets file in a non standard folder and have VS Code use it?

I want to create a standard VS Code snippets file for my team. We use Perforce for version control and I'd like to create a snippet file in our project folder and point VS Code to it. I just want people to be able to sync up and have them just have updated snippets.
I think Project-level snippets will do what you want:
Project level snippets
Snippets can now be scoped to a project and
shared with your team. Simply use the Preferences: Configure User
Snippets command or create *.code-snippets file in the .vscode folder.
Project snippets work just like other snippets, they show up in
IntelliSense and in the Insert Snippet action where they now have
their own category
More info: https://code.visualstudio.com/updates/v1_28#_project-level-snippets

How to edit existing VS Code Snippets

Is there a way to remove or edit some of the default code snippets in Visual Studio CODE ?
For example when i type req+TAB i need require not requestAnimationFrame
The extensions snippets can be found inside each snippet directory below:
(if there are snippets in the extension)
Mac/Linux: $HOME/.vscode/extensions/
Windows: %USERPROFILE%\.vscode\extensions/
Select the extension you want to modify and then dive into the javascript.json file in snippets/ directory in there, and change whatever you like.
Just remember that if/when you choose to download and update the extension someday, all your personal modifications will get overwritten/replaced out with the updated version of the file.
(unless of course you squirrel away your changes outside of the extension's directory...)
Edit/Aside:
Looking closely at all the copied editions already present in this directory, it appears that at least some of the extension updates keep the former version around. If this is the case, when you update an extension when a new version is released, you wouldn't need to worry about storing a copy of your modified file somewhere else; returning a file to active duty might just be as easy as a copy-paste from the old into the appropriate, newer, higher numbered directory.
Resources/citations/acknowledgements:
Thanks to here for helping initially pointing me towards the relevant directory.
The suggestion item requestAnimationFrame is coming from the JavaScript language service. It's not coming from the snippets.
However, you can define your own snippets and tell Visual Studio Code to show the snippets first. How to do it:
Go to File -> Preferences -> User Snippets and select JavaScript in order to edit snippets for that language
Add this entry to the opened file javascript.json and save it
"require": {
"prefix": "req",
"body": [
"require"
],
"description": "Add 'require'"
}
Add the following line to your preferred settings.json (user or workspace settings) and save it
"editor.snippetSuggestions": "top"
Now you get your self defined require suggestion in first place as soon as you type req in a .js file.
On my Windows10 machine the log and other default javascript snippets can be found in :
C:\Users\$USER\AppData\Local\Programs\Microsoft VS Code\resources\app\extensions\javascript\snippets\javascript.json
On my Windows installation the default/built-in JavaScript snippets are located in
C:\Program Files (x86)\Microsoft VS Code\resources\app\extensions\javascript\snippets\javascript.json
I renamed that snippet to "logx" (requires admin privileges to modify the file) and restarted vsCode and now have just my user "log" snippet.
There are some threads about this on the issue tracker -
https://github.com/Microsoft/vscode/issues/10565
https://github.com/Microsoft/vscode/issues/48315
Attention everyone!
This is now possible in the latest vscode. Solution here: https://github.com/microsoft/vscode/issues/10565#issuecomment-721832613
That solution tells you how to disable any snippet (including built-in or extension snippets). While this is technically not editing the snippet, disabling the snippet and then creating your own user snippet accomplishes the same exact goal. Yay!
I found mine at ~/.config/Code/User/snippets
If you want to create a global snippet, create a file named snippet_name.code-snippets
If you want a language specific snippet, create it like php.json
Hiding default VSCode snippets is easy:
you can hide specific snippets from showing in IntelliSense (completion list) by selecting the Hide from IntelliSense button to the right of snippet items in the Insert Snippet command dropdown.
https://code.visualstudio.com/docs/editor/userdefinedsnippets#_can-i-remove-snippets-from-intellisense

How can I enable IntelliSense for JavaScript inside HTML?

I want to use VS Code to try out the examples of a JavaScript book, but there's no IntelliSense, or at least I don't know how to activate it.
In Visual Studio this feature works out of the box :
But in VS Code, all I got is a message saying "No suggestions."
What do I need to do to enable IntelliSense in VS Code?
Starting with the November 2016 (version 1.8) release, Visual Studio Code now fully supports IntelliSense for JavaScript in HTML.
Note that the language support doesn't follow script includes, it only knows about definitions made in the same file.
Currently Unsupported
JS intellisense doesnt work in HTML script tag - VSCode GitHub Issues #4369
Smart Javascript suggestions inside HTML files no loger working after Visual Studio Code update - StackOverflow
It worked for me, when the file had a .js extension. I didn't get any intellisense when I pasted it into .html file between script tags.
Edit To Add: You can also change the Language Mode by clicking 'HTML' in the bottom of the VS Code window and change it to 'JavaScript'.
It is supported!
Intellisense and syntax highlighting start working after replacing
<script>something()</script>
with
<script type="text/javascript">something()</script>
Make sure you have HTML language mode selected in the bottom right corner. I had Markdown mode set for an unknown reason (autodetect?) and it didn't work for me. Javascript mode won't work either for HTML files.
Visual Studio Code version 1.4.0 does not support CSS intelli-sense.
I have an extension for CSS style, id and class intelli-sense for html documents:
Features:
Style tag completion and hover.
Style attribute completion and hover.
Id attribute completion.
Class attribute completion.
Scans workspace folder for css files.
Supports optional resource.json file for fine tuned resource selection.
Link:
https://marketplace.visualstudio.com/items?itemName=ecmel.vscode-html-css