zoukankan      html  css  js  c++  java
  • Taro3小程序中使用eslint standard校验踩坑

    Taro3小程序中使用eslint standard校验踩坑

    摘要

    在taro项目中,一般很少有集成其他eslint 格式校验规则的情况,如 standard / airbnb 等,但没准呢,对于所有项目都使用相同校验规则的团队来说,别人就是想集成自己喜欢的校验规则,就是不中意taro自带的校验规则。
    如何在taro3中集成standard校验规则?这是我遇到的问题,记录下正确填坑方式。
    在网上搜索了很多解决方法,大部分都是先装上 eslint-config-standard 依赖,然后再在 .eslintrc.js下 extends属性中配置 extends:['standard'],在经过一翻折腾之后,发现这种方式很不方便,不仅需要安装 eslint-config-standard 依赖,还要手动安装其他的一些杂七杂八的依赖,而且具体需要哪些依赖,你缺哪些依赖,哪些依赖版本应该怎么定,都会把人弄晕。

    配置方法

    最后,讲下我的解决方案,以下方案我是在 npmjs.com 上 关于eslint-config-standard 这个依赖的介绍里看到的,这里提供了自动配置 eslint 的方法,具体做法如下图所示:
    在这里插入图片描述

    先使用 npx eslint --init命令进行eslint 初始化,然后根据指示一步一步往下进行即可,示例如下图:
    选择安装eslint的作用;
    在这里插入图片描述
    选择使用什么 modules,现在一般都是第一个了;
    在这里插入图片描述
    选择项目框架;
    在这里插入图片描述
    选择项目运行环境;
    在这里插入图片描述
    选择eslint 格式校验规则配置选项,是选择当下几个主流的校验规则还是自定义,这里选第一个;
    在这里插入图片描述
    选 standard
    在这里插入图片描述
    选配置文件生成格式,这里选 JavaSccript格式的;
    在这里插入图片描述
    自动检查你当前所需要的eslint版本与你已安装的版本是否匹配,不匹配需要帮更新;
    在这里插入图片描述
    配置standard需要安装的所有依赖,这里都给你列出来了,只需要输入 yes 安装即可;
    在这里插入图片描述
    安装中....
    在这里插入图片描述
    安装完后会生成新的eslint配置文件;
    在这里插入图片描述

    遇到的坑:

    问题

    我在安装完成后曾出现以下这个问题:

    Error: .eslintrc.js » eslint-config-standard:
            Environment key "es2021" is unknown
    

    问题原因

    出现问题的原因是:
    当前版本的 eslint 与 eslint-config-standard 版本不兼容,这个在stackoverflow 上有很多大神提示;

    解决方案

    具体做法是:

    npm install eslint-config-standard@14.1.1 eslint-plugin-standard -dev
    

    其他问题

    如果安装过程出现其他问题,可以这样解决:

    使用 rimraf node_modules 命令 先删除事先已经存在的依赖包;
    使用 npx eslint --init 命令配置eslint,重新执行一次上面教程里的操作;
    使用 npm install 重新安装系统的依赖;
    The end.

    声明:本文版权归作者和博客园共有,欢迎转载,但未经作者同意必须保留此段声明,且在文章页面明显位置给出原文链接。对于本博客如有任何问题,可发邮件与我沟通,我的QQ邮箱是:3074596466@qq.com
  • 相关阅读:
    tcp/ip 调优示例
    【ASP.NET】IHttpHandler和IHttpModule
    【.NET框架】Dapper ORM 用法—Net下无敌的ORM
    【JavaScript】setinterval和setTimeout的区别
    【javascript】基于javascript的小时钟
    【ASP.NET】必须知道的ASP.NET核心处理
    【ASP.NET MVC】 路由机制:命名路由
    【ASP.NET MVC】提高页面加载速度:脚本优化
    SMTP协议--在cmd下利用命令行发送邮件
    【ASP.NET MVC】HTML5+MVC上传文件显示进度
  • 原文地址:https://www.cnblogs.com/CherishTheYouth/p/CherishTheYouth_20210417.html
Copyright © 2011-2022 走看看