[React] Linting React JSX with ESLint (in ES6)
ESLint is a JavaScript linter (static analysis tool) that offers full support for ES6, JSX, and other modern tools via plugins. We walk through setting up ESLint in a project, using the eslint --init
CLI tool with the JSX and ES6 options, writing a React component in JSX, and adding some extra react linting rules with a plugin. ESLint is built to be "pluggable" with simple, extendable, modular rules and an API for writing and using plugins. ESLint has many rules which are all turned off by default; you can extend the core "recommended" rules which will catch common JavaScript errors, and you can also turn on stylistic rules for code consistency. You can also use plugin rules which we do in this lesson with the eslint-plugin-react
package.
{
"rules": {
"indent": [
2,
"tab"
],
"quotes": [
2,
"single"
],
"linebreak-style": [
2,
"unix"
],
"semi": [
2,
"always"
],
"react/prop-types": 1
},
"env": {
"es6": true,
"browser": true
},
"extends": "eslint:recommended",
"ecmaFeatures": {
"modules": true, //es6
"jsx": true,
"experimentalObjectRestSpread": true
},
"plugins": [
"react"
]
}
[React] Linting React JSX with ESLint (in ES6)的更多相关文章
- React Native的语法之ES5和ES6
原文地址:http://www.devio.org/2016/08/11/React-Native%E4%B9%8BReact%E9%80%9F%E5%AD%A6%E6%95%99%E7%A8%8B- ...
- React Js 之JSX
React使用JSX作为模板替换JavaScript,它不是必须的,但是它是推荐使用.原因如下: 1.它比传统的JavaScript更快,因为编译代码的时候,JSX做了相应的优化 2.它是类型安全的, ...
- React学习笔记 - JSX简介
React Learn Note 2 React学习笔记(二) 标签(空格分隔): React JavaScript 一.JSX简介 像const element = <h1>Hello ...
- react中的jsx详细理解
这是官网上的一个简单的例子 const name = 'Josh Perez'; const element = <h1>Hello, {name}</h1>; ReactDO ...
- 学习React从接受JSX开始
详情参考官方JSX规范 虽然JSX是扩展到ECMAScript的类XML语法,但是它本身并没有定义任何语义.也就是说它本身不在ECMAScript标准范围之内.它也不会被引擎或者浏览器直接执行.通常会 ...
- React.createElement 与 JSX
DOM 向JSX的演进 网页由 DOM 元素构成.React DOM 并不是浏览器的 DOM,而React DOM 只是用来告诉浏览器如何创建 DOM 的方法.通常情况下,我们并不需要 React 就 ...
- 假如React没了JSX
如题,想必React大家早已不陌生,而React里面的JSX都是玩的得心应手了,但是假如说React里面没有了React那会是一种什么样的情形呢,我们来简单的看一下. 首先我们来实现一个简单的list ...
- react 闲谈 之 JSX
jsx元素-> React.createElement -> 虚拟dom对象 -> render方法 1.在react中想将js当作变了引入到jsx中需要使用{} 2.在jsx中,相 ...
- 小谈React、React Native、React Web
React有三个东西,React JS 前端Web框架,React Native 移动终端Hybrid框架,React Web是一个源码转换工具(React Native 转 Web,并之所以特别提出 ...
随机推荐
- mysql datestamp坑
每次更改行数据,该行第一个datestamp如不赋值,会自动更新为当前时间.赋值还要注意用下new Date(time).updated_at要写在created_at前面...
- php几个比较高级的函数
1.传递任意数量的函数参数 我们在.NET或者JAVA编程中,一般函数参数个数都是固定的,但是PHP允许你使用任意个数的参数.下面这个示例向你展示了PHP函数的默认参数: 1 2 3 4 5 6 7 ...
- Android DropBoxManager Service
Android DropBoxManager Service 什么是 DropBoxManager ? Enqueues chunks of data (from various sources – ...
- How To mount/Browse Windows Shares【在linux{centos}上挂载、浏览window共享】
How to mount remote Windows shares Contents Required packages Basic method Better Method Even-better ...
- core文件找不到了
开始以为是core文件太大,设置ulimit -c unlimited 以后,再次访问,显示 ./a.out Segmentation fault (core dumped) 但是却找不到这个文件的 ...
- MAC 安装Ruby On Rails
MAC 安装Ruby On Rails 对于新入门的开发者,如何安装 Ruby, Ruby Gems 和 Rails 的运行环境可能会是个问题,本页主要介绍如何用一条靠谱的路子快速安装 Ruby 开发 ...
- POJ 2965 The Pilots Brothers' refrigerator 位运算枚举
The Pilots Brothers' refrigerator Time Limit: 1000MS Memory Limit: 65536K Total Submissions: 151 ...
- 听同事讲 Bayesian statistics: Part 1 - Bayesian vs. Frequentist
听同事讲 Bayesian statistics: Part 1 - Bayesian vs. Frequentist 摘要:某一天与同事下班一同做地铁,刚到地铁站,同事遇到一熟人正从地铁站出来. ...
- Lunch Time
hdu4807:http://acm.hdu.edu.cn/showproblem.php?pid=4807 题意:给你n个点(0--n-1),点之间是有向边,0号点有k个人,现在0号点的k个人要到n ...
- Spring与Oauth2整合示例 spring-oauth-server
原文地址:http://www.oschina.net/p/spring-oauth-server?fromerr=vpTctDBF