@codenatsu/stylelint-config-vue3 v0.0.7

stylelint规范统一

使用

在业务项目中安装pnpm i -D stylelint @codenatsu/stylelint-config-vue3

新建.stylelintrc.js，内容如下：

module.exports = {
    root: true,
    extends: ['@codenatsu/stylelint-config-vue3'],
};

新建.stylelintignore，内容如下:

# stylelint 忽略检查 (根据项目需要自行添加)
node_modules
dist

配置 /.vscode/settings.json

{
    "editor.formatOnSave": true,
    "editor.codeActionsOnSave": {
        "source.fixAll.stylelint": "explicit"
    },
    "stylelint.validate": [
        "css",
        "less",
        "postcss",
        "scss",
        "sass",
        "vue"
    ],
}

配置scripts脚本

{
    "lint:style": "stylelint src/**/*.{html,vue,css,sass,scss} --fix --cache --cache-location node_modules/.cache/.stylelintcache"
}

开发过程

安装：pnpm i -D stylelint stylelint-config-standard stylelint-config-recommended-scss stylelint-config-recommended-vue postcss postcss-html postcss-scss stylelint-config-recess-order stylelint-config-html

• stylelint: stylelint核心库
• stylelint-config-standard: stylelint标准规范
• stylelint-config-recommended-scss: scss 标准规范，如果项目用的是纯 css 则使用stylelint-config-standard标准
• stylelint-config-recommended-vue: vue 标准规范
• stylelint-scss: 配合 scss 的
• stylelint-config-recess-order: 提供优化样式顺序的配置
• stylelint-config-html: html中css的规范
• postcss-html: 解析html中的postcss语法
• postcss-scss: postcss的scss解析器

新增index.js并在package.json的main暴露出去