From 7e2f4d6577e0cad52ec58b8496e00f1426bb4899 Mon Sep 17 00:00:00 2001 From: "wuji.xwt" Date: Tue, 8 Sep 2020 10:30:51 +0800 Subject: [PATCH] style: eslint settings --- packages/react-renderer/.eslintrc.js | 8 ++ .../react-renderer/src/context/appContext.ts | 3 +- packages/react-renderer/src/engine/index.tsx | 76 ++++++++++--------- packages/react-renderer/src/index.tsx | 52 +++++++------ .../react-renderer/src/renderer/addon.tsx | 2 +- packages/react-renderer/src/renderer/base.tsx | 5 +- .../react-renderer/src/renderer/component.tsx | 2 +- packages/react-renderer/src/renderer/temp.tsx | 2 +- .../react-renderer/src/utils/dataHelper.ts | 5 +- packages/react-renderer/src/utils/index.ts | 7 +- packages/react-renderer/src/utils/request.ts | 2 - 11 files changed, 91 insertions(+), 73 deletions(-) create mode 100644 packages/react-renderer/.eslintrc.js diff --git a/packages/react-renderer/.eslintrc.js b/packages/react-renderer/.eslintrc.js new file mode 100644 index 000000000..6c3b4b4a7 --- /dev/null +++ b/packages/react-renderer/.eslintrc.js @@ -0,0 +1,8 @@ +module.exports = { + extends: 'eslint-config-ali/typescript/react', + rules: { + "react/no-multi-comp": 1, + "no-shadow": 1, + "no-nested-ternary": 1 + }, +}; diff --git a/packages/react-renderer/src/context/appContext.ts b/packages/react-renderer/src/context/appContext.ts index 28ecf4591..266cd6bec 100644 --- a/packages/react-renderer/src/context/appContext.ts +++ b/packages/react-renderer/src/context/appContext.ts @@ -1,4 +1,5 @@ import { createContext } from 'react'; -const context = (window.__appContext = createContext({})); +const context = createContext({}); +window.__appContext = context; export default context; diff --git a/packages/react-renderer/src/engine/index.tsx b/packages/react-renderer/src/engine/index.tsx index d838dc551..d7f8b3fcf 100644 --- a/packages/react-renderer/src/engine/index.tsx +++ b/packages/react-renderer/src/engine/index.tsx @@ -31,16 +31,19 @@ class FaultComponent extends PureComponent { // FIXME: errorlog console.error('render error', this.props); const { _componentName: componentName } = this.props; - return (
组件 {componentName} 渲染错误，请打开控制台排查 -
); + return ( +
+ 组件 {componentName} 渲染错误，请打开控制台排查 +
+ ); } } @@ -48,17 +51,20 @@ class NotFoundComponent extends PureComponent { render() { console.error('component not found:', this.props); const { _componentName: componentName } = this.props; - return (
组件 {componentName} 无视图，请打开控制台排查 -
); + return ( +
+ 组件 {componentName} 无视图，请打开控制台排查 +
+ ); } } @@ -66,6 +72,7 @@ function isReactClass(obj) { return obj && obj.prototype && (obj.prototype.isReactComponent || obj.prototype instanceof Component); } +// eslint-disable-next-line react/no-redundant-should-component-update export default class Engine extends PureComponent { static dislayName = 'engine'; @@ -131,18 +138,18 @@ export default class Engine extends PureComponent { } }; - patchDidCatch(Component) { - if (!isReactClass(Component)) { + patchDidCatch(SetComponent) { + if (!isReactClass(SetComponent)) { return; } - if (Component.patchedCatch) { + if (SetComponent.patchedCatch) { return; } - Component.patchedCatch = true; - Component.getDerivedStateFromError = (error) => ({ engineRenderError: true, error }); + SetComponent.patchedCatch = true; + SetComponent.getDerivedStateFromError = (error) => ({ engineRenderError: true, error }); const engine = this; - const originRender = Component.prototype.render; - Component.prototype.render = function () { + const originRender = SetComponent.prototype.render; + SetComponent.prototype.render = function () { if (this.state && this.state.engineRenderError) { this.state.engineRenderError = false; return engine.createElement(engine.getFaultComponent(), { @@ -152,8 +159,8 @@ export default class Engine extends PureComponent { } return originRender.call(this); }; - const originShouldComponentUpdate = Component.prototype.shouldComponentUpdate; - Component.prototype.shouldComponentUpdate = function (nextProps, nextState) { + const originShouldComponentUpdate = SetComponent.prototype.shouldComponentUpdate; + SetComponent.prototype.shouldComponentUpdate = function (nextProps, nextState) { if (nextState && nextState.engineRenderError) { return true; } @@ -161,10 +168,10 @@ export default class Engine extends PureComponent { }; } - createElement(Component, props, children) { + createElement(SetComponent, props, children) { // TODO: enable in runtime mode? - this.patchDidCatch(Component); - return (this.props.customCreateElement || reactCreateElement)(Component, props, children); + this.patchDidCatch(SetComponent); + return (this.props.customCreateElement || reactCreateElement)(SetComponent, props, children); } getNotFoundComponent() { @@ -177,7 +184,7 @@ export default class Engine extends PureComponent { render() { const { - schema, designMode, appHelper, components, customCreateElement, + schema, designMode, appHelper, components, } = this.props; if (isEmpty(schema)) { return null; @@ -191,7 +198,6 @@ export default class Engine extends PureComponent { const allComponents = { ...ENGINE_COMPS, ...components }; let Comp = allComponents[componentName] || ENGINE_COMPS[`${componentName}Engine`]; if (Comp && Comp.prototype) { - const proto = Comp.prototype; if (!(Comp.prototype instanceof BaseEngine)) { Comp = ENGINE_COMPS[`${componentName}Engine`]; } diff --git a/packages/react-renderer/src/index.tsx b/packages/react-renderer/src/index.tsx index 81440bed7..a2b2a8b0e 100644 --- a/packages/react-renderer/src/index.tsx +++ b/packages/react-renderer/src/index.tsx @@ -30,17 +30,20 @@ class FaultComponent extends PureComponent { render() { // FIXME: errorlog console.error('render error', this.props); - return (
组件渲染异常，请查看控制台日志 -
); + return ( +
+ 组件渲染异常，请查看控制台日志 +
+ ); } } @@ -120,20 +123,20 @@ export default class Renderer extends Component { } }; - patchDidCatch(Component) { - if (!isReactClass(Component)) { + patchDidCatch(SetComponent) { + if (!isReactClass(SetComponent)) { return; } - if (Component.patchedCatch) { + if (SetComponent.patchedCatch) { return; } - Component.patchedCatch = true; - Component.getDerivedStateFromError = (error) => { + SetComponent.patchedCatch = true; + SetComponent.getDerivedStateFromError = (error) => { return { engineRenderError: true, error }; }; const engine = this; - const originRender = Component.prototype.render; - Component.prototype.render = function () { + const originRender = SetComponent.prototype.render; + SetComponent.prototype.render = function () { if (this.state && this.state.engineRenderError) { this.state.engineRenderError = false; return engine.createElement(engine.getFaultComponent(), { @@ -143,8 +146,8 @@ export default class Renderer extends Component { } return originRender.call(this); }; - const originShouldComponentUpdate = Component.prototype.shouldComponentUpdate; - Component.prototype.shouldComponentUpdate = function (nextProps, nextState) { + const originShouldComponentUpdate = SetComponent.prototype.shouldComponentUpdate; + SetComponent.prototype.shouldComponentUpdate = function (nextProps, nextState) { if (nextState && nextState.engineRenderError) { return true; } @@ -152,10 +155,10 @@ export default class Renderer extends Component { }; } - createElement(Component, props, children) { + createElement(SetComponent, props, children) { // TODO: enable in runtime mode? - this.patchDidCatch(Component); - return (this.props.customCreateElement || reactCreateElement)(Component, props, children); + this.patchDidCatch(SetComponent); + return (this.props.customCreateElement || reactCreateElement)(SetComponent, props, children); } getNotFoundComponent() { @@ -167,7 +170,7 @@ export default class Renderer extends Component { } render() { - const { schema, designMode, appHelper, components, customCreateElement } = this.props; + const { schema, designMode, appHelper, components } = this.props; if (isEmpty(schema)) { return null; } @@ -180,7 +183,6 @@ export default class Renderer extends Component { const allComponents = { ...ENGINE_COMPS, ...components }; let Comp = allComponents[componentName] || ENGINE_COMPS[`${componentName}Engine`]; if (Comp && Comp.prototype) { - const proto = Comp.prototype; if (!(Comp.prototype instanceof BaseEngine)) { Comp = ENGINE_COMPS[`${componentName}Engine`]; } diff --git a/packages/react-renderer/src/renderer/addon.tsx b/packages/react-renderer/src/renderer/addon.tsx index 02c3fbb54..8e2448dd6 100644 --- a/packages/react-renderer/src/renderer/addon.tsx +++ b/packages/react-renderer/src/renderer/addon.tsx @@ -78,7 +78,7 @@ export default class AddonRenderer extends BaseRenderer { debug(`addon.componentWillUnmount - ${this.props.__schema.fileName}`); } - async componentDidCatch(e) { + async componentDidCatch() { super.componentDidCatch(...arguments); debug(`addon.componentDidCatch - ${this.props.__schema.fileName}`); } diff --git a/packages/react-renderer/src/renderer/base.tsx b/packages/react-renderer/src/renderer/base.tsx index a09a836f0..ea685d9d8 100644 --- a/packages/react-renderer/src/renderer/base.tsx +++ b/packages/react-renderer/src/renderer/base.tsx @@ -1,3 +1,4 @@ +/* eslint-disable no-proto */ import React, { PureComponent } from 'react'; import PropTypes from 'prop-types'; import Debug from 'debug'; @@ -245,7 +246,7 @@ export default class BaseRender extends PureComponent { } if (Array.isArray(schema)) { if (schema.length === 1) return this.__createVirtualDom(schema[0], self, parentInfo); - return schema.map((item, idx) => this.__createVirtualDom(item, self, parentInfo, item && item.__ctx && item.__ctx.lunaKey ? '' : idx)); + return schema.map((item, idy) => this.__createVirtualDom(item, self, parentInfo, item && item.__ctx && item.__ctx.lunaKey ? '' : idy)); } // FIXME const _children = this.getSchemaChildren(schema); @@ -456,7 +457,7 @@ export default class BaseRender extends PureComponent { return checkProps(function () { const args = {}; if (Array.isArray(params) && params.length) { - params.map((item, idx) => { + params.forEach((item, idx) => { if (typeof item === 'string') { args[item] = arguments[idx]; } else if (item && typeof item === 'object') { diff --git a/packages/react-renderer/src/renderer/component.tsx b/packages/react-renderer/src/renderer/component.tsx index 09779dcad..001f1eb01 100644 --- a/packages/react-renderer/src/renderer/component.tsx +++ b/packages/react-renderer/src/renderer/component.tsx @@ -62,7 +62,7 @@ export default class CompRenderer extends BaseRenderer { debug(`comp.componentWillUnmount - ${this.props.__schema.fileName}`); } - async componentDidCatch(e) { + async componentDidCatch() { super.componentDidCatch(...arguments); debug(`comp.componentDidCatch - ${this.props.__schema.fileName}`); } diff --git a/packages/react-renderer/src/renderer/temp.tsx b/packages/react-renderer/src/renderer/temp.tsx index 43c002ea2..016f90159 100644 --- a/packages/react-renderer/src/renderer/temp.tsx +++ b/packages/react-renderer/src/renderer/temp.tsx @@ -39,7 +39,7 @@ export default class TempRenderer extends BaseRenderer { debug(`temp.componentDidMount - ${this.props.__schema.fileName}`); } - componentDidUpdate(prevProps, prevState, snapshot) { + componentDidUpdate() { debug(`temp.componentDidUpdate - ${this.props.__schema.fileName}`); } diff --git a/packages/react-renderer/src/utils/dataHelper.ts b/packages/react-renderer/src/utils/dataHelper.ts index 80455bf89..dca90e215 100644 --- a/packages/react-renderer/src/utils/dataHelper.ts +++ b/packages/react-renderer/src/utils/dataHelper.ts @@ -1,6 +1,5 @@ import { transformArrayToMap, isJSFunction, transformStringToFunction, clone } from './index'; import { jsonp, mtop, request, get, post, bzb } from './request'; -import Debug from 'debug'; const DS_STATUS = { INIT: 'init', @@ -8,7 +7,6 @@ const DS_STATUS = { LOADED: 'loaded', ERROR: 'error', }; -const debug = Debug('utils:dataHelper'); export default class DataHelper { constructor(comp, config = {}, appHelper, parser) { this.host = comp; @@ -158,7 +156,7 @@ export default class DataHelper { const afterRequest = this.appHelper && this.appHelper.utils && this.appHelper.utils.afterRequest; const csrfInput = document.getElementById('_csrf_token'); const _tb_token_ = csrfInput && csrfInput.value; - asyncDataList.map((req) => { + asyncDataList.forEach((req) => { const { id, type, options } = req; if (!id || !type) return; if (type === 'doServer') { @@ -271,6 +269,7 @@ export default class DataHelper { } fetchOne(type, options) { + // eslint-disable-next-line prefer-const let { uri, method = 'GET', headers, params, ...otherProps } = options; otherProps = otherProps || {}; switch (type) { diff --git a/packages/react-renderer/src/utils/index.ts b/packages/react-renderer/src/utils/index.ts index eb60ae850..38497b836 100644 --- a/packages/react-renderer/src/utils/index.ts +++ b/packages/react-renderer/src/utils/index.ts @@ -1,3 +1,4 @@ +/* eslint-disable no-new-func */ import Debug from 'debug'; import _keymaster from 'keymaster'; import { forEach as _forEach, shallowEqual as _shallowEqual } from '@ali/b3-one/lib/obj'; @@ -159,6 +160,7 @@ export function fillObj(receiver = {}, ...suppliers) { // 中划线转驼峰 export function toHump(name) { + // eslint-disable-next-line no-useless-escape return name.replace(/\-(\w)/g, (all, letter) => { return letter.toUpperCase(); }); @@ -448,7 +450,7 @@ export function addCssTag(id, content) { // 注册快捷 export function registShortCuts(config, appHelper) { - const keyboardFilter = (keymaster.filter = (event) => { + const keyboardFilter = (event) => { const eTarget = event.target || event.srcElement; const { tagName } = eTarget; const isInput = !!(tagName == 'INPUT' || tagName == 'SELECT' || tagName == 'TEXTAREA'); @@ -459,7 +461,8 @@ export function registShortCuts(config, appHelper) { } else { return true; } - }); + }; + keymaster.filter = keyboardFilter; const ideMessage = appHelper.utils && appHelper.utils.ideMessage; diff --git a/packages/react-renderer/src/utils/request.ts b/packages/react-renderer/src/utils/request.ts index d2f68eac5..6b2ae46a3 100644 --- a/packages/react-renderer/src/utils/request.ts +++ b/packages/react-renderer/src/utils/request.ts @@ -2,10 +2,8 @@ import 'whatwg-fetch'; import fetchMtop from '@ali/lib-mtop'; import fetchJsonp from 'fetch-jsonp'; import bzbRequest from '@ali/bzb-request'; -import Debug from 'debug'; import { serialize, buildUrl, parseUrl } from '@ali/b3-one/lib/url'; -const debug = Debug('utils:request'); export function get(dataAPI, params = {}, headers = {}, otherProps = {}) { headers = { Accept: 'application/json',