首页 > 其他分享 >Vue3 -- 项目配置之eslint【企业级项目配置保姆级教程1】

Vue3 -- 项目配置之eslint【企业级项目配置保姆级教程1】

时间:2024-11-13 15:15:30浏览次数:3  
标签:-- js 如下 eslint pnpm 企业级 安装

下面是项目级完整配置1➡eslint:【吐血分享,博主踩过的坑你跳过去!!跳不过去?太过分了给博主打钱】

浏览器自动打开项目:

你想释放双手吗?你想每天早上打开电脑运行完项目自动在浏览器打开吗?不要9998,不要998,只要你在我们爱的 package.json 中配置一下即可显示。如下图所示:
在这里插入图片描述
是的没错,只需添加 "dev": "vite --open", 包你美梦成真。

配置eslint:

是谁以前在vue.config.js里面偷偷的添加lintOnSave: false 关闭eslint检查逃过n节 ,是你吗我的先生女士们。。是我!(扭曲)(爬行)(尖叫)因为eslint太烦了!!
但是eslint可以帮助我们检查js语法及少部分格式问题。 自从和我的同事(他有代码洁癖)一起工作之后,我发现我被迫改了很多…非常感谢你,和我一起实习的同事,因为有你,代码更规范~~~
eslint官网直达路线

安装eslint:

// 安装最新版本的eslint

pnpm i eslint -D

然后我们需要告诉eslint,你要怎么工作

npx eslint --init

在这里插入图片描述
我们用eslint 检查语法、发现错误,如下图选择:
在这里插入图片描述
我们的项目采用的js模块 的模块式开发,如下图:
在这里插入图片描述
框架选取vue,如下图:
在这里插入图片描述
是否使用ts?是的。如下图:
在这里插入图片描述
项目运行在浏览器还是node上,我们选择浏览器。如下图:
在这里插入图片描述
使用eslint去校验我们的vue、ts语法,需要安装它提示的三个插件,是否选择安装呢?是的。如下图:
在这里插入图片描述
使用什么包管理工具下载呢?我这里使用的是pnpm,根据自己选择哈。如下图:
在这里插入图片描述
安装成功如下图(安装成功会自动生成eslint.config.js):
在这里插入图片描述
but 我这次需要安装v8.x的 避免我的一些版本冲突问题哈,根据自己的需求选择。

pnpm install [email protected] --save-dev

在这里插入图片描述
安装指令:

pnpm install -D

标签:--,js,如下,eslint,pnpm,企业级,安装
From: https://blog.csdn.net/qq_53002037/article/details/143744005

相关文章

  • 科研绘图系列:R语言功能通路表达热图(heatmap)
    文章目录介绍加载R包数据下载导入数据数据预处理热图:所有通路结果系统信息介绍R语言功能通路表达热图加载R包library(readxl)library(ggpubr)library(ggh4x)library(ggtext)library(tidyverse......
  • MySQL第九章,数据访问和DAO模式
    一、数据访问与Properties配置文件数据访问是应用程序与数据库之间的交互过程。在Java开发中,我们通常使用JDBC(JavaDatabaseConnectivity)来实现数据访问。然而,直接编写JDBC代码可能会导致代码冗长、难以维护,并且容易出错。为了简化数据访问过程,我们可以使用配置文件来管理数......
  • 【PR】Adobe Premiere Pro专业视频编辑软件下载安装
    一、软件简介1.什么是AdobePremierePro?AdobePremierePro(简称AdobePR)是一款由Adobe公司开发的专业视频编辑软件,广泛应用于影视制作、广告制作、电视广播、网络视频等领域。它具有强大的剪辑、音频处理、特效制作等功能,支持多种视频和音频格式,适用于各类创作者,从初学者到......
  • P10856 【MX-X2-T5】「Cfz Round 4」Xor-Forces题解
    题意:给定一个长度为\(n=2^k\)的数组\(a\),下标从\(0\)开始,维护\(m\)次操作:给定\(x\),设数列\(a'\)满足\(a'_i=a_{i\oplusx}\),将\(a\)修改为\(a'\)。其中\(\oplus\)表示按位异或运算。给定\(l,r\),查询\(a\)的下标在\(l,r\)之间的子数组有多少颜色段。不保......
  • 街面环卫算法视频分析服务器沿街晾晒智慧城管算法详解
    在城市精细化管理的背景下,智慧城管和街面秩序维护的需求日益增长。为了提高城市管理效率,确保城市秩序和市容市貌,一款集高清视频监控、智能分析与告警、数据资源共享服务于一体的智能化一体机设备应运而生。本文将详细介绍街面环卫算法视频分析服务器的功能特点以及其在智慧城管和......
  • MySQL导出1000条以上数据方法,及出错提示 --secure-file-priv解决方法
    1- MySQL导出1000条以上数据的脚本先上MySQL语句,如果执行没报错,那就是前人设置好了,如果报错接着向下看哦SELECT*FROMyour_tableINTOOUTFILE'C:/Users/Administrator/Desktop/key/file.csv'FIELDSTERMINATEDBY','ENCLOSEDBY'"'LINESTERMINATEDBY'\n&......
  • 【JetBrains DataGrip 2024软件下载与安装教程】
    1、安装包datagrip2024:链接:https://pan.quark.cn/s/60f7993eae45提取码:TfaJdatagrip-2023.3.2:链接:https://pan.quark.cn/s/d65297b4e648提取码:6CdA2、安装教程(建议关闭杀毒软件)1)       解压下载安装包,双击datagrip-2024.1.2.exe安装,弹窗安装对话框  2)......
  • NGINX负载均衡实战教程:打造高可用性架构 转载
    nginx负载均衡nginx负载均衡介绍反向代理与负载均衡nginx负载均衡配置Keepalived高可用nginx负载均衡器修改Web服务器的默认主页开启nginx负载均衡和反向代理安装Keepalived配置Keepalived编写脚本监控Keepalived和nginx的状态配置keepalived......
  • [题解]P3225 [HNOI2012] 矿场搭建
    P3225[HNOI2012]矿场搭建挖煤点坍塌相当于把该点和与其相连的边在图上删掉。借用wjyyy的题解,我们定义“叶子连通块”为“只包含\(1\)个割点的点双连通分量”,“非叶子连通块”为“包含\(\ge2\)个割点的点双连通分量”。如下图,橙色点是割点,红色框圈出的是点双,加粗的是叶子连通......
  • mysql基础知识
    sql语句类型及用途:Ddl:建表改表删表删数据【保留表结构】Dql:查询where,groupby,orderby,joinDml:新增修改删除数据Dcl:新增删除用户对数据库权限事务ACID特性简介原子性(Atomicity)事务被视为一个不可分割的最小单位,它要么完全执行,要么完全不执行。一致性(Consi......