init

add eslint (#1)

Author: Wxh16144

.babelrc

@@ -0,0 +1,14 @@
+{
+  "presets": [
+    [
+      "@babel/env",
+      {
+        "loose": true,
+        "modules": false
+      }
+    ],
+    "@babel/react"
+  ],
+  "include": "**/*.js",
+  "exclude": "**/*.ts"
+}

.eslintignore

@@ -0,0 +1,6 @@
+node_modules
+es
+lib
+tests
+
+packages/icons/src

.eslintrc

@@ -0,0 +1,16 @@
+{
+  "extends": "@antfu",
+  "overrides": [
+    {
+      "files": [
+        "**/demo/**/*.ts",
+        "**/demo/**/*.tsx",
+        "**/demo/**/*.js",
+        "**/demo/**/*.jsx"
+      ],
+      "rules": {
+        "no-console": "off"
+      }
+    }
+  ]
+}

.gitignore

@@ -0,0 +1,32 @@
+# Logs
+logs
+*.log
+npm-debug.log*
+yarn-debug.log*
+yarn-error.log*
+lerna-debug.log*
+.pnpm-debug.log*
+
+# Coverage directory used by tools like istanbul
+coverage
+*.lcov
+
+# Dependency directories
+node_modules
+
+# dotenv environment variable files
+.env
+.env.development.local
+.env.test.local
+.env.production.local
+.env.local
+
+# Idea
+.idea
+.vscode
+
+# Build output
+dist
+es
+lib
+.umi

CONTRIBUTING.md

@@ -0,0 +1,37 @@
+# 组件库贡献不完全指南
+
+> 非常高兴您愿意参与组件建设
+
+## 前置条件
+
+- [pnpm](https://pnpm.io/) 包管理器，嫌切换 yarn、npm、pnpm 麻烦可以使用 [@antfu/ni](https://github.com/antfu/ni) 快速切换。
+- `[email protected]`, 可以使用 `pnpm env use --global v14` 或者 [nvm](https://github.com/nvm-sh/nvm) 进行 Node 版本管理。
+
+## 快速了解
+
+```bash
+pnpm start      // 启动组件文档
+```
+
+稍等片刻后，本地浏览器打开 [http://localhost:8000/](http://localhost:8000/) 预览。
+
+## 其他命令
+
+> 下面出现的 `nr` 均表示 `pnpm run` 更多请看前置条件。
+
+```bash
+nr clean      // 移除构建产出
+nr start      // 启动 dumi 开发文档
+nr build      // 全部构建
+nr test       // 运行所有测试用例
+```
+
+**测试命令**更多命令查阅[Jest CLI 选项](https://jestjs.io/zh-Hans/docs/cli)
+
+- `nr test packages/rc-ui/src/condition-input --watch` 表示监听并运行改目录下所有测试用例文件。
+- `nr test -u` 表示更新所有测试用例快照。
+
+**依赖管理**更多命令查阅[pnpm CLI](https://pnpm.io/zh/pnpm-cli)
+
+- `ni eslint -Dw` 表示安装开发依赖在 root 目录。
+- `nr -F @template-pro/icons build` 表示构建 @template-pro/icon 包。

README.md

@@ -0,0 +1,5 @@
+# @template-pro/react-ui-library
+
+### Usage
+
+> TODO:

config/config.ts

@@ -0,0 +1,76 @@
+import path from 'path'
+import type { IConfig } from 'dumi'
+import { menus } from './menus'
+import { navs } from './navs'
+
+const resolvePath = (dir: string) => path.resolve(process.cwd(), dir)
+
+const config: IConfig = {
+  base: '/',
+  publicPath: '/',
+  exportStatic: {},
+  nodeModulesTransform: {
+    type: 'none',
+    exclude: [],
+  },
+  forkTSChecker: {},
+  alias: {
+    '@template-pro/desktop-ui': path.join(__dirname, 'library/desktop-ui'),
+    '@template-pro/mobile-ui': path.join(__dirname, 'library/mobile-ui'),
+    '@template-pro/icons': resolvePath('packages/icons/src'),
+    '@template-pro/rc-ui': resolvePath('packages/rc-ui/src'),
+    '@template-pro/utils': resolvePath('packages/utils/src'),
+  },
+  extraBabelPlugins: [
+    [
+      'babel-plugin-import',
+      {
+        libraryName: 'antd',
+        libraryDirectory: 'es',
+        style: true,
+      },
+      'antd',
+    ],
+    [
+      'babel-plugin-import',
+      {
+        libraryName: 'antd-mobile',
+        libraryDirectory: 'es',
+        style: true,
+      },
+      'antd-mobile',
+    ],
+  ],
+  chainWebpack(memo) {
+    memo.module.rules.delete('svg')
+    memo.module
+      .rule('svg')
+      .test(/\.svg$/)
+      .use('svg')
+      .loader('@svgr/webpack')
+  },
+  mode: 'site',
+  title: 'react-ui-library',
+  favicon: '/favicon.ico',
+  logo: '/logo.svg',
+  dynamicImport: {},
+  manifest: {},
+  hash: true,
+  links: [
+    { rel: 'stylesheet', href: 'https://unpkg.com/reset-css/reset.css' },
+  ],
+  resolve: {
+    includes: ['docs', 'packages'],
+    // passivePreview: true,
+  },
+  navs,
+  menus,
+  lessLoader: {
+    modifyVars: {
+      '@root-entry-name': 'default',
+    },
+    javascriptEnabled: true,
+  },
+}
+
+export default config

config/library/desktop-ui.js

@@ -0,0 +1,17 @@
+function pascalCase(name) {
+  return name.charAt(0).toUpperCase() + name.slice(1).replace(/-(\w)/g, (_, n) => n.toUpperCase())
+}
+
+const req = require.context('../../packages/desktop-ui/src', true, /^\.\/[^_][\w-]+\/style\/index\.less$/)
+
+req.keys().forEach((mod) => {
+  let v = req(mod)
+  if (v && v.default)
+    v = v.default
+
+  const match = mod.match(/^\.\/([^_][\w-]+)\/index\.less$/)
+  if (match && match[1])
+    exports[pascalCase(match[1])] = v
+})
+
+module.exports = require('../../packages/desktop-ui/src')

config/library/mobile-ui.js

@@ -0,0 +1,17 @@
+function pascalCase(name) {
+  return name.charAt(0).toUpperCase() + name.slice(1).replace(/-(\w)/g, (_, n) => n.toUpperCase())
+}
+
+const req = require.context('../../packages/mobile-ui/src', true, /^\.\/[^_][\w-]+\/style\/index\.less$/)
+
+req.keys().forEach((mod) => {
+  let v = req(mod)
+  if (v && v.default)
+    v = v.default
+
+  const match = mod.match(/^\.\/([^_][\w-]+)\/index\.less$/)
+  if (match && match[1])
+    exports[pascalCase(match[1])] = v
+})
+
+module.exports = require('../../packages/mobile-ui/src')

config/menus/desktop.ts

@@ -0,0 +1,22 @@
+import type { ComponentMenus } from '.'
+
+const desktopComponent: ComponentMenus = {
+  common: [],
+  layout: [],
+  navigation: [],
+  dataDisplay: [
+    'src/select-trigger',
+    'src/search-result',
+  ],
+  dataEntry: [
+    'src/ignore-emoji-input',
+    'src/number-only-input',
+  ],
+  feedback: [
+    'src/base-modal',
+  ],
+  guidance: [],
+  other: [],
+}
+
+export default desktopComponent

config/menus/icons.ts

@@ -0,0 +1,6 @@
+export default [
+  {
+    title: 'Icons',
+    children: ['demo'],
+  },
+]

config/menus/index.ts

@@ -0,0 +1,54 @@
+import desktopComponents from './desktop'
+import mobileComponents from './mobile'
+import utilsMenus from './utils'
+import rcUiMenus from './rcui'
+import iconsMenus from './icons'
+
+const enumText = {
+  common: '通用',
+  layout: '布局',
+  navigation: '导航',
+  dataDisplay: '信息展示',
+  dataEntry: '信息录入',
+  feedback: '反馈',
+  guidance: '引导提示',
+  other: '其他',
+  experimental: '试验性',
+} as const
+
+export type MenusKeys = keyof typeof enumText
+export type ComponentMenus = {
+  [key in MenusKeys]?: Array<string>
+}
+
+function generateComponentMenus(menus: ComponentMenus, prefix: string) {
+  const _menus: any[] = []
+  Object.entries(menus).forEach(([key, value]) => {
+    if (value.length)
+      _menus.push({ title: enumText[key as MenusKeys], children: value })
+  })
+  return addPrefix(_menus, prefix)
+}
+
+function addPrefix(menus: any[], prefix: string) {
+  return menus.map((item) => {
+    if (item.children)
+      item.children = item.children.map((child: string) => `${prefix}/${child}`)
+
+    return item
+  })
+}
+
+export const desktopPrefix = 'desktop-ui'
+export const mobilePrefix = 'mobile-ui'
+export const utilsPrefix = 'utils'
+export const rcUiPrefix = 'rc-ui'
+export const iconsPrefix = 'icons'
+
+export const menus = {
+  [`/${desktopPrefix}`]: generateComponentMenus(desktopComponents, desktopPrefix),
+  [`/${mobilePrefix}`]: generateComponentMenus(mobileComponents, mobilePrefix),
+  [`/${utilsPrefix}`]: addPrefix(utilsMenus, utilsPrefix),
+  [`/${rcUiPrefix}`]: addPrefix(rcUiMenus, rcUiPrefix),
+  [`/${iconsPrefix}`]: addPrefix(iconsMenus, iconsPrefix),
+}

config/menus/mobile.ts

@@ -0,0 +1,15 @@
+import type { ComponentMenus } from '.'
+
+const mobileComponent: ComponentMenus = {
+  common: [
+    'src/button',
+  ],
+  layout: [],
+  navigation: [],
+  dataDisplay: [],
+  dataEntry: [],
+  feedback: [],
+  guidance: [],
+  other: [],
+}
+export default mobileComponent

config/menus/rcui.ts

@@ -0,0 +1,9 @@
+export default [
+  {
+    title: 'General',
+    children: [
+      'src/condition-input',
+      'src/icon',
+    ],
+  },
+]

config/menus/utils.ts

@@ -0,0 +1,20 @@
+const utilsMenu = [
+  {
+    title: 'General',
+    children: ['src/with-default-props'],
+  },
+  {
+    title: 'React Hooks',
+    children: ['src/use-props-value'],
+  },
+  // {
+  //   title: "Date & Time",
+  //   children: [],
+  // },
+  // {
+  //   title: "String",
+  //   children: [],
+  // },
+]
+
+export default utilsMenu

config/navs.ts

@@ -0,0 +1,24 @@
+import { desktopPrefix, iconsPrefix, mobilePrefix, rcUiPrefix, utilsPrefix } from './menus'
+
+export const navs = [
+  {
+    title: 'desktop',
+    path: `/${desktopPrefix}`,
+  },
+  {
+    title: 'mobile',
+    path: `/${mobilePrefix}`,
+  },
+  {
+    title: 'icons',
+    path: `/${iconsPrefix}`,
+  },
+  {
+    title: 'rc-ui',
+    path: `/${rcUiPrefix}`,
+  },
+  {
+    title: 'utils',
+    path: `/${utilsPrefix}`,
+  },
+]