VSC-Kendo-Components

This is a VS Code extension which provides completion support in html files for Kendo UI Components by which you can use Kendo UI in web component way.

Features and Usage

Resource reference snippets

Typing 'html5:kendoui'(not including the quotes) in a html file triggers the skeleton snippet of needed resources for a page using Kendo UI library. {version} in snippet below are the same version numbers of Kendo UI from which this extension is built. Current version is 2020.2.617. This extension will try to keep the pace with latest version of Kendo UI. You'd better to refactor your projects to make version consistent with updates of this extension.

<!DOCTYPE html>
<html lang='en'>
<head>
  <meta charset='UTF-8'>
  <meta name='viewport' content='width=device-width, initial-scale=1.0'>
  <meta http-equiv='X-UA-Compatible' content='ie=edge'>
  <title></title>
  <link rel='stylesheet' href='http://kendo.cdn.telerik.com/{vresion}/styles/kendo.common.min.css'/>
  <link rel='stylesheet' href='http://kendo.cdn.telerik.com/{vresion}/styles/kendo.default.min.css'/>
  <link rel='stylesheet' href='http://kendo.cdn.telerik.com/{vresion}/styles/kendo.mobile.all.min.css'/>
  <script src='http://kendo.cdn.telerik.com/{vresion}/js/jquery.min.js'></script>
  <script src='http://kendo.cdn.telerik.com/{vresion}/js/kendo.ui.min.js'></script>
  <script src='/node_modules/kendoui-components/dist/kendo-components.min.js'></script>
</head>
<body>
  
</body>
</html>

The last line of above snippet refers to kendoui-components package. You can install it by 'npm i --save kendoui-components'.

Typing '<k- ' or '<km- ' (notice the space and no quotes) pops up the component tag names completions list with a brief overview of the widget. demo

As shown in above animation, WHITE SPACE followed a component tagname or key=value attribute assignments pops up the corresponding options list of current widget with types or signatures descriptions for properties or listeners respectivily.

Typing ',' or '{' while inputting value pops up avalible properties if the value is an object, e.g. animation of k-auto-complete.

Change Log

Bug Reporting

License

MIT

VSC-Kendo-Components

arthurwang

VSC-Kendo-Components

Features and Usage

Resource reference snippets

Kendo widget tag completions

Kendo widget configuration options completions

Kendo widget option object keys completions

Change Log

Bug Reporting

License