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

相关文章

Python将博客内容html导出为Markdown格式

《Python将博客内容html导出为Markdown格式》Python将博客内容html导出为Markdown格式,通过博客url地址抓取文章,分析并提取出文章标题和内容,将内容构建成html,再转... 目录一、为什么要搞?二、准备如何搞?三、说搞咱就搞!抓取文章提取内容构建html转存markdown

在React中引入Tailwind CSS的完整指南

《在React中引入TailwindCSS的完整指南》在现代前端开发中,使用UI库可以显著提高开发效率,TailwindCSS是一个功能类优先的CSS框架,本文将详细介绍如何在Reac... 目录前言一、Tailwind css 简介二、创建 React 项目使用 Create React App 创建项目

vue使用docxtemplater导出word

《vue使用docxtemplater导出word》docxtemplater是一种邮件合并工具,以编程方式使用并处理条件、循环,并且可以扩展以插入任何内容,下面我们来看看如何使用docxtempl... 目录docxtemplatervue使用docxtemplater导出word安装常用语法 封装导出方

SpringBoot3实现Gzip压缩优化的技术指南

《SpringBoot3实现Gzip压缩优化的技术指南》随着Web应用的用户量和数据量增加,网络带宽和页面加载速度逐渐成为瓶颈,为了减少数据传输量,提高用户体验,我们可以使用Gzip压缩HTTP响应,... 目录1、简述2、配置2.1 添加依赖2.2 配置 Gzip 压缩3、服务端应用4、前端应用4.1 N

SpringCloud动态配置注解@RefreshScope与@Component的深度解析

《SpringCloud动态配置注解@RefreshScope与@Component的深度解析》在现代微服务架构中,动态配置管理是一个关键需求,本文将为大家介绍SpringCloud中相关的注解@Re... 目录引言1. @RefreshScope 的作用与原理1.1 什么是 @RefreshScope1.

Java利用JSONPath操作JSON数据的技术指南

《Java利用JSONPath操作JSON数据的技术指南》JSONPath是一种强大的工具,用于查询和操作JSON数据,类似于SQL的语法,它为处理复杂的JSON数据结构提供了简单且高效... 目录1、简述2、什么是 jsONPath?3、Java 示例3.1 基本查询3.2 过滤查询3.3 递归搜索3.4

SpringBoot日志配置SLF4J和Logback的方法实现

《SpringBoot日志配置SLF4J和Logback的方法实现》日志记录是不可或缺的一部分,本文主要介绍了SpringBoot日志配置SLF4J和Logback的方法实现,文中通过示例代码介绍的非... 目录一、前言二、案例一:初识日志三、案例二:使用Lombok输出日志四、案例三:配置Logback一

springboot security之前后端分离配置方式

《springbootsecurity之前后端分离配置方式》:本文主要介绍springbootsecurity之前后端分离配置方式,具有很好的参考价值,希望对大家有所帮助,如有错误或未考虑完全的... 目录前言自定义配置认证失败自定义处理登录相关接口匿名访问前置文章总结前言spring boot secu

Python中随机休眠技术原理与应用详解

《Python中随机休眠技术原理与应用详解》在编程中,让程序暂停执行特定时间是常见需求,当需要引入不确定性时,随机休眠就成为关键技巧,下面我们就来看看Python中随机休眠技术的具体实现与应用吧... 目录引言一、实现原理与基础方法1.1 核心函数解析1.2 基础实现模板1.3 整数版实现二、典型应用场景2

一文详解SpringBoot响应压缩功能的配置与优化

《一文详解SpringBoot响应压缩功能的配置与优化》SpringBoot的响应压缩功能基于智能协商机制,需同时满足很多条件,本文主要为大家详细介绍了SpringBoot响应压缩功能的配置与优化,需... 目录一、核心工作机制1.1 自动协商触发条件1.2 压缩处理流程二、配置方案详解2.1 基础YAML