VScode doesn't autocomplete variables in custom snippets

Question

How to turn on the autocompletion in custom-made snippets in VSCode? I create my snippets in javascriptreact.json


  "importReact": {
     "prefix": "import-stateless",
     "body": ["import React from 'react';"],
     "description": "import React statement"
  },

  "consolelog": {
     "prefix": "import-stateless",
     "body": ["console.log($1);"]
  }

and use in my_file.js:

import | from '|'
...
const variable = '';
console.log( | );
...

The problem is: when I type rea in import statement or varia in console.log - VSCode doesn't propose finish my word as react or variable It's problem with custom snippets only, because while manual typing import React from 'r it autocompletes the word react;

Thanks

See "editor.suggest.snippetsPreventQuickSuggestions": false

Mark
– Mark

2019-06-14 14:58:56 +00:00
Commented Jun 14, 2019 at 14:58 — Mark
– Mark, Commented Jun 14, 2019 at 14:58

Oleksiï Nikonov · Accepted Answer · 2019-06-15 12:20:11Z

7

@Mark Thanks for your help! To make work autocomplete in snippets put in settings.json put the suggested line

"editor.suggest.snippetsPreventQuickSuggestions": false

the source

answered Jun 15, 2019 at 12:20

Oleksiï Nikonov

5,6366 gold badges48 silver badges76 bronze badges

Sign up to request clarification or add additional context in comments.

2 Comments

Doug Over a year ago

Thank you for this. It's been bugging me ever since I started using vscode. Can't imagine who would ever want to use this default functionality...

Rohit Vishwakarma Over a year ago

I put the suggested line but its not working for me

internetdrew · Accepted Answer · 2022-03-16 00:01:02Z

0

Just figured this out myself and it's really simple.

The issue is just a matter of the cursor status and making sure it's it's set to the final cursor position.

So anywhere you want to be able to use auto-complete for variables, you just add $0 to that spot when you create the snippet, as that denotes the final cursor position: https://code.visualstudio.com/docs/editor/userdefinedsnippets#_tabstops.

"Print to console": {
    "scope": "javascript,typescript",
    "prefix": "clg",
    "body": ["console.log($0);"],
    "description": "Log output to console"
  }

Unlike the prior suggestion, what this does is actually put your cursor there, so you don't need to move your cursor back into the parentheses after the call.

Happy coding!

edited Mar 16, 2022 at 0:01

answered Mar 15, 2022 at 23:54

internetdrew

791 silver badge3 bronze badges

Collectives™ on Stack Overflow

VScode doesn't autocomplete variables in custom snippets

2 Answers 2

2 Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

2 Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related