@huangjunsen/eslint-config 1.0.0

package/__tests__/fixtures/use-babel-eslint.jsx

@@ -0,0 +1,170 @@
+import React, { Component } from "react";
+import { connect } from "react-redux";
+import { bindActionCreators } from "redux";
+import {
+  Breadcrumb,
+  Button,
+  Search,
+  Select,
+  Dropdown,
+  Menu,
+  Notice,
+} from "antd";
+import Layout from "layout";
+import { Translate } from "antd-i18n";
+import * as actions from "../actions/index";
+
+function scoreAudioCoverFile(imgFile) {
+  const fileName = path
+    .basename(imgFile.name, path.extname(imgFile.name))
+    .toLowerCase();
+  const relevanceScore = {
+    cover: 80,
+    folder: 80,
+    album: 80,
+    front: 80,
+    back: 20,
+    spectrogram: -80,
+  };
+
+  for (const keyword in relevanceScore) {
+    if (fileName === keyword) {
+      return relevanceScore[keyword];
+    }
+    if (fileName.indexOf(keyword) !== -1) {
+      return relevanceScore[keyword];
+    }
+  }
+  return 0;
+}
+
+const { Nav, Card, Section, Toolbar } = Layout;
+
+const ButtonGroup = Button.Group;
+const { Option } = Select;
+
+class Root extends Component {
+  componentDidMount() {
+    this.props.getBreadcrumb();
+  }
+
+  onSearch = (searchParams) => {
+    const foo = import(`./${searchParams}`);
+    console.log(foo);
+  };
+
+  onSelectChange(value, data) {
+    console.log(value, data);
+  }
+
+  onMenuClick(selectedKeys, menuItem, meta) {
+    console.log(selectedKeys, menuItem, meta);
+  }
+
+  render() {
+    const { breadcrumb } = this.props;
+    const subNavData = {
+      navs: [
+        {
+          key: "home",
+          text: "导航操作区",
+          active: true,
+          link: "#",
+        },
+        {
+          key: "permit",
+          text: "权限",
+          link: "#",
+        },
+        {
+          key: "favorite",
+          text: "常用链接",
+          link: "#",
+        },
+      ],
+    };
+
+    return (
+      <Layout>
+        <Nav data={subNavData} />
+        <Section>
+          <Breadcrumb dataSource={breadcrumb} />
+        </Section>
+        <Section>
+          <Notice title="提示：" type="info">
+            页面提示信息区（Notice组件）
+          </Notice>
+        </Section>
+        <Section>
+          <Toolbar>
+            <Toolbar.Left>
+              <Toolbar.Item>
+                <Button type="primary">页面操作区</Button>
+              </Toolbar.Item>
+              <Toolbar.Item>
+                <ButtonGroup>
+                  <Dropdown
+                    triggerButton={<Button type="normal">批量操作</Button>}
+                    triggerType="click"
+                  >
+                    <Menu onClick={this.onMenuClick}>
+                      <Menu.Item key="submit_cr">提交发布</Menu.Item>
+                      <Menu.Item key="close_cr">关闭变更</Menu.Item>
+                    </Menu>
+                  </Dropdown>
+                  <Dropdown
+                    triggerButton={<Button type="normal">更多</Button>}
+                    triggerType="click"
+                  >
+                    <Menu onClick={this.onMenuClick}>
+                      <Menu.Item key="other_1">更多操作 1</Menu.Item>
+                      <Menu.Item key="other_2">更多操作 2</Menu.Item>
+                      <Menu.Item key="other_3">更多操作 3</Menu.Item>
+                    </Menu>
+                  </Dropdown>
+                </ButtonGroup>
+              </Toolbar.Item>
+            </Toolbar.Left>
+            <Toolbar.Right>
+              <Toolbar.Item>
+                <Select onChange={this.onSelectChange} defaultValue="default">
+                  <Option value="default">默认排序</Option>
+                  <Option value="gmt_create|DESC">按创建时间降序</Option>
+                  <Option value="gmt_create|ASC">按创建时间升序</Option>
+                </Select>
+              </Toolbar.Item>
+              <Toolbar.Item>
+                <Search
+                  placeholder="请输入关键词搜索"
+                  onSearch={this.onSearch}
+                />
+              </Toolbar.Item>
+            </Toolbar.Right>
+          </Toolbar>
+        </Section>
+        <Section>
+          <Card
+            title="详细内容展示区（Card组件）"
+            extra={<a href="#">更多操作</a>}
+          >
+            <p>
+              <a href="#" target="_blank" rel="noreferrer noopener">
+                点击查看设计规范
+              </a>
+            </p>
+            <p>
+              <Button type="primary" onClick={this.props.changeLang}>
+                <Translate value="buttonText" />
+              </Button>
+            </p>
+          </Card>
+        </Section>
+      </Layout>
+    );
+  }
+}
+
+export default connect(
+  ({ index, ...others }) => ({ ...index, ...others }),
+  (dispatch) => bindActionCreators(actions, dispatch)
+)(Root);

package/__tests__/fixtures/vue.vue

@@ -0,0 +1,16 @@
+<template>
+  <div style="margin: 20px;">
+    <textarea>{{ value }}</textarea>
+  </div>
+</template>
+
+<script lang="js">
+export default {
+  data() {
+    const bo = import('./foo');
+    return {
+        value: 'value',
+    };
+  },
+};
+</script>

package/__tests__/use-babel-eslint.test.js

@@ -0,0 +1,47 @@
+const assert = require('assert');
+const eslint = require('eslint');
+const path = require('path');
+
+describe('test/use-babel-eslint.test.js', () => {
+  it('babel-eslint parser run well for react', async () => {
+    const configPath = './react.js';
+    const filePath = path.join(__dirname, './fixtures/use-babel-eslint.jsx');
+
+    const cli = new eslint.ESLint({
+      overrideConfigFile: configPath,
+      useEslintrc: false,
+      ignore: false,
+    });
+
+    const results = await cli.lintFiles([filePath]);
+    const { messages, errorCount, fatalErrorCount, warningCount } = results[0];
+
+    assert.equal(fatalErrorCount, 0);
+    assert.equal(errorCount, 27);
+    assert.equal(warningCount, 7);
+
+    const errorReportedByReactPlugin = messages.filter((result) => {
+      return result.ruleId && result.ruleId.indexOf('react/') !== -1;
+    });
+
+    assert.notEqual(errorReportedByReactPlugin.length, 0);
+  });
+
+  it('babel-eslint parser run well for vue', async () => {
+    const configPath = './vue.js';
+    const filePath = path.join(__dirname, './fixtures/vue.vue');
+
+    const cli = new eslint.ESLint({
+      overrideConfigFile: configPath,
+      useEslintrc: false,
+      ignore: false,
+    });
+
+    const results = await cli.lintFiles([filePath]);
+    const { errorCount, fatalErrorCount, warningCount } = results[0];
+
+    assert.equal(fatalErrorCount, 0);
+    assert.equal(errorCount, 4);
+    assert.equal(warningCount, 0);
+  });
+});

package/__tests__/validate-js-configs.test.js

@@ -0,0 +1,259 @@
+/**
+ * 验证 JS
+ */
+
+const assert = require('assert');
+const eslint = require('eslint');
+const path = require('path');
+const sumBy = require('lodash/sumBy');
+
+function isObject(obj) {
+  return typeof obj === 'object' && obj !== null;
+}
+
+describe('Validate JS configs', () => {
+  it('Validate eslint-config-encode', async () => {
+    const configPath = './index.js';
+    const filePath = path.join(__dirname, './fixtures/index.js');
+
+    const cli = new eslint.ESLint({
+      overrideConfigFile: configPath,
+      useEslintrc: false, // 如果不关这个参数，会将目录下的 eslintrc 与 overrideConfigFile merge
+      ignore: false,
+    });
+
+    // 验证导出的 config 是否正常
+    const config = await cli.calculateConfigForFile(filePath);
+    assert.ok(isObject(config));
+
+    // 验证 lint 工作是否正常
+    const results = await cli.lintFiles([filePath]);
+    assert.equal(sumBy(results, 'fatalErrorCount'), 0);
+    assert.notEqual(sumBy(results, 'errorCount'), 0);
+    assert.notEqual(sumBy(results, 'warningCount'), 0);
+  });
+
+  it('Validate eslint-config-encode/es5', async () => {
+    const configPath = './es5.js';
+    const filePath = path.join(__dirname, './fixtures/es5.js');
+
+    const cli = new eslint.ESLint({
+      overrideConfigFile: configPath,
+      useEslintrc: false,
+      ignore: false,
+    });
+
+    // 验证导出的 config 是否正常
+    const config = await cli.calculateConfigForFile(filePath);
+    assert.ok(isObject(config));
+
+    // 验证 lint 工作是否正常
+    const results = await cli.lintFiles([filePath]);
+    assert.equal(sumBy(results, 'fatalErrorCount'), 0);
+    assert.notEqual(sumBy(results, 'errorCount'), 0);
+    assert.equal(sumBy(results, 'warningCount'), 0);
+
+    // 验证 es5 覆盖的规则是否正常，取 comma-dangle 进行测试
+    const { messages } = results[0];
+    const errorReportedByReactPlugin = messages.filter((result) => {
+      return result.ruleId === 'comma-dangle';
+    });
+    assert.notEqual(errorReportedByReactPlugin.length, 0);
+  });
+
+  it('Validate eslint-config-encode/vue', async () => {
+    const configPath = './vue.js';
+    const filePath = path.join(__dirname, './fixtures/vue.vue');
+
+    const cli = new eslint.ESLint({
+      overrideConfigFile: configPath,
+      useEslintrc: false,
+      ignore: false,
+    });
+
+    // 验证导出的 config 是否正常
+    const config = await cli.calculateConfigForFile(filePath);
+    assert.ok(isObject(config));
+
+    // 验证 lint 工作是否正常
+    const results = await cli.lintFiles([filePath]);
+    assert.equal(sumBy(results, 'fatalErrorCount'), 0);
+    assert.notEqual(sumBy(results, 'errorCount'), 0);
+    assert.equal(sumBy(results, 'warningCount'), 0);
+
+    // 验证 eslint-plugin-vue 工作是否正常
+    const { messages } = results[0];
+    const errorReportedByReactPlugin = messages.filter((result) => {
+      return result.ruleId && result.ruleId.indexOf('vue/') !== -1;
+    });
+    assert.notEqual(errorReportedByReactPlugin.length, 0);
+  });
+
+  it('Validate eslint-config-encode/essential', async () => {
+    const configPath = './essential/index.js';
+    const filePath = path.join(__dirname, './fixtures/index.js');
+
+    const cli = new eslint.ESLint({
+      overrideConfigFile: configPath,
+      useEslintrc: false,
+      ignore: false,
+    });
+
+    // 验证导出的 config 是否正常
+    const config = await cli.calculateConfigForFile(filePath);
+    assert.ok(isObject(config));
+
+    // 验证 lint 工作是否正常
+    const results = await cli.lintFiles([filePath]);
+    assert.equal(sumBy(results, 'fatalErrorCount'), 0);
+    assert.equal(sumBy(results, 'errorCount'), 0);
+    assert.notEqual(sumBy(results, 'warningCount'), 0);
+
+    // 验证黑名单中的规则已关闭
+    const { messages } = results[0];
+
+    // 验证 semi 被关闭
+    const semiErrors = messages.filter((result) => {
+      return result.ruleId === 'semi';
+    });
+    assert.equal(semiErrors.length, 0);
+
+    // 验证 comma-spacing 被降级
+    const commaSpacingErrors = messages.filter((result) => {
+      return result.ruleId === 'comma-spacing';
+    });
+    assert.equal(commaSpacingErrors[0].severity, 1);
+  });
+
+  it('Validate eslint-config-encode/essential/es5', async () => {
+    const configPath = './essential/es5.js';
+    const filePath = path.join(__dirname, './fixtures/es5.js');
+
+    const cli = new eslint.ESLint({
+      overrideConfigFile: configPath,
+      useEslintrc: false,
+      ignore: false,
+    });
+
+    // 验证导出的 config 是否正常
+    const config = await cli.calculateConfigForFile(filePath);
+    assert.ok(isObject(config));
+
+    // 验证 lint 工作是否正常
+    const results = await cli.lintFiles([filePath]);
+    assert.equal(sumBy(results, 'fatalErrorCount'), 0);
+    assert.notEqual(sumBy(results, 'errorCount'), 0);
+    assert.notEqual(sumBy(results, 'warningCount'), 0);
+    // 验证 es5 覆盖的规则是否正常，取 comma-dangle 进行测试
+    const { messages } = results[0];
+    const errorReportedByReactPlugin = messages.filter((result) => {
+      return result.ruleId === 'comma-dangle';
+    });
+    assert.notEqual(errorReportedByReactPlugin.length, 0);
+
+    // 验证黑名单中的规则已关闭，取 semi 进行测试
+    const errorReportedByReactPluginBlackList = messages.filter((result) => {
+      return result.ruleId === 'semi';
+    });
+    assert.equal(errorReportedByReactPluginBlackList.length, 0);
+  });
+
+  it('Validate eslint-config-encode/essential/react', async () => {
+    const configPath = './essential/react.js';
+    const filePath = path.join(__dirname, './fixtures/react.jsx');
+
+    const cli = new eslint.ESLint({
+      overrideConfigFile: configPath,
+      useEslintrc: false,
+      ignore: false,
+    });
+
+    // 验证导出的 config 是否正常
+    const config = await cli.calculateConfigForFile(filePath);
+    assert.ok(isObject(config));
+
+    // 验证 lint 工作是否正常
+    const results = await cli.lintFiles([filePath]);
+    assert.equal(sumBy(results, 'fatalErrorCount'), 0);
+    assert.notEqual(sumBy(results, 'errorCount'), 0);
+    assert.notEqual(sumBy(results, 'warningCount'), 0);
+    // 验证 react plugin 工作是否正常
+    const { messages } = results[0];
+    const errorReportedByReactPlugin = messages.filter((result) => {
+      return result.ruleId && result.ruleId.indexOf('react/') !== -1;
+    });
+    assert.notEqual(errorReportedByReactPlugin.length, 0);
+
+    // 验证黑名单中的规则已关闭，取 react/jsx-indent 进行测试
+    const errorReportedByReactPluginBlackList = messages.filter((result) => {
+      return result.ruleId === 'react/jsx-indent';
+    });
+    assert.equal(errorReportedByReactPluginBlackList.length, 0);
+  });
+
+  it('Validate eslint-config-encode/essential/vue', async () => {
+    const configPath = './essential/vue.js';
+    const filePath = path.join(__dirname, './fixtures/vue.vue');
+
+    const cli = new eslint.ESLint({
+      overrideConfigFile: configPath,
+      useEslintrc: false,
+      ignore: false,
+    });
+
+    // 验证导出的 config 是否正常
+    const config = await cli.calculateConfigForFile(filePath);
+    assert.ok(isObject(config));
+
+    // 验证 lint 工作是否正常
+    const results = await cli.lintFiles([filePath]);
+    assert.equal(sumBy(results, 'fatalErrorCount'), 0);
+    assert.notEqual(sumBy(results, 'errorCount'), 0);
+    assert.equal(sumBy(results, 'warningCount'), 0);
+
+    // 验证 vue plugin 工作是否正常
+    const { messages } = results[0];
+    const errorReportedByReactPlugin = messages.filter((result) => {
+      return result.ruleId && result.ruleId.indexOf('vue/') !== -1;
+    });
+    assert.notEqual(errorReportedByReactPlugin.length, 0);
+
+    // 验证黑名单中的规则已关闭
+    const errorReportedByReactPluginBlackList = messages.filter((result) => {
+      return result.ruleId === 'indent';
+    });
+    assert.equal(errorReportedByReactPluginBlackList.length, 0);
+  });
+
+  it('Validate eslint-config-encode/node', async () => {
+    const configPath = './node.js';
+    const filePath = path.join(__dirname, './fixtures/node.js');
+
+    const cli = new eslint.ESLint({
+      overrideConfigFile: configPath,
+      useEslintrc: false,
+      ignore: false,
+    });
+
+    // 验证导出的 config 是否正常
+    const config = await cli.calculateConfigForFile(filePath);
+    assert.ok(isObject(config));
+    assert.strictEqual(config.env.node, true);
+    assert.strictEqual(config.plugins.includes('node'), true);
+
+    // 验证已开启的 link 规则是否校验正常
+    const results = await cli.lintFiles([filePath]);
+    const { messages, errorCount, warningCount } = results[0];
+    const ruleIds = Array.from(messages.map((item) => item.ruleId));
+    assert.strictEqual(ruleIds.includes('node/prefer-promises/fs'), true);
+    assert.strictEqual(ruleIds.includes('no-unused-vars'), true);
+    assert.strictEqual(ruleIds.includes('node/no-new-require'), true);
+    assert.strictEqual(ruleIds.includes('semi'), true);
+    assert.strictEqual(ruleIds.includes('quotes'), true);
+    assert.strictEqual(errorCount, 7);
+    assert.strictEqual(warningCount, 4);
+
+    // 验证已关闭的 link 规则是否校验正常，以 node/exports-style 为例
+    assert.strictEqual(ruleIds.includes('node/exports-style'), false);
+  });
+});