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 ...
随机推荐
- 使用idea生成maven项目的jar包(转)
第一步 第二步 第三步 转自:https://blog.csdn.net/waterimelon/article/details/69243651
- Swagger使用
Swagger 1.集成springboot 第一步:pom <dependency> <groupId>io.springfox</groupId> <ar ...
- 定时任务 spring @Scheduled注解
使用spring @Scheduled注解执行定时任务: 运行!!! 关于Cron表达式(转载) 表达式网站生成: http://cron.qqe2.com/ 直接点击 cronExpression ...
- 教女朋友写第一个php
1 首先 下载xampp 软件.按默认安装好之后 在电脑的右下角的箭头里能发现一个橘色的小图标 双击它 启动阿帕奇和mysql 会变绿 2 打开 C:\xampp\apache 文件夹 找到httpd ...
- 利用iptables防火墙允许1521端口被连接
今天在虚拟机上装了ora11g , 出现2个问题 1.i386的几个RPM包缺少导致安装验证不通过 2.安装完成后,本地电脑连不上虚拟机oracle , 但是能ping通 问题2: 简单的方法就是关掉 ...
- 452. Minimum Number of Arrows to Burst Balloons扎气球的个数最少
[抄题]: There are a number of spherical balloons spread in two-dimensional space. For each balloon, pr ...
- stark组件开发之编辑功能实现
编辑功能.和添加一样! 唯一不同的就是, 需要编辑一个指定的 记录.这就需要,在列表页面, 渲染编辑的时候,添加一个 id 值: class UserInfoHandler(StartHandler ...
- ORM常用字段介绍
Django中的ORM Django项目使用MySQL数据库 1. 在Django项目的settings.py文件中,配置数据库连接信息: DATABASES = { "default&qu ...
- 设计模式学习心得<单利模式 Singleton>
概述 意图 保证一个类仅有一个实例,并提供一个访问它的全局访问点. 主要解决 一个全局使用的类频繁地创建与销毁. 何时使用 当您想控制实例数目,节省系统资源的时候. 如何解决 判断系统是否已经有这个单 ...
- idea配置网络代理
背景 公司限制连接外网,很多软件都被限制了,包括idea,只能通过代理上网. 使用代理上网,以往都是在IE的工具-Internet选项-连接里进行设置就OK了,谷歌浏览器啥的就可以上网了.但intel ...