# wxml/required-attributes
# Background
Required Attributes
Hint required attributes for config wxml tags, same with eslint-plugin-react
's require-default-props (opens new window) rule, but for wxml
and exist difference.
# Motivation
hint developer don't forget add required attributes
in config wxml tag.
{
"wxml/required-attributes": [
"warn",
{ "tag": "popup", "attrs": ["showModal", "popupId"] },
{ "tag": "img", "attrs": ["src", { "key": "width", "value": "100px" }] }
]
}
<popup name="welcome">
<img useWebp >
</popup>
💡 tips
You can edit code via online editor, it's online REPL, try to fix eslint problem !
# Config
"wxml/required-attributes": [<enabled>, <{ tag: string, attrs: <string | { key: string, value: string }>[] }>] }]
# Config Example
{
"wxml/required-attributes": [
"warn",
{ "tag": "popup", "attrs": ["showModal", "popupId"] },
{ "tag": "img", "attrs": ["src", { "key": "width", "value": "100px" }] }
]
}
High Level Usage
Challenge: Check all missing showMask
property <popup />
in your .wxml
code base.
Solution
- Wirte
eslintrc
config as follow
{
"wxml/required-attributes": [
"error",
{ "tag": "popup", "attrs": ["showMask"] }
]
}
- run
eslint
cli
$ eslint src/**/*.wxml --quiet
- and then all wrong popup wxml file will log in your terminal
D:\\miniprogram\\src\\pages\\home\\main.wxml
1:2 error <popup> missing these attributes -> ["showMask"] wxml/required-attributes
x 1 problems (1 errors, 0 warnings)
# Version
This rule was introduced in eslint-plugin-wxml v0.2.1