概述

使用Create-React-App脚手架感觉它的eslint配置有点好用,于是考虑不用Create-React-App脚手架该怎么使用这些配置。

我于是eject了Create-React-App脚手架,查看它的详细配置和官方文档,总结了使用它的eslint配置的方法,记录如下,供以后开发时参考,相信对其它人也有用。

配置

(1)首先安装依赖:

npm install eslint --save-dev
npm install babel-eslint --save-dev
npm install eslint-plugin-flowtype --save-dev
npm install eslint-plugin-jsx-a11y --save-dev

(2)然后配置package.json文件。(不需要配置.eslintrc.js文件,详见Eslint Configuring文档)

"eslintConfig": {
"parser": "babel-eslint",
"extends": [
"plugin:flowtype/recommended",
"plugin:jsx-a11y/recommended"
],
"plugins": [
"flowtype",
"jsx-a11y"
]
}

(3)在主目录下面输入eslint + 文件名即可。比如eslint test.js

测试是否生效

测试内容如下,如果有5个报错,那么证明是生效的。

type X = bool
// Message: Use "boolean", not "bool" // Options: ["boolean"]
type X = bool
// Message: Use "boolean", not "bool" // Options: ["bool"]
type X = boolean
// Message: Use "bool", not "boolean"

感想

以前用eslint的时候感觉每次要配置.eslintrc.js文件超级麻烦,现在才发现可以直接在package.json配置,真的很方便。

Create-React-App项目外使用它的eslint配置的更多相关文章

  1. 如何扩展 Create React App 的 Webpack 配置

    如何扩展 Create React App 的 Webpack 配置  原文地址https://zhaozhiming.github.io/blog/2018/01/08/create-react-a ...

  2. 深入 Create React App 核心概念

    本文差点难产而死.因为总结的过程中,多次怀疑本文是对官方文档的直接翻译和简单诺列:同时官方文档很全面,全范围的介绍无疑加深了写作的心智负担.但在最终的梳理中,发现走出了一条与众不同的路,于是坚持分享出 ...

  3. 在 .NET Core 5 中集成 Create React app

    翻译自 Camilo Reyes 2021年2月22日的文章 <Integrate Create React app with .NET Core 5> [1] Camilo Reyes ...

  4. tap news:week5 0.0 create react app

    参考https://blog.csdn.net/qtfying/article/details/78665664 先创建文件夹 安装create react app 这个脚手架(facebook官方提 ...

  5. 使用create react app教程

    This project was bootstrapped with Create React App. Below you will find some information on how to ...

  6. Create React App

    Facebook开源了React前端框架(MIT Licence),也同时提供了React脚手架 - create-react-app. create-react-app遵循约定优于配置(Coc)的原 ...

  7. Create React App 安装less 报错

    执行npm run eject 暴露模块 安装 npm i  less less-loader -D 1.打开 react app 的 webpack.config.js const sassRege ...

  8. [React] Use the Fragment Short Syntax in Create React App 2.0

    create-react-app version 2.0 added a lot of new features. One of the new features is upgrading to Ba ...

  9. [React] {svg, css module, sass} support in Create React App 2.0

    create-react-app version 2.0 added a lot of new features. One of the new features is added the svgr  ...

随机推荐

  1. json.dump和json.dumps区别,json.load和json.loads的区别

    dumps是将python类型(list,dict等)转化成str格式,loads是将str转化成python类型(list,dict等). dump和load也是类似的功能,只是与文件操作结合起来了 ...

  2. js 一些兼容检测

    1. IE5.0之前不支持 document.getElementById(),但存在 document.all[] function getElementById(id) { if(document ...

  3. Python设计模式 - 基础 - 封装 & 继承 & 多态

    面向对象的核心是对象,世间万物都可以看作对象,任何一个对象都可以通过一系列属性和行为来描述,可以包含任意数量和类型的数据或操作.类是用来描述具有相同属性和方法的所有对象的集合.类通常是抽象化的概念,而 ...

  4. nginx命令启动及选项

    [root@ke]# nginx -h  #this help [root@ke]# nginx -t  #检查配置文件的语法 [root@ke]# nginx -T  #检查配置文件的语法并输出 [ ...

  5. pythonj基础(五)元组和集合

    一,什么是元祖 Python的元组与列表类似,不同之处在于元组的元素不能修改. 元组使用小括号,列表使用方括号. 元组创建很简单,只需要在括号中添加元素,并使用逗号隔开即可. 1.创建一个空元组 tu ...

  6. Py西游攻关之RabbitMQ、Memcache、Redis

    Py西游攻关之RabbitMQ.Memcache.Redis   RabbitMQ 解释RabbitMQ,就不得不提到AMQP(Advanced Message Queuing Protocol)协议 ...

  7. React-router4 简单总结

    官方文档读到这里,大概明白了React-router是专门为单页面设计的,,我只能说多页面格外的不方便 首先这个是基本的套路 import React from 'react' import Reac ...

  8. ulogd(一)

    参考资料: https://blog.csdn.net/eydwyz/article/details/52456335 https://blog.csdn.net/chinalinuxzend/art ...

  9. 创建.NET core的守护进程

    http://www.cnblogs.com/savorboard/p/dotnetcore-supervisor.html

  10. 【MarkMark学习笔记学习笔记】javascript/js 学习笔记

    1.0, 概述.JavaScript是ECMAScript的实现之一 2.0,在HTML中使用JavaScript. 2.1 3.0,基本概念 3.1,ECMAScript中的一切(变量,函数名,操作 ...