vue项目配置stylelint vue技术交流群(864583465)

本文主要是介绍vue项目配置stylelint vue技术交流群(864583465),希望对大家解决编程问题提供一定的参考价值,需要的开发者们随着小编来一起学习吧!

vue项目配置stylelint vue技术交流群(864583465)

1、前端开发人员对stylelint不陌生,它的作用相信大多数开发者也清楚,不过,由于这样或那样的原因,现实中一些开发团队可能并没有使用它,这就不可避免的导致了团队css代码较乱,使得代码维护性差。因此在项目中使用stylelint是非常重要的,废话少说直接上步骤:

2、安装依赖

npm i -D stylelint
npm i -D stylelint-config-recess-order
npm i -D stylelint-config-standard
npm i -D stylelint-order
npm i -D stylelint-scss

正常情况下,应该都是需要安装上面几个依赖的

3、stylelint配置
在项目根目录下创建.stylelintrc.js文件,文件中的内容如下,这里列举的是我项目中的常用配置,可根据自己项目实际情况进行配置,另附文档两篇
1、https://cloud.tencent.com/developer/doc/1267
2、http://stylelint.docschina.org/

module.exports = {plugins: ['stylelint-order', 'stylelint-scss'],extends: ['stylelint-config-standard', 'stylelint-config-recess-order'], // 这是官方推荐的方式rules: {// at-rule-no-unknown: 屏蔽一些scss等语法检查'at-rule-no-unknown': null,'scss/at-rule-no-unknown': true,'selector-pseudo-element-no-unknown': null,'scss/selector-no-redundant-nesting-selector': null,'font-family-no-missing-generic-family-keyword': null,'no-descending-specificity': null,}
}

4、webstorm开启stylelint配置
在这里插入图片描述
注意1:我是电脑中有全局安装的stylelint包,因此红框中的路径是选的是我全局安装的,也可以使用项目中node_modules里的stylelint
注意2: 一定要勾选Enable

PS:欢迎加入vue技术交流群(864583465)进行更多问题的探讨,你的问题将是我们大家共同进步的关键

这篇关于vue项目配置stylelint vue技术交流群(864583465)的文章就介绍到这儿,希望我们推荐的文章对编程师们有所帮助!



http://www.chinasem.cn/article/726883

相关文章

基于 Cursor 开发 Spring Boot 项目详细攻略

《基于Cursor开发SpringBoot项目详细攻略》Cursor是集成GPT4、Claude3.5等LLM的VSCode类AI编程工具,支持SpringBoot项目开发全流程,涵盖环境配... 目录cursor是什么?基于 Cursor 开发 Spring Boot 项目完整指南1. 环境准备2. 创建

mybatis映射器配置小结

《mybatis映射器配置小结》本文详解MyBatis映射器配置,重点讲解字段映射的三种解决方案(别名、自动驼峰映射、resultMap),文中通过示例代码介绍的非常详细,对大家的学习或者工作具有一定... 目录select中字段的映射问题使用SQL语句中的别名功能使用mapUnderscoreToCame

Vue和React受控组件的区别小结

《Vue和React受控组件的区别小结》本文主要介绍了Vue和React受控组件的区别小结,文中通过示例代码介绍的非常详细,对大家的学习或者工作具有一定的参考学习价值,需要的朋友们下面随着小编来一起学... 目录背景React 的实现vue3 的实现写法一:直接修改事件参数写法二:通过ref引用 DOMVu

Linux下MySQL数据库定时备份脚本与Crontab配置教学

《Linux下MySQL数据库定时备份脚本与Crontab配置教学》在生产环境中,数据库是核心资产之一,定期备份数据库可以有效防止意外数据丢失,本文将分享一份MySQL定时备份脚本,并讲解如何通过cr... 目录备份脚本详解脚本功能说明授权与可执行权限使用 Crontab 定时执行编辑 Crontab添加定

Java实现将HTML文件与字符串转换为图片

《Java实现将HTML文件与字符串转换为图片》在Java开发中,我们经常会遇到将HTML内容转换为图片的需求,本文小编就来和大家详细讲讲如何使用FreeSpire.DocforJava库来实现这一功... 目录前言核心实现:html 转图片完整代码场景 1:转换本地 HTML 文件为图片场景 2:转换 H

Java使用jar命令配置服务器端口的完整指南

《Java使用jar命令配置服务器端口的完整指南》本文将详细介绍如何使用java-jar命令启动应用,并重点讲解如何配置服务器端口,同时提供一个实用的Web工具来简化这一过程,希望对大家有所帮助... 目录1. Java Jar文件简介1.1 什么是Jar文件1.2 创建可执行Jar文件2. 使用java

C#使用Spire.Doc for .NET实现HTML转Word的高效方案

《C#使用Spire.Docfor.NET实现HTML转Word的高效方案》在Web开发中,HTML内容的生成与处理是高频需求,然而,当用户需要将HTML页面或动态生成的HTML字符串转换为Wor... 目录引言一、html转Word的典型场景与挑战二、用 Spire.Doc 实现 HTML 转 Word1

Vue3绑定props默认值问题

《Vue3绑定props默认值问题》使用Vue3的defineProps配合TypeScript的interface定义props类型,并通过withDefaults设置默认值,使组件能安全访问传入的... 目录前言步骤步骤1:使用 defineProps 定义 Props步骤2:设置默认值总结前言使用T

SpringBoot 多环境开发实战(从配置、管理与控制)

《SpringBoot多环境开发实战(从配置、管理与控制)》本文详解SpringBoot多环境配置,涵盖单文件YAML、多文件模式、MavenProfile分组及激活策略,通过优先级控制灵活切换环境... 目录一、多环境开发基础(单文件 YAML 版)(一)配置原理与优势(二)实操示例二、多环境开发多文件版

Vite 打包目录结构自定义配置小结

《Vite打包目录结构自定义配置小结》在Vite工程开发中,默认打包后的dist目录资源常集中在asset目录下,不利于资源管理,本文基于Rollup配置原理,本文就来介绍一下通过Vite配置自定义... 目录一、实现原理二、具体配置步骤1. 基础配置文件2. 配置说明(1)js 资源分离(2)非 JS 资