当前位置: 首页 > news >正文

vue-cli项目质量约束配置

在这里插入图片描述

同步发布于我的网站 🚀

  • package.json
    • scripts
    • lint-staged
    • devDependencies
      • git-hooks
      • no-eslint
      • devDependencies - scss
      • devDependencies - less
      • engines
  • pre-commit
  • .eslintrc.js
  • .stylelintrc
    • scss
    • less
  • vue.config.js
  • README.md

package.json

scripts
    "scripts": {...,"prepare": "husky install"},

lint-staged

  "lint-staged": {"src/**/*.{vue,css,scss,sass}": "stylelint --fix"},

devDependencies

git-hooks
        "husky": "^8.0.3","lint-staged": "^13.2.0",
no-eslint
    vue add eslint

or

      "@babel/eslint-parser": "^7.12.16","@vue/cli-plugin-babel": "~5.0.0","@vue/cli-plugin-eslint": "~5.0.0","eslint": "^7.32.0","eslint-plugin-vue": "^8.0.3",
devDependencies - scss
        "postcss": "^8.4.13","postcss-html": "^1.5.0","stylelint": "^14.9.1","stylelint-config-recommended-scss": "^7.0.0","stylelint-config-recommended-vue": "^1.4.0","stylelint-config-standard": "^26.0.0","stylelint-config-standard-scss": "^5.0.0",
devDependencies - less
        "postcss": "^8.4.13","postcss-html": "^1.5.0","postcss-less": "^6.0.0","stylelint": "^14.9.1","stylelint-config-recommended-less": "^1.0.4","stylelint-config-recommended-vue": "^1.4.0","stylelint-less": "^1.0.6",
engines
    "engines": {"node": "^14.18.3"}

pre-commit

输入命令行

npx husky add .husky/pre-commit

编辑文件 .husky/pre-commit

#!/usr/bin/env sh
. "$(dirname -- "$0")/_/husky.sh"npx lint-staged

.eslintrc.js

module.exports = {root: true,env: {node: true,},extends: ["plugin:vue/essential", "eslint:recommended"],parserOptions: {parser: "@babel/eslint-parser",},rules: {"no-debugger": process.env.NODE_ENV == "development" ? "off" : "error","no-console": process.env.NODE_ENV == "development" ? "off" : "error",},
};

.stylelintrc

scss

{"extends": ["stylelint-config-standard","stylelint-config-standard-scss","stylelint-config-recommended-vue/scss"],"rules": {"declaration-block-no-redundant-longhand-properties": null,"selector-class-pattern": "^[a-z]{1}[a-z-_]*[a-zA-Z]*$","selector-id-pattern": "^[a-z]{1}[a-z-_]*[a-zA-Z]*$","scss/at-function-pattern": null,"scss/no-global-function-names": null,"font-family-no-missing-generic-family-keyword": null,"value-no-vendor-prefix": null,"indentation": 2,"selector-type-case": "lower"}
}

less

{"extends": ["stylelint-config-recommended-less"],"overrides": [{ "files": ["*.vue", "**/*.vue"], "customSyntax": "postcss-html" },{ "files": ["*.less", "**/*.less"], "customSyntax": "postcss-less" }],"rules": {"declaration-block-no-redundant-longhand-properties": null,"selector-class-pattern": "^[a-z]{1}[a-z-_]*[a-zA-Z]*$","selector-id-pattern": "^[a-z]{1}[a-z-_]*[a-zA-Z]*$","font-family-no-missing-generic-family-keyword": null,"value-no-vendor-prefix": null,"indentation": 2,"selector-type-case": "lower"}
}

vue.config.js

module.exports = {...,lintOnSave: "error",
}

README.md

项目代码规范


相关文章:

vue-cli项目质量约束配置

同步发布于我的网站 🚀 package.json scriptslint-stageddevDependencies git-hooksno-eslintdevDependencies - scssdevDependencies - lessengines pre-commit.eslintrc.js.stylelintrc scssless vue.config.jsREADME.md package.json scripts "scripts&…...

第七课 Unity编辑器创建的资源优化_UI篇(UGUI)

上期我们学习了简单的Scene优化,接下来我们继续编辑器创建资源的UGUI优化 UI篇(UGUI) 优化UGUI应从哪些方面入手? 可以从CPU和GPU两方面考虑,CPU方面,避免触发或减少Canvas的Rebuild和Rebatch&#xff0c…...

【docker】docker build上下文

什么是 Docker Build 上下文? 在 Docker 中,构建上下文(Build Context) 是指在执行 docker build 命令时,Docker 会发送给 Docker 引擎的所有文件和目录的集合。构建上下文包含了 Dockerfile 和用于构建镜像的所有文件…...

ESLint 配置文件全解析:格式、层叠与扩展(3)

配置文件系统处于一个更新期,存在两套配置文件系统,旧的配置文件系统适用于 v9.0.0 之前的版本,而新的配置文件系统适用于 v9.0.0之后的版本,但是目前还处于 v8.x.x 的大版本。 配置文件格式 在 ESLint 中,支持如下格…...

org.apache.commons.lang3包下的StringUtils工具类的使用

前言 相信平时在写项目的时候,一定使用到StringUtils.isEmpty();StringUtils.isBlank();但是你真的了解他们吗? 也许你两个都不知道,也许你除了isEmpty/isNotEmpty/isNotBlank/isBlank外,并不知道还有isAnyEmpty/isNon…...

HarmonyOS4+NEXT星河版入门与项目实战(23)------组件转场动画

文章目录 1、控件图解2、案例实现1、代码实现2、代码解释3、实现效果4、总结1、控件图解 这里我们用一张完整的图来汇整 组件转场动画的用法格式、属性和事件,如下所示: 2、案例实现 这里我们对上一节小鱼游戏进行改造,让小鱼在游戏开始的时候增加一个转场动画,让小鱼自…...

十一、快速入门go语言之接口和反射

文章目录 接口:one: 接口基础:two: 接口类型断言和空接口:star2: 空接口实现存储不同数据类型的切片/数组:star2: 复制切片到空接口切片:star2: 类型断言 反射 📅 2024年5月9日 📦 使用版本为1.21.5 接口 十、Java类的封装和继承、多态 - 七点半的菜市…...

智能化图书馆导航系统方案之系统架构与核心功能设计

hello~这里是维小帮,点击文章最下方获取图书馆导航系统解决方案!如有项目需求和技术交流欢迎大家私聊我们~撒花! 针对传统图书馆在图书查找困难、座位紧张、空间导航不便方面的问题,本文深入剖析了基于高精度定位、3D建模、图书搜…...

学习嵩山版《Java 开发手册》:编程规约 - 命名风格(P13 ~ P14)

概述 《Java 开发手册》是阿里巴巴集团技术团队的集体智慧结晶和经验总结,他旨在提升开发效率和代码质量 《Java 开发手册》是一本极具价值的 Java 开发规范指南,对于提升开发者的综合素质和代码质量具有重要意义 学习《Java 开发手册》是一个提升 Jav…...

Qt关于padding设置不起作用的的解决办法

观察以下的代码: MyWidget::MyWidget(QWidget *parent): QWidget{parent},m_btn(new QToolButton(this)) {this->setFixedSize(500,500);m_btn->setToolButtonStyle(Qt::ToolButtonTextBesideIcon);m_btn->setIcon(QIcon("F:tabIcon/person-white.s…...

Golang教程第10篇(语言循环语句-语言循环嵌套)

Go 语言循环嵌套 Go 语言循环语句Go 语言循环语句 Go 语言允许用户在循环内使用循环。接下来我们将为大家介绍嵌套循环的使用。 语法 以下为 Go 语言嵌套循环的格式: for [condition | ( init; condition; increment ) | Range] {for [condition | ( init; con…...

Python Web 开发:FastAPI 入门实战 —— HTTP 基础与 RESTful API 设计

Python Web 开发:FastAPI 入门实战 —— HTTP 基础与 RESTful API 设计 目录 🚀 HTTP 协议概述🌐 HTTP 请求与响应的工作原理🛠️ RESTful API 设计理念🗂️ JSON 格式数据的传输与解析 1. 🚀 HTTP 协议概…...

uniapp实现组件竖版菜单

社区图片页面 scroll-view scroll-view | uni-app官网 (dcloud.net.cn) 可滚动视图区域。用于区域滚动。 需注意在webview渲染的页面中&#xff0c;区域滚动的性能不及页面滚动。 <template><view class"pics"><scroll-view class"left"…...

osg、osgearth源码编译(二)

如果比较懒&#xff0c;也可以不看这篇文章&#xff0c;网上应该有很多编译好的库。也可以找我要。 本人还是建议学会编译&#xff0c;因为其他人电脑上编译好的&#xff0c;可能在你的电脑环境上&#xff0c;出现这样那样奇怪的问题&#xff0c;所以&#xff0c;最好还是自己能…...

从单一设备到万物互联:鸿蒙生态崛起的未来之路

目录 一、引言&#xff1a;开启智能时代的钥匙 二、鸿蒙生态概述&#xff1a;跨设备协同的核心价值 三、开发者机遇与挑战&#xff1a;抓住鸿蒙崛起的机会 四、鸿蒙生态崛起的前景&#xff1a;万物互联的未来 五、开发者在鸿蒙生态中的实践机遇与挑战 1. 跨设备开发的机遇…...

Kotlin的object修饰符定义类似Java的静态类/静态方法

Kotlin的object修饰符定义类似Java的静态类/静态方法 //类似Java的static类 object StaticCls {//类似Java静态变量private var num 0//类似Java的静态方法fun updateVal(n: Int) {num n}fun getVal(): Int {return num} }class MyTest() {fun setVal() {StaticCls.updateVal…...

html 中的 <code>标签

定义和用途 <code> 标签是HTML中的一个内联元素&#xff0c;用于定义计算机代码片段。当你需要在网页内容中展示代码&#xff0c;比如编程语言代码&#xff08;如JavaScript、Python、Java等&#xff09;、命令行指令、标记语言代码&#xff08;如HTML、XML等&#xff09…...

【Oracle11g SQL详解】GROUP BY 和 HAVING 子句:分组与过滤

GROUP BY 和 HAVING 子句&#xff1a;分组与过滤 在 Oracle 11g 中&#xff0c;GROUP BY 子句用于根据一个或多个列对查询结果进行分组&#xff0c;而 HAVING 子句用于对分组后的结果进行过滤。这两者常结合聚合函数使用&#xff0c;用以实现复杂的数据统计和分析。本文将系统…...

SSE基础配置与使用

什么是 Server-Sent Events (SSE) **Server-Sent Events (SSE) **是一种轻量的服务器向客户端推送消息的机制&#xff0c;基于 HTTP 协议实现单向通信&#xff0c;适用于需要实时更新的场景。 与 WebSocket 不同&#xff0c;SSE 只允许服务器向客户端发送数据&#xff0c;因此…...

Android -- 简易音乐播放器

Android – 简易音乐播放器 播放器功能&#xff1a;* 1. 播放模式&#xff1a;单曲、列表循环、列表随机&#xff1b;* 2. 后台播放&#xff08;单例模式&#xff09;&#xff1b;* 3. 多位置同步状态回调&#xff1b;处理模块&#xff1a;* 1. 提取文件信息&#xff1a;音频文…...

树莓派超全系列教程文档--(62)使用rpicam-app通过网络流式传输视频

使用rpicam-app通过网络流式传输视频 使用 rpicam-app 通过网络流式传输视频UDPTCPRTSPlibavGStreamerRTPlibcamerasrc GStreamer 元素 文章来源&#xff1a; http://raspberry.dns8844.cn/documentation 原文网址 使用 rpicam-app 通过网络流式传输视频 本节介绍来自 rpica…...

Spring Boot 实现流式响应(兼容 2.7.x)

在实际开发中&#xff0c;我们可能会遇到一些流式数据处理的场景&#xff0c;比如接收来自上游接口的 Server-Sent Events&#xff08;SSE&#xff09; 或 流式 JSON 内容&#xff0c;并将其原样中转给前端页面或客户端。这种情况下&#xff0c;传统的 RestTemplate 缓存机制会…...

ssc377d修改flash分区大小

1、flash的分区默认分配16M、 / # df -h Filesystem Size Used Available Use% Mounted on /dev/root 1.9M 1.9M 0 100% / /dev/mtdblock4 3.0M...

《从零掌握MIPI CSI-2: 协议精解与FPGA摄像头开发实战》-- CSI-2 协议详细解析 (一)

CSI-2 协议详细解析 (一&#xff09; 1. CSI-2层定义&#xff08;CSI-2 Layer Definitions&#xff09; 分层结构 &#xff1a;CSI-2协议分为6层&#xff1a; 物理层&#xff08;PHY Layer&#xff09; &#xff1a; 定义电气特性、时钟机制和传输介质&#xff08;导线&#…...

pam_env.so模块配置解析

在PAM&#xff08;Pluggable Authentication Modules&#xff09;配置中&#xff0c; /etc/pam.d/su 文件相关配置含义如下&#xff1a; 配置解析 auth required pam_env.so1. 字段分解 字段值说明模块类型auth认证类模块&#xff0c;负责验证用户身份&am…...

React Native在HarmonyOS 5.0阅读类应用开发中的实践

一、技术选型背景 随着HarmonyOS 5.0对Web兼容层的增强&#xff0c;React Native作为跨平台框架可通过重新编译ArkTS组件实现85%以上的代码复用率。阅读类应用具有UI复杂度低、数据流清晰的特点。 二、核心实现方案 1. 环境配置 &#xff08;1&#xff09;使用React Native…...

论文解读:交大港大上海AI Lab开源论文 | 宇树机器人多姿态起立控制强化学习框架(一)

宇树机器人多姿态起立控制强化学习框架论文解析 论文解读&#xff1a;交大&港大&上海AI Lab开源论文 | 宇树机器人多姿态起立控制强化学习框架&#xff08;一&#xff09; 论文解读&#xff1a;交大&港大&上海AI Lab开源论文 | 宇树机器人多姿态起立控制强化…...

在web-view 加载的本地及远程HTML中调用uniapp的API及网页和vue页面是如何通讯的?

uni-app 中 Web-view 与 Vue 页面的通讯机制详解 一、Web-view 简介 Web-view 是 uni-app 提供的一个重要组件&#xff0c;用于在原生应用中加载 HTML 页面&#xff1a; 支持加载本地 HTML 文件支持加载远程 HTML 页面实现 Web 与原生的双向通讯可用于嵌入第三方网页或 H5 应…...

重启Eureka集群中的节点,对已经注册的服务有什么影响

先看答案&#xff0c;如果正确地操作&#xff0c;重启Eureka集群中的节点&#xff0c;对已经注册的服务影响非常小&#xff0c;甚至可以做到无感知。 但如果操作不当&#xff0c;可能会引发短暂的服务发现问题。 下面我们从Eureka的核心工作原理来详细分析这个问题。 Eureka的…...

离线语音识别方案分析

随着人工智能技术的不断发展&#xff0c;语音识别技术也得到了广泛的应用&#xff0c;从智能家居到车载系统&#xff0c;语音识别正在改变我们与设备的交互方式。尤其是离线语音识别&#xff0c;由于其在没有网络连接的情况下仍然能提供稳定、准确的语音处理能力&#xff0c;广…...