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

相关文章

Spring配置扩展之JavaConfig的使用小结

《Spring配置扩展之JavaConfig的使用小结》JavaConfig是Spring框架中基于纯Java代码的配置方式,用于替代传统的XML配置,通过注解(如@Bean)定义Spring容器的组... 目录JavaConfig 的概念什么是JavaConfig?为什么使用 JavaConfig?Jav

JAVA项目swing转javafx语法规则以及示例代码

《JAVA项目swing转javafx语法规则以及示例代码》:本文主要介绍JAVA项目swing转javafx语法规则以及示例代码的相关资料,文中详细讲解了主类继承、窗口创建、布局管理、控件替换、... 目录最常用的“一行换一行”速查表(直接全局替换)实际转换示例(JFramejs → JavaFX)迁移建

Spring Boot Interceptor的原理、配置、顺序控制及与Filter的关键区别对比分析

《SpringBootInterceptor的原理、配置、顺序控制及与Filter的关键区别对比分析》本文主要介绍了SpringBoot中的拦截器(Interceptor)及其与过滤器(Filt... 目录前言一、核心功能二、拦截器的实现2.1 定义自定义拦截器2.2 注册拦截器三、多拦截器的执行顺序四、过

JavaWeb项目创建、部署、连接数据库保姆级教程(tomcat)

《JavaWeb项目创建、部署、连接数据库保姆级教程(tomcat)》:本文主要介绍如何在IntelliJIDEA2020.1中创建和部署一个JavaWeb项目,包括创建项目、配置Tomcat服务... 目录简介:一、创建项目二、tomcat部署1、将tomcat解压在一个自己找得到路径2、在idea中添加

springboot的controller中如何获取applicatim.yml的配置值

《springboot的controller中如何获取applicatim.yml的配置值》本文介绍了在SpringBoot的Controller中获取application.yml配置值的四种方式,... 目录1. 使用@Value注解(最常用)application.yml 配置Controller 中

springboot中配置logback-spring.xml的方法

《springboot中配置logback-spring.xml的方法》文章介绍了如何在SpringBoot项目中配置logback-spring.xml文件来进行日志管理,包括如何定义日志输出方式、... 目录一、在src/main/resources目录下,也就是在classpath路径下创建logba

解决idea启动项目报错java: OutOfMemoryError: insufficient memory

《解决idea启动项目报错java:OutOfMemoryError:insufficientmemory》:本文主要介绍解决idea启动项目报错java:OutOfMemoryError... 目录原因:解决:总结 原因:在Java中遇到OutOfMemoryError: insufficient me

SpringBoot返回文件让前端下载的几种方式

《SpringBoot返回文件让前端下载的几种方式》文章介绍了开发中文件下载的两种常见解决方案,并详细描述了通过后端进行下载的原理和步骤,包括一次性读取到内存和分块写入响应输出流两种方法,此外,还提供... 目录01 背景02 一次性读取到内存,通过响应输出流输出到前端02 将文件流通过循环写入到响应输出流

python项目环境切换的几种实现方式

《python项目环境切换的几种实现方式》本文主要介绍了python项目环境切换的几种实现方式,文中通过示例代码介绍的非常详细,对大家的学习或者工作具有一定的参考学习价值,需要的朋友们下面随着小编来一... 目录1. 如何在不同python项目中,安装不同的依赖2. 如何切换到不同项目的工作空间3.创建项目

SpringBoot项目整合Netty启动失败的常见错误总结

《SpringBoot项目整合Netty启动失败的常见错误总结》本文总结了SpringBoot集成Netty时常见的8类问题及解决方案,文中通过示例代码介绍的非常详细,对大家的学习或者工作具有一定的参... 目录一、端口冲突问题1. Tomcat与Netty端口冲突二、主线程被阻塞问题1. Netty启动阻