fix: stylelint config, close #1658

.vscode/settings.json

@@ -55,7 +55,7 @@
     "**/yarn.lock": true
   },
   "stylelint.enable": true,
-  "stylelint.packageManager": "yarn",
+  "stylelint.validate": ["css", "less", "postcss", "scss", "vue", "sass"],
   "path-intellisense.mappings": {
     "/@/": "${workspaceRoot}/src"
   },
@@ -88,7 +88,8 @@
   },
   "[vue]": {
     "editor.codeActionsOnSave": {
-      "source.fixAll.eslint": false
+      "source.fixAll.eslint": true,
+      "source.fixAll.stylelint": true
     }
   },
   "i18n-ally.localesPaths": ["src/locales/lang"],

package.json

@@ -120,13 +120,11 @@
     "rollup": "^2.70.1",
     "rollup-plugin-visualizer": "^5.6.0",
     "stylelint": "^14.6.0",
-    "stylelint-config-html": "^1.0.0",
     "stylelint-config-prettier": "^9.0.3",
     "stylelint-config-recommended": "^7.0.0",
     "stylelint-config-recommended-vue": "^1.3.0",
     "stylelint-config-standard": "^25.0.0",
     "stylelint-order": "^5.0.0",
-    "stylelint-processor-html": "^1.0.0",
     "ts-node": "^10.7.0",
     "typescript": "^4.6.2",
     "vite": "^2.9.0-beta.3",

pnpm-lock.yaml

@@ -84,13 +84,11 @@ specifiers:
   showdown: ^2.0.3
   sortablejs: ^1.14.0
   stylelint: ^14.6.0
-  stylelint-config-html: ^1.0.0
   stylelint-config-prettier: ^9.0.3
   stylelint-config-recommended: ^7.0.0
   stylelint-config-recommended-vue: ^1.3.0
   stylelint-config-standard: ^25.0.0
   stylelint-order: ^5.0.0
-  stylelint-processor-html: ^1.0.0
   tinymce: ^5.10.3
   ts-node: ^10.7.0
   typescript: ^4.6.2
@@ -206,13 +204,11 @@ devDependencies:
   rollup: 2.70.1
   rollup-plugin-visualizer: 5.6.0_rollup@2.70.1
   stylelint: 14.6.0
-  stylelint-config-html: 1.0.0_f552817e5b8b1b7dca381d844218922e
   stylelint-config-prettier: 9.0.3_stylelint@14.6.0
   stylelint-config-recommended: 7.0.0_stylelint@14.6.0
   stylelint-config-recommended-vue: 1.3.0_f552817e5b8b1b7dca381d844218922e
   stylelint-config-standard: 25.0.0_stylelint@14.6.0
   stylelint-order: 5.0.0_stylelint@14.6.0
-  stylelint-processor-html: 1.0.0
   ts-node: 10.7.0_e79e62fe450383fd2d418267dc75e645
   typescript: 4.6.2
   vite: 2.9.0-beta.3_less@4.1.2
@@ -9133,13 +9129,6 @@ packages:
       stylelint: 14.6.0
     dev: true
 
-  /stylelint-processor-html/1.0.0:
-    resolution: {integrity: sha1-aJK2soVaRfApHNhFGR1pCBMKKRg=}
-    deprecated: 'Please use stylelint-processor-arbitrary-tags https://github.com/mapbox/stylelint-processor-arbitrary-tags '
-    dependencies:
-      htmlparser2: 3.10.1
-    dev: true
-
   /stylelint/14.6.0:
     resolution: {integrity: sha512-Xk2sqXYPi9nXgq70nBiZkbQm/QOOKd83NBTaBE1fXEWAEeRlgHnKC/E7kJFlT6K0SaNDOK5yIvR7GFPGsNLuOg==}
     engines: {node: ^12.20.0 || ^14.13.1 || >=16.0.0}

src/components/SimpleMenu/src/components/menu.less

@@ -13,8 +13,8 @@
     bottom: 0;
     display: block;
     width: 2px;
-    background-color: @primary-color;
     content: '';
+    background-color: @primary-color;
   }
 }
 
@@ -45,8 +45,8 @@
         position: absolute;
         top: 50%;
         right: 18px;
-        transform: translateY(-50%) rotate(-90deg);
         transition: transform @transition-time @ease-in-out;
+        transform: translateY(-50%) rotate(-90deg);
       }
     }
 
@@ -128,12 +128,12 @@
       position: relative;
       z-index: 1;
       display: flex;
+      align-items: center;
       font-size: @font-size-base;
       color: inherit;
       list-style: none;
       cursor: pointer;
       outline: none;
-      align-items: center;
 
       &:hover,
       &:active {
@@ -178,8 +178,8 @@
     &-vertical &-submenu-collapse {
       .@{submenu-popup-prefix-cls} {
         display: flex;
-        justify-content: center;
         align-items: center;
+        justify-content: center;
       }
       .@{menu-prefix-cls}-submenu-collapsed-show-tit {
         flex-direction: column;
@@ -244,8 +244,8 @@
           left: 0;
           width: 3px;
           height: 100%;
-          background-color: @primary-color;
           content: '';
+          background-color: @primary-color;
         }
       }
     }
@@ -276,8 +276,8 @@
           left: 0;
           width: 3px;
           height: 100%;
-          background-color: @primary-color;
           content: '';
+          background-color: @primary-color;
         }
 
         .@{menu-prefix-cls}-submenu-collapse {

stylelint.config.js

@@ -1,14 +1,10 @@
 module.exports = {
   root: true,
   plugins: ['stylelint-order'],
-  processors: ['stylelint-processor-html'],
+  extends: ['stylelint-config-standard', 'stylelint-config-prettier'],
-  extends: [
-    'stylelint-config-standard',
-    'stylelint-config-prettier',
-    'stylelint-config-recommended-vue/less',
-  ],
 
   rules: {
+    'function-no-unknown': null,
     'selector-class-pattern': null,
     'selector-pseudo-class-no-unknown': [
       true,
@@ -40,6 +36,7 @@ module.exports = {
       },
     ],
     'no-empty-source': null,
+    'string-quotes': null,
     'named-grid-areas-no-invalid': null,
     'unicode-bom': 'never',
     'no-descending-specificity': null,
@@ -77,7 +74,7 @@ module.exports = {
   overrides: [
     {
       files: ['*.vue', '**/*.vue', '*.html', '**/*.html'],
-      extends: ['stylelint-config-recommended', 'stylelint-config-html'],
+      extends: ['stylelint-config-recommended'],
       rules: {
         'keyframes-name-pattern': null,
         'selector-pseudo-class-no-unknown': [
@@ -94,5 +91,10 @@ module.exports = {
         ],
       },
     },
+    {
+      files: ['*.less', '**/*.less'],
+      customSyntax: 'postcss-less',
+      extends: ['stylelint-config-standard', 'stylelint-config-recommended-vue'],
+    },
   ],
 };