diff --git a/.eslintrc.js b/.eslintrc.js new file mode 100644 index 0000000..61ee246 --- /dev/null +++ b/.eslintrc.js @@ -0,0 +1,25 @@ +module.exports = { + "parser": "@typescript-eslint/parser", + "plugins": ["@typescript-eslint"], + "extends": ["plugin:@typescript-eslint/recommended"], + "parserOptions": { + "sourceType": "module" + }, + "rules": { + "@typescript-eslint/rule-name": "off", + "indent": ["error", 2, { + "SwitchCase": 1, + "VariableDeclarator": 1, + "outerIIFEBody": 1, + "MemberExpression": 1, + "FunctionDeclaration": { "parameters": 1, "body": 1 }, + "FunctionExpression": { "parameters": 1, "body": 1 }, + "CallExpression": { "arguments": 1 }, + "ArrayExpression": 1, + "ObjectExpression": 1, + "ImportDeclaration": 1, + "flatTernaryExpressions": false, + "ignoreComments": false + }], + } +} \ No newline at end of file diff --git a/package.json b/package.json index f129581..8999243 100644 --- a/package.json +++ b/package.json @@ -10,7 +10,8 @@ "clear": "rm -rf ./packages/*/dist/ & rm -rf ./packages/*/node_modules/", "jest": "jest --config jest.config.js", "test": "lerna bootstrap --no-ci && npm run build && npm run jest && npm run e2e", - "serve": "http-server ./" + "serve": "http-server ./", + "lint": "eslint --fix --ext .ts packages/*/src/**" }, "devDependencies": { "@babel/core": "^7.13.14", @@ -18,11 +19,15 @@ "@babel/preset-typescript": "^7.13.0", "@microsoft/api-extractor": "^7.13.2", "@rollup/plugin-node-resolve": "^11.2.1", + "@typescript-eslint/eslint-plugin": "^4.25.0", + "@typescript-eslint/parser": "^4.25.0", "babel-jest": "^26.6.3", "chalk": "^4.1.0", + "eslint": "^7.27.0", "execa": "^5.0.0", "fs-extra": "^9.1.0", "http-server": "^0.12.3", + "husky": "^6.0.0", "jest": "^26.6.3", "jimp": "^0.16.1", "koa-compose": "^4.1.0", diff --git a/packages/board/src/index.ts b/packages/board/src/index.ts index 6fd7778..31bdb89 100644 --- a/packages/board/src/index.ts +++ b/packages/board/src/index.ts @@ -19,12 +19,12 @@ class Board { private _displayCanvas: HTMLCanvasElement; private _mount: HTMLDivElement; private _opts: PrivateOptions; - private _hasRendered: boolean = false; + private _hasRendered = false; private _ctx: Context; private _displayCtx: CanvasRenderingContext2D; - private _scaleRatio: number = 1; - private _scrollX: number = 0; - private _scrollY: number = 0; + private _scaleRatio = 1; + private _scrollX = 0; + private _scrollY = 0; private _watcher: Watcher; constructor(mount: HTMLDivElement, opts: Options) { diff --git a/packages/board/src/util/event.ts b/packages/board/src/util/event.ts index 1713f99..3bdeb6b 100644 --- a/packages/board/src/util/event.ts +++ b/packages/board/src/util/event.ts @@ -11,21 +11,21 @@ export interface TypeBoardEventArgMap { } export interface TypeBoardEvent { - on(key: T, callback: (p: TypeBoardEventArgMap[T]) => any): void - off(key: T, callback: (p: TypeBoardEventArgMap[T]) => any): void + on(key: T, callback: (p: TypeBoardEventArgMap[T]) => void): void + off(key: T, callback: (p: TypeBoardEventArgMap[T]) => void): void trigger(key: T, p: TypeBoardEventArgMap[T]): void } export class BoardEvent implements TypeBoardEvent { - private _listeners: Map; + private _listeners: Map void)[]>; constructor() { this._listeners = new Map(); } - on(eventKey: T, callback: (p: TypeBoardEventArgMap[T]) => any) { + on(eventKey: T, callback: (p: TypeBoardEventArgMap[T]) => void) { if (this._listeners.has(eventKey)) { const callbacks = this._listeners.get(eventKey); callbacks?.push(callback); @@ -35,7 +35,7 @@ export class BoardEvent implements TypeBoardEvent { } } - off(eventKey: T, callback: (p: TypeBoardEventArgMap[T]) => any) { + off(eventKey: T, callback: (p: TypeBoardEventArgMap[T]) => void) { if (this._listeners.has(eventKey)) { const callbacks = this._listeners.get(eventKey); if (Array.isArray(callbacks)) { @@ -51,7 +51,7 @@ export class BoardEvent implements TypeBoardEvent { } trigger(eventKey: T, arg: TypeBoardEventArgMap[T]) { - let callbacks = this._listeners.get(eventKey); + const callbacks = this._listeners.get(eventKey); if (Array.isArray(callbacks)) { callbacks.forEach((cb) => { cb(arg); @@ -62,9 +62,9 @@ export class BoardEvent implements TypeBoardEvent { } } - has(name: string) { + has (name: string) { if (this._listeners.has(name)) { - const list: Function[] | undefined = this._listeners.get(name); + const list: ((p: TypeBoardEventArgMap[T]) => void)[] | undefined = this._listeners.get(name); if (Array.isArray(list) && list.length > 0) { return true; } diff --git a/packages/board/src/util/istype.ts b/packages/board/src/util/istype.ts index 0651aa1..94696f6 100644 --- a/packages/board/src/util/istype.ts +++ b/packages/board/src/util/istype.ts @@ -2,11 +2,11 @@ function parsePrototype (data: any) { const typeStr = Object.prototype.toString.call(data) || ''; const result = typeStr.replace(/(\[object|\])/ig, '').trim(); return result; -}; +} const istype = { type(data: any, lowerCase?: boolean) { - let result = parsePrototype(data); + const result = parsePrototype(data); return lowerCase === true ? result.toLocaleLowerCase() : result; }, diff --git a/packages/board/src/util/style.ts b/packages/board/src/util/style.ts index 9da4484..bab1e96 100644 --- a/packages/board/src/util/style.ts +++ b/packages/board/src/util/style.ts @@ -6,8 +6,8 @@ export const mergeCSS2StyleAttr = function( const cssList = []; if (istype.json(cssMap) === true) { for (const key in cssMap) { - let cssKey: string = `${key}`; - let cssVal: string = `${cssMap[key]}`; + let cssKey = `${key}`; + let cssVal = `${cssMap[key]}`; cssKey = cssKey.trim(); cssVal = cssVal.trim(); cssList.push(`${cssKey}:${cssVal}`); diff --git a/packages/board/src/util/watcher.ts b/packages/board/src/util/watcher.ts index 21f4258..320998a 100644 --- a/packages/board/src/util/watcher.ts +++ b/packages/board/src/util/watcher.ts @@ -5,7 +5,7 @@ import { BoardEvent, TypeBoardEventArgMap } from './event'; export class Watcher { private _canvas: HTMLCanvasElement; - private _isMoving: boolean = false; + private _isMoving = false; // private _onMove?: TypeWatchCallback; // private _onMoveStart?: TypeWatchCallback; // private _onMoveEnd?: TypeWatchCallback; @@ -36,13 +36,13 @@ export class Watcher { canvas.addEventListener('touchmove', this._listenMove.bind(this)); canvas.addEventListener('touchend', this._listenMoveEnd.bind(this)); - const mouseupEvent = new MouseEvent('mouseup'); - document.querySelector('body')?.addEventListener('mousemove', (e) => { - // @ts-ignore - if (e && e.path && e.path[0] !== canvas) { - canvas.dispatchEvent(mouseupEvent); - } - }, false) + // const mouseupEvent = new MouseEvent('mouseup'); + // document.querySelector('body')?.addEventListener('mousemove', (e) => { + // // @ts-ignore + // if (e && e.path && e.path[0] !== canvas) { + // canvas.dispatchEvent(mouseupEvent); + // } + // }, false) } _listenMoveStart(e: MouseEvent|TouchEvent) { diff --git a/packages/core/src/index.ts b/packages/core/src/index.ts index 4f8daab..b54af47 100644 --- a/packages/core/src/index.ts +++ b/packages/core/src/index.ts @@ -40,7 +40,7 @@ class Core { private [_renderer]: Renderer; private [_element]: Element; private [_helper]: Helper; - private [_hasInited]: boolean = false; + private [_hasInited] = false; private [_mode]: Mode = Mode.NULL; private [_selectedUUID]: string | null = null; diff --git a/packages/core/src/lib/draw.ts b/packages/core/src/lib/draw.ts index 2a97aa4..51d15c6 100644 --- a/packages/core/src/lib/draw.ts +++ b/packages/core/src/lib/draw.ts @@ -23,7 +23,7 @@ export function drawContext(ctx: TypeContext, data: TypeData, config: TypeHelper switch (ele.type) { case 'rect': { drawRect<'rect'>(ctx, ele as TypeElement<'rect'>); - }; + } default: { // nothing } diff --git a/packages/core/src/lib/element.ts b/packages/core/src/lib/element.ts index 1b00101..7ab385e 100644 --- a/packages/core/src/lib/element.ts +++ b/packages/core/src/lib/element.ts @@ -86,48 +86,48 @@ export class Element { elem.w -= moveX; elem.h -= moveY; break; - }; + } case 'top': { elem.y += moveY; elem.h -= moveY; break; - }; + } case 'top-right': { elem.y += moveY; elem.w += moveX; elem.h -= moveY; break; - }; + } case 'right': { elem.w += moveX; break; - }; + } case 'bottom-right': { elem.w += moveX; elem.h += moveY; break; - }; + } case 'bottom': { elem.h += moveY; break; - }; + } case 'bottom-left': { elem.x += moveX; elem.w -= moveX; elem.h += moveY; break; - }; + } case 'left': { elem.x += moveX; elem.w -= moveX; break; - }; + } case 'rotate': { const center = calcElementCenter(elem); const radian = calcRadian(center, prevPoint, point); elem.angle = (elem.angle || 0) + parseRadianToAngle(radian); break; - }; + } default: { break; } diff --git a/packages/core/src/util/time.ts b/packages/core/src/util/time.ts index 8ec52e6..07b5958 100644 --- a/packages/core/src/util/time.ts +++ b/packages/core/src/util/time.ts @@ -1,12 +1,13 @@ +type Middleware = (ctx: any, next: Middleware) => any; -export function compose (middleware: Function[]) { - return function (context: any, next?: Function) { +export function compose (middleware: Middleware[]) { + return function (context: any, next?: Middleware) { // let index = -1; return dispatch(0); function dispatch (i: number): Promise { // index = i - let fn = middleware[i] + let fn: Middleware = middleware[i] if (i === middleware.length && next) { fn = next; } @@ -29,7 +30,7 @@ export function delay(time: number): Promise { }) } -export function throttle(fn: Function, timeout: number) { +export function throttle(fn: (...args: any[]) => any, timeout: number) { let timer: any = -1; return function(...args: any[]) { if (timer > 0) {