VS Code extension wrapper around canipls.
canipls
(Pronounced "can I please", á la gopls)
A language server that shows caniuse.com support percentages for web features, right in your editor.
Implements the following features of Microsoft's Language Server Protocol:
- diagnostics - shows warnings on features whose global support percentage falls below the user-defined desired support threshold (or the default, if none is specified.)
- hover - hover over any native HTML element, global attribute, CSS at-rule, property, psuedo-selector, JavaScript API or buultin, to see its global support percentage.
Supported file types:
- HTML
- CSS
- JavaScript/Typescript
- JSX/TSX
- Vue
- Svelte
- Astro
[!IMPORTANT]
While global support percentages in canipls rarely match 1:1 those of caniuse's, they are never more than 1% off, and rarely more than about 0.1% off. canipls data is refreshed once a day, but caniuse.com does not divulge all of its data sources.
Usage
Ignoring lines
It is possible to opt out of canipls warnings for specific lines of code. This is done via various magic comments:
| comment text |
function |
canipls-ignore |
Ignore the line this comment is found on |
canipls-ignore-nextline |
Ignore the line following the one this comment is found on |
canipls-ignore-file |
Ignore the whole file if this comment is found anywhere therein |
canipls-ignore-start |
Start ignoring from this line |
canipls-ignore-end |
Stop ignoring after this line |
Examples
/* canipls-ignore-nextline */
@starting-style {
/* ... */
}
const now = Temporal.Now.instant(); // canipls-ignore
Config
canipls can be configured, and upon startup, will search the following places for configuration options, in order of precedence:
- a file called
.canipls.json in the current project's root directory
- a file called
canipls.json in the user's global app config directory
- on Windows, this is found at
%HOME%/AppData/Roaming/canipls/
- on macOS and Linux, this is found at
~/.config/canipls/
- use the default values (see below table)
The following configuration options are available:
| name |
type |
default |
description |
support_threshold |
number |
90.0 |
The minimum global browser support threshold, according to caniuse, that features must meet |
show_low_support_warnings |
boolean |
true |
Whether to show warning diagnostics for features that fall below the desired support threshold. (If this is set to false, support_threshold has no effect.) |
ignored_feature_ids |
string[] |
[] |
List of caniuse feature IDs (without the mdn- prefix) which should be ignored when throwing warning diagnostics; may include a trailing * wildcard |
Where can I find a feature's caniuse ID?
Search for the feature you want on caniuse.com, and click the big # button to the left of the feature card:
The caniuse feature ID is the URL following "caniuse.com/", but canipls is only concerned with what follows mdn-:
Example:
{
"support_threshold": 80.0,
"show_low_support_warnings": true,
"ignored_feature_ids": [
"css_properties_cursor_*",
"javascript_builtins_temporal"
]
}
If you come across any strange or incorrect behavior, please let me know at tplewe@outlook.com.
[!NOTE]
This project is researched, designed, and written completely by hand. Among other reasons, quality is a higher priority than quantity for this project. Pull requests that contain AI-generated content of any kind will be rejected.
