How to add custom tag and attributes for code completions in html language of monaco editor?

Question

I need to provide a list of web components in the code completions of the monaco editor, I tried writing snippets but those snippets are not getting triggered if i start with '<'

Answer 1

I am not sure if there is a ready-to-use solution, I've tried to approach "the hard way" by using XSD (a schema file for defining the syntax and then parsing it). Unfortunately for XML completion the schema direct support is not there as far as I know (please correct me if I am wrong). So puzzled with the same question I've start with custom auto-completion provider.

Here is an article that helped me a lot. https://mono.software/2017/04/11/custom-intellisense-with-monaco-editor/

This is the matching repository: https://github.com/isimic413/monaco-editor-custom-intellisense/tree/master/sample-editor

Please note that it's not updated to the latest version of the API; you may need to make some code corrections to make it work.