Create-React-App项目外使用它的eslint配置
概述
使用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配置的更多相关文章
- 如何扩展 Create React App 的 Webpack 配置
如何扩展 Create React App 的 Webpack 配置 原文地址https://zhaozhiming.github.io/blog/2018/01/08/create-react-a ...
- 深入 Create React App 核心概念
本文差点难产而死.因为总结的过程中,多次怀疑本文是对官方文档的直接翻译和简单诺列:同时官方文档很全面,全范围的介绍无疑加深了写作的心智负担.但在最终的梳理中,发现走出了一条与众不同的路,于是坚持分享出 ...
- 在 .NET Core 5 中集成 Create React app
翻译自 Camilo Reyes 2021年2月22日的文章 <Integrate Create React app with .NET Core 5> [1] Camilo Reyes ...
- tap news:week5 0.0 create react app
参考https://blog.csdn.net/qtfying/article/details/78665664 先创建文件夹 安装create react app 这个脚手架(facebook官方提 ...
- 使用create react app教程
This project was bootstrapped with Create React App. Below you will find some information on how to ...
- Create React App
Facebook开源了React前端框架(MIT Licence),也同时提供了React脚手架 - create-react-app. create-react-app遵循约定优于配置(Coc)的原 ...
- Create React App 安装less 报错
执行npm run eject 暴露模块 安装 npm i less less-loader -D 1.打开 react app 的 webpack.config.js const sassRege ...
- [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 ...
- [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 ...
随机推荐
- Digital Twin的8种解读!
国际8大主流厂商对digital twin的理解,很有必要来一次汇总! 据IDC预测,2017年世界上将有40%的大型生产商都会应用虚拟仿真技术来为他们的生产过程进行建模,Digital Twin可以 ...
- 修改CKplayer.js 源码解决移动端浏览器全屏不能限制快进的问题
原文地址:https://www.cnblogs.com/jying/p/9642445.html,转载请说明出处. 最近项目需要播放视频且限制未观看部分的快进功能,找了两款js插件ckplayer和 ...
- MFC笔记4
1.添加图片 1)静态加载图片,直接在resourceView中控件设置就可以以实现 2)动态加载时,按照鸡啄米的教程http://www.jizhuomi.com/software/193.html ...
- cmd与linux使用curl差异
其中在用windows下的cmd 进行curl命令,出现415报错,见下,请求头使用json形式,但报错却依然提示使用的是form表单形式: 一直以为问题出在springboot的转换器做string ...
- vi 操作
vi 3种模式:1命令行模式,2插入模式,3末行模式 Vim启动后直接进入的是命令行模式,命令行模式顾名思义就是可以输入各种命令的意思, 1. 命令行下按i键进入“插入模式”,命令行下按:键进入“末行 ...
- 转:Loadrunner添加服务器监控
一.监控windows系统:1.监视连接前的准备 1)进入被监视windows系统,开启以下二个服务Remote Procedure Call(RPC) 和Remote Registry ...
- Git的操作方法
创建仓库 git clone 加上你的远程仓库克隆下来 git add . 把你文件里面的改动更改添加到git里面 git status 查看状态,更新了那些内容 git commit -m" ...
- spring多线程
Spring4.x高级话题(二):多线程 一. 点睛 Spring通过任务执行器(TaskExecutor)来实现多线程和并发编程.使用ThreadPoolTaskExecutor可实现一个基于线程池 ...
- Activex、OLE、COM、OCX、DLL之间的区别
先明确组件(Component)和对象(Object)之间的区别: 组件是一个可重用的模块,它是由一组处理过程.数据封装和用户接口组成的业务对象(Rules Object).组件看起来像对象,但不符合 ...
- boost asio 网络聊天 代码修改学习
简化asio的聊天代码 去除ROOM的设计 所有连接客户端均在同一个ROOM下 /*********************************************************** ...