From e3449a16c09cda2aa5c65fd8188fe5e41c9e6bdd Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?=E9=BB=84=E6=98=8E=E5=AF=8C?= <212149997@qq.com> Date: Mon, 16 Dec 2024 11:55:06 +0800 Subject: [PATCH] =?UTF-8?q?perf:=20=E4=BC=98=E5=8C=96stylelint=E3=80=81esl?= =?UTF-8?q?int=EF=BC=8C=E6=A0=BC=E5=BC=8F=E5=8C=96=E4=BB=A3=E7=A0=81?= =?UTF-8?q?=E7=AD=89?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- README.en-US.md | 6 +- README.md | 6 +- eslint.config.js | 2 +- package.json | 6 +- src/api/{guild.ts => test.ts} | 0 src/components/loading/index.scss | 4 +- src/styles/css/reset.css | 6 +- src/styles/scss/global.scss | 4 +- src/styles/scss/tools.scss | 2 +- src/views/home/index.scss | 8 +- src/views/test/count/index.scss | 4 +- src/views/test/create/index.scss | 2 +- stylelint.config.js | 154 +----------------------------- 13 files changed, 32 insertions(+), 172 deletions(-) rename src/api/{guild.ts => test.ts} (100%) diff --git a/README.en-US.md b/README.en-US.md index 2d1ada7..2789877 100644 --- a/README.en-US.md +++ b/README.en-US.md @@ -122,4 +122,8 @@ The **React-Ts-Template** project template aims to reduce developers' tedious co > [React-Ts-Template](https://github.com/huangmingfu/react-ts-template) ## Note -> Some UI libraries have not yet supported React 19. Please be cautious when installing and using them. \ No newline at end of file +> Currently, some UI libraries do not support React 19. Please be cautious when installing and using them. +> This project does not use any features specific to version 19. If needed, you can directly downgrade to version 18 using the following command. +```bash +pnpm install react@18.3.1 react-dom@18.3.1 +``` \ No newline at end of file diff --git a/README.md b/README.md index 603e8e3..c80b119 100644 --- a/README.md +++ b/README.md @@ -124,4 +124,8 @@ GitHub 项目地址：[React-Ts-Template](https://github.com/huangmingfu/react-t > [React-Ts-Template](https://github.com/huangmingfu/react-ts-template) ## 注意 -> 目前有一些ui库还未支持React19，注意甄别安装使用。 \ No newline at end of file +> 目前有一些ui库还未支持React19，注意甄别安装使用。 +> 本项目并未使用19版本的相关特性，如需要，可以直接使用如下命令降级到18版本。 +```bash +pnpm install react@18.3.1 react-dom@18.3.1 +``` \ No newline at end of file diff --git a/eslint.config.js b/eslint.config.js index 5bc6ea8..63306bb 100644 --- a/eslint.config.js +++ b/eslint.config.js @@ -6,7 +6,7 @@ import globals from 'globals'; import tseslint from 'typescript-eslint'; export default tseslint.config( - { ignores: ['dist', '/dist*', '/config/', '/build/', '/node_modules/*', '/*.js'] }, + { ignores: ['dist', 'dist*', 'node_modules'] }, { settings: { react: { version: '19.0' } }, extends: [js.configs.recommended, ...tseslint.configs.recommended], diff --git a/package.json b/package.json index ca9233c..d878e5a 100644 --- a/package.json +++ b/package.json @@ -29,9 +29,9 @@ "preview:dev": "pnpm vite preview -m dev", "preview:test": "pnpm vite preview -m test", "preview:pro": "pnpm vite preview -m pro", - "lint:eslint": "eslint --max-warnings 0 \"{src,mock,build}/**/*.{ts,tsx,js,jsx,cjs,mjs}\" --fix", - "lint:format": "prettier --write \"./**/*.{ts,tsx,js,jsx,cjs,mjs,html}\"", - "lint:style": "stylelint \"./**/*.{css,scss}\" --fix", + "lint:eslint": "eslint --max-warnings 0 \"**/*.{ts,tsx,js,jsx,cjs,mjs}\" --fix", + "lint:format": "prettier --write \"**/*.{ts,tsx,js,jsx,cjs,mjs,html}\"", + "lint:style": "stylelint \"**/*.{css,scss}\" --fix", "lint:all": "pnpm run lint:eslint && pnpm run lint:style && pnpm run lint:format", "lint:lint-staged": "lint-staged", "prepare": "husky install", diff --git a/src/api/guild.ts b/src/api/test.ts similarity index 100% rename from src/api/guild.ts rename to src/api/test.ts diff --git a/src/components/loading/index.scss b/src/components/loading/index.scss index a9adf44..fc2f2da 100644 --- a/src/components/loading/index.scss +++ b/src/components/loading/index.scss @@ -3,11 +3,11 @@ inset: 0; z-index: 9999999; display: flex; + align-items: center; + justify-content: center; width: 100%; height: 100%; background-color: rgba($color: #000, $alpha: 20%); - justify-content: center; - align-items: center; svg { width: 100px; diff --git a/src/styles/css/reset.css b/src/styles/css/reset.css index ab16996..c102109 100644 --- a/src/styles/css/reset.css +++ b/src/styles/css/reset.css @@ -1,8 +1,8 @@ *, *::after, *::before { - outline: none; box-sizing: border-box; + outline: none; } html, @@ -145,8 +145,8 @@ sub { } table { - border-collapse: collapse; border-spacing: 0; + border-collapse: collapse; } input, @@ -160,9 +160,9 @@ button { select { text-indent: 0.01px; text-overflow: ''; + appearance: none; border: 0; border-radius: 0; - appearance: none; } select::-ms-expand { diff --git a/src/styles/scss/global.scss b/src/styles/scss/global.scss index cb68ae2..8ddb971 100644 --- a/src/styles/scss/global.scss +++ b/src/styles/scss/global.scss @@ -21,12 +21,12 @@ .route-loading::before { position: absolute; + inset: 0 100% 0 0; margin: 2px; + content: ''; background: currentcolor; border-radius: inherit; - content: ''; animation: l6 2s infinite; - inset: 0 100% 0 0; @keyframes l6 { 100% { diff --git a/src/styles/scss/tools.scss b/src/styles/scss/tools.scss index 293a070..513bc86 100644 --- a/src/styles/scss/tools.scss +++ b/src/styles/scss/tools.scss @@ -5,8 +5,8 @@ /** 滚动条 */ @mixin scrollbar($size: 7px, $color: rgba(0, 0, 0, 0.5)) { - scrollbar-width: thin; scrollbar-color: $color transparent; + scrollbar-width: thin; &::-webkit-scrollbar-thumb { background-color: $color; diff --git a/src/views/home/index.scss b/src/views/home/index.scss index d9d8077..8add6a4 100644 --- a/src/views/home/index.scss +++ b/src/views/home/index.scss @@ -1,16 +1,16 @@ .pg-home { display: flex; + flex-direction: column; + align-items: center; height: 100vh; padding-top: 200px; text-align: center; - flex-direction: column; - align-items: center; .logo { height: 6em; padding: 1.5em; - will-change: filter; transition: filter 300ms; + will-change: filter; } .logo:hover { @@ -57,10 +57,10 @@ body { display: flex; + place-items: center; min-width: 320px; min-height: 100vh; margin: 0; - place-items: center; } h1 { diff --git a/src/views/test/count/index.scss b/src/views/test/count/index.scss index 25f603d..e14d4de 100644 --- a/src/views/test/count/index.scss +++ b/src/views/test/count/index.scss @@ -1,12 +1,12 @@ $prefix-cls: 'pg-guild-count'; .#{$prefix-cls} { - display: flex; - font-size: 17px; box-sizing: border-box; + display: flex; flex-direction: column; align-items: center; justify-content: center; + font-size: 17px; &__count { font-weight: bold; diff --git a/src/views/test/create/index.scss b/src/views/test/create/index.scss index 3ca7452..ada9d1d 100644 --- a/src/views/test/create/index.scss +++ b/src/views/test/create/index.scss @@ -1,7 +1,7 @@ .pg-guild-create { + box-sizing: border-box; width: 155px; font-size: 17px; - box-sizing: border-box; &__count { font-weight: bold; diff --git a/stylelint.config.js b/stylelint.config.js index c725657..74ff9d2 100644 --- a/stylelint.config.js +++ b/stylelint.config.js @@ -3,8 +3,9 @@ export default { root: true, // 继承某些已有的规则 extends: [ - 'stylelint-config-standard', // 配置 stylelint 拓展插件 - 'stylelint-config-standard-scss' // 配置 stylelint scss 插件 + 'stylelint-config-standard', // css 标准配置 + 'stylelint-config-standard-scss', // scss 标准配置 + 'stylelint-config-recess-order' // CSS 属性排序配置 ], plugins: ['stylelint-order'], rules: { @@ -19,155 +20,6 @@ export default { { ignorePseudoClasses: ['global', 'export'] } - ], - // css属性排序 - 'order/properties-order': [ - 'position', - 'top', - 'right', - 'bottom', - 'left', - 'z-index', - 'display', - 'float', - 'width', - 'height', - 'max-width', - 'max-height', - 'min-width', - 'min-height', - 'padding', - 'padding-top', - 'padding-right', - 'padding-bottom', - 'padding-left', - 'margin', - 'margin-top', - 'margin-right', - 'margin-bottom', - 'margin-left', - 'margin-collapse', - 'margin-top-collapse', - 'margin-right-collapse', - 'margin-bottom-collapse', - 'margin-left-collapse', - 'overflow', - 'overflow-x', - 'overflow-y', - 'clip', - 'clear', - 'font', - 'font-family', - 'font-size', - 'font-smoothing', - 'osx-font-smoothing', - 'font-style', - 'font-weight', - 'hyphens', - 'src', - 'line-height', - 'letter-spacing', - 'word-spacing', - 'color', - 'text-align', - 'text-decoration', - 'text-indent', - 'text-overflow', - 'text-rendering', - 'text-size-adjust', - 'text-shadow', - 'text-transform', - 'word-break', - 'word-wrap', - 'white-space', - 'vertical-align', - 'list-style', - 'list-style-type', - 'list-style-position', - 'list-style-image', - 'pointer-events', - 'cursor', - 'background', - 'background-attachment', - 'background-color', - 'background-image', - 'background-position', - 'background-repeat', - 'background-size', - 'border', - 'border-collapse', - 'border-top', - 'border-right', - 'border-bottom', - 'border-left', - 'border-color', - 'border-image', - 'border-top-color', - 'border-right-color', - 'border-bottom-color', - 'border-left-color', - 'border-spacing', - 'border-style', - 'border-top-style', - 'border-right-style', - 'border-bottom-style', - 'border-left-style', - 'border-width', - 'border-top-width', - 'border-right-width', - 'border-bottom-width', - 'border-left-width', - 'border-radius', - 'border-top-right-radius', - 'border-bottom-right-radius', - 'border-bottom-left-radius', - 'border-top-left-radius', - 'border-radius-topright', - 'border-radius-bottomright', - 'border-radius-bottomleft', - 'border-radius-topleft', - 'content', - 'quotes', - 'outline', - 'outline-offset', - 'opacity', - 'filter', - 'visibility', - 'size', - 'zoom', - 'transform', - 'box-align', - 'box-flex', - 'box-orient', - 'box-pack', - 'box-shadow', - 'box-sizing', - 'table-layout', - 'animation', - 'animation-delay', - 'animation-duration', - 'animation-iteration-count', - 'animation-name', - 'animation-play-state', - 'animation-timing-function', - 'animation-fill-mode', - 'transition', - 'transition-delay', - 'transition-duration', - 'transition-property', - 'transition-timing-function', - 'background-clip', - 'backface-visibility', - 'resize', - 'appearance', - 'user-select', - 'interpolation-mode', - 'direction', - 'marks', - 'page', - 'set-link-source', - 'unicode-bidi', - 'speak' ] }, ignoreFiles: [