From 9b36122c399e2eb602e8cdb6d07a1b113054f23a Mon Sep 17 00:00:00 2001 From: Anthony Fu Date: Mon, 19 Jul 2021 22:53:56 +0800 Subject: [PATCH] refactor: format code style for resolvers --- src/resolvers/element-plus.ts | 17 +-- src/resolvers/element-ui.ts | 5 +- src/resolvers/headless-ui.ts | 8 +- src/resolvers/index.ts | 10 +- src/resolvers/naive-ui.ts | 8 +- src/resolvers/prime-vue.ts | 196 +++++++++++++++++----------------- src/resolvers/vant.ts | 19 ++-- src/resolvers/view-ui.ts | 30 +++--- src/resolvers/vuetify.ts | 8 +- src/resolvers/vueuse.ts | 32 +++--- src/types.ts | 2 +- 11 files changed, 177 insertions(+), 158 deletions(-) diff --git a/src/resolvers/element-plus.ts b/src/resolvers/element-plus.ts index 8604bd52..f7513b62 100644 --- a/src/resolvers/element-plus.ts +++ b/src/resolvers/element-plus.ts @@ -17,13 +17,16 @@ export interface ElementPlusResolverOptions { * @author @develar * @link https://element-plus.org/#/en-US */ -export const ElementPlusResolver = (options: ElementPlusResolverOptions = {}): ComponentResolver => (name: string) => { - const { importStyle = true } = options - if (name.startsWith('El')) { - const partialName = name[2].toLowerCase() + name.substring(3).replace(/[A-Z]/g, l => `-${l.toLowerCase()}`) - return { - path: `element-plus/es/el-${partialName}`, - sideEffects: importStyle ? `element-plus/packages/theme-chalk/src/${partialName}.scss` : undefined, +export function ElementPlusResolver(options: ElementPlusResolverOptions = {}): ComponentResolver { + return (name: string) => { + const { importStyle = true } = options + + if (name.startsWith('El')) { + const partialName = name[2].toLowerCase() + name.substring(3).replace(/[A-Z]/g, l => `-${l.toLowerCase()}`) + return { + path: `element-plus/es/el-${partialName}`, + sideEffects: importStyle ? `element-plus/packages/theme-chalk/src/${partialName}.scss` : undefined, + } } } } diff --git a/src/resolvers/element-ui.ts b/src/resolvers/element-ui.ts index 2d99c8ac..592ab00d 100644 --- a/src/resolvers/element-ui.ts +++ b/src/resolvers/element-ui.ts @@ -42,8 +42,8 @@ function getSideEffects( * @version @element-ui ^2.15.3, @vue ^2.6.14 * @author @nabaonan */ -export const ElementUiResolver = (options: ElementUiResolverOptions = {}): ComponentResolver => - (name: string) => { +export function ElementUiResolver(options: ElementUiResolverOptions = {}): ComponentResolver { + return (name: string) => { if (name.startsWith('El')) { const compName = name.slice(2) const partialName = kebabCase(compName) @@ -53,3 +53,4 @@ export const ElementUiResolver = (options: ElementUiResolverOptions = {}): Compo } } } +} diff --git a/src/resolvers/headless-ui.ts b/src/resolvers/headless-ui.ts index 45e3839b..fddb17cd 100644 --- a/src/resolvers/headless-ui.ts +++ b/src/resolvers/headless-ui.ts @@ -42,7 +42,9 @@ const components = [ * * @link https://github.com/tailwindlabs/headlessui */ -export const HeadlessUiResolver = (): ComponentResolver => (name: string) => { - if (components.includes(name)) - return { importName: name, path: '@headlessui/vue' } +export function HeadlessUiResolver(): ComponentResolver { + return (name: string) => { + if (components.includes(name)) + return { importName: name, path: '@headlessui/vue' } + } } diff --git a/src/resolvers/index.ts b/src/resolvers/index.ts index 949bed17..d541d96b 100644 --- a/src/resolvers/index.ts +++ b/src/resolvers/index.ts @@ -1,11 +1,11 @@ export * from './antdv' export * from './element-plus' +export * from './element-ui' export * from './headless-ui' -export * from './vant' -export * from './vuetify' -export * from './vueuse' export * from './naive-ui' -export * from './varlet-ui' -export * from './element-ui' export * from './prime-vue' +export * from './vant' +export * from './varlet-ui' export * from './view-ui' +export * from './vuetify' +export * from './vueuse' diff --git a/src/resolvers/naive-ui.ts b/src/resolvers/naive-ui.ts index 8a285d0d..be6ff34b 100644 --- a/src/resolvers/naive-ui.ts +++ b/src/resolvers/naive-ui.ts @@ -6,7 +6,9 @@ import { ComponentResolver } from '../types' * @author @antfu * @link https://www.naiveui.com/ */ -export const NaiveUiResolver = (): ComponentResolver => (name: string) => { - if (name.match(/^N[A-Z]/)) - return { importName: name, path: 'naive-ui' } +export function NaiveUiResolver(): ComponentResolver { + return (name: string) => { + if (name.match(/^N[A-Z]/)) + return { importName: name, path: 'naive-ui' } + } } diff --git a/src/resolvers/prime-vue.ts b/src/resolvers/prime-vue.ts index 7f0301a7..59b084be 100644 --- a/src/resolvers/prime-vue.ts +++ b/src/resolvers/prime-vue.ts @@ -1,91 +1,91 @@ -import { ComponentResolver } from "../types" +import { ComponentResolver, SideEffectsInfo } from '../types' const components = [ - "AutoComplete", - "Calendar", - "CascadeSelect", - "Checkbox", - "Chips", - "ColorPicker", - "Dropdown", - "Editor", - "InputMask", - "InputNumber", - "InputSwitch", - "InputText", - "Knob", - "Listbox", - "MultiSelect", - "Password", - "RadioButton", - "Rating", - "SelectButton", - "Slider", - "Textarea", - "ToggleButton", - "TreeSelect", - "TriStateCheckbox", - "Button", - "SplitButton", - "DataTable", - "Column", - "ColumnGroup", - "DataView", - "FullCalendar", - "OrderList", - "OrganizationChart", - "Paginator", - "PickList", - "Timelist", - "Tree", - "TreeTable", - "Accordion", - "AccordionTab", - "Card", - "DeferredContent", - "Divider", - "Fieldset", - "Panel", - "Splitter", - "SplitterPanel", - "ScrollPanel", - "TabView", - "TabPanel", - "Toolbar", - "ConfirmDialog", - "ConfirmPopup", - "Dialog", - "OverlayPanel", - "Sidebar", - "Tooltip", - "FileUpload", - "Breadcrumb", - "ContextMenu", - "MegaMenu", - "Menu", - "Menubar", - "PanelMenu", - "Steps", - "TabMenu", - "TieredMenu", - "Chart", - "Message", - "Toast", - "Carousel", - "Galleria", - "Avatar", - "AvatarGroup", - "Badge", - "Chip", - "BlockUI", - "Inplace", - "ScrollTop", - "Skeleton", - "ProgressBar", - "ProgressSpiner", - "Tag", - "Terminal", - "TerminalService", + 'AutoComplete', + 'Calendar', + 'CascadeSelect', + 'Checkbox', + 'Chips', + 'ColorPicker', + 'Dropdown', + 'Editor', + 'InputMask', + 'InputNumber', + 'InputSwitch', + 'InputText', + 'Knob', + 'Listbox', + 'MultiSelect', + 'Password', + 'RadioButton', + 'Rating', + 'SelectButton', + 'Slider', + 'Textarea', + 'ToggleButton', + 'TreeSelect', + 'TriStateCheckbox', + 'Button', + 'SplitButton', + 'DataTable', + 'Column', + 'ColumnGroup', + 'DataView', + 'FullCalendar', + 'OrderList', + 'OrganizationChart', + 'Paginator', + 'PickList', + 'Timelist', + 'Tree', + 'TreeTable', + 'Accordion', + 'AccordionTab', + 'Card', + 'DeferredContent', + 'Divider', + 'Fieldset', + 'Panel', + 'Splitter', + 'SplitterPanel', + 'ScrollPanel', + 'TabView', + 'TabPanel', + 'Toolbar', + 'ConfirmDialog', + 'ConfirmPopup', + 'Dialog', + 'OverlayPanel', + 'Sidebar', + 'Tooltip', + 'FileUpload', + 'Breadcrumb', + 'ContextMenu', + 'MegaMenu', + 'Menu', + 'Menubar', + 'PanelMenu', + 'Steps', + 'TabMenu', + 'TieredMenu', + 'Chart', + 'Message', + 'Toast', + 'Carousel', + 'Galleria', + 'Avatar', + 'AvatarGroup', + 'Badge', + 'Chip', + 'BlockUI', + 'Inplace', + 'ScrollTop', + 'Skeleton', + 'ProgressBar', + 'ProgressSpiner', + 'Tag', + 'Terminal', + 'TerminalService', ] export interface PrimeVueResolverOptions { @@ -116,21 +116,22 @@ export interface PrimeVueResolverOptions { * * @link https://github.com/primefaces/primevue */ -export const PrimeVueResolver = - (options: PrimeVueResolverOptions = {}): ComponentResolver => - (name: string) => { - const sideEffects = [] - if (options.importStyle) { - sideEffects.push("primevue/resources/primevue.min.css") - } - if (options.importIcons) { - sideEffects.push("primeicons/primeicons.css") - } +export function PrimeVueResolver(options: PrimeVueResolverOptions = {}): ComponentResolver { + return (name: string) => { + const sideEffects: SideEffectsInfo = [] + + if (options.importStyle) + sideEffects.push('primevue/resources/primevue.min.css') + + if (options.importIcons) + sideEffects.push('primeicons/primeicons.css') + if (options.importTheme) { sideEffects.push( - `primevue/resources/themes/${options.importTheme}/theme.css` + `primevue/resources/themes/${options.importTheme}/theme.css`, ) } + if (components.includes(name)) { return { path: `primevue/${name}/${name}.vue`, @@ -138,3 +139,4 @@ export const PrimeVueResolver = } } } +} diff --git a/src/resolvers/vant.ts b/src/resolvers/vant.ts index 9eb15722..8b836e7d 100644 --- a/src/resolvers/vant.ts +++ b/src/resolvers/vant.ts @@ -15,14 +15,17 @@ export interface VantResolverOptions { * * @link https://github.com/youzan/vant */ -export const VantResolver = (options: VantResolverOptions = {}): ComponentResolver => (name: string) => { - const { importStyle = true } = options - if (name.startsWith('Van')) { - const partialName = name.slice(3) - return { - importName: partialName, - path: 'vant/es', - sideEffects: importStyle ? `vant/es/${kebabCase(partialName)}/style` : undefined, +export function VantResolver(options: VantResolverOptions = {}): ComponentResolver { + return (name: string) => { + const { importStyle = true } = options + + if (name.startsWith('Van')) { + const partialName = name.slice(3) + return { + importName: partialName, + path: 'vant/es', + sideEffects: importStyle ? `vant/es/${kebabCase(partialName)}/style` : undefined, + } } } } diff --git a/src/resolvers/view-ui.ts b/src/resolvers/view-ui.ts index 53668603..e25f8c7c 100644 --- a/src/resolvers/view-ui.ts +++ b/src/resolvers/view-ui.ts @@ -1,18 +1,16 @@ import { ComponentResolver } from '../types' import { kebabCase } from '../utils' -const getSideEffects: ( - compName: string, -) => string[] = (compName) => { +function getSideEffects(componentName: string) { const sideEffects = [ 'view-design/dist/styles/iview.css', 'popper.js/dist/umd/popper.js', ] - if (/^Table/.test(compName)) + if (/^Table/.test(componentName)) sideEffects.push('element-resize-detector') - if (/^Date/.test(compName)) + if (/^Date/.test(componentName)) sideEffects.push('js-calendar') return sideEffects @@ -25,8 +23,8 @@ const matchComponents = [ }, ] -const getCompDir = (compName: string): string => { - let compPath: string|undefined +function getCompDir(compName: string): string { + let compPath: string | undefined const total = matchComponents.length for (let i = 0; i < total; i++) { @@ -36,7 +34,9 @@ const getCompDir = (compName: string): string => { break } } - if (!compPath) compPath = kebabCase(compName) + if (!compPath) + compPath = kebabCase(compName) + return compPath } @@ -49,12 +49,14 @@ const getCompDir = (compName: string): string => { * - select component render error PR: https://github.com/view-design/ViewUI/pull/944, choose can't display value,because click option trigger twice,at second time,select value turn into undefined. * - scroll component has a template syntax called lang='html',it is require html-loader,but vite plugin not support yet,remove it can run. */ -export const ViewUiResolver = (): ComponentResolver => (name: string) => { - if (name.match(/^I[A-Z]/)) { - const compName = name.slice(1) - return { - path: `view-design/src/components/${getCompDir(compName)}`, - sideEffects: getSideEffects(compName), +export function ViewUiResolver(): ComponentResolver { + return (name: string) => { + if (name.match(/^I[A-Z]/)) { + const compName = name.slice(1) + return { + path: `view-design/src/components/${getCompDir(compName)}`, + sideEffects: getSideEffects(compName), + } } } } diff --git a/src/resolvers/vuetify.ts b/src/resolvers/vuetify.ts index 2c7a2159..d2e38fa7 100644 --- a/src/resolvers/vuetify.ts +++ b/src/resolvers/vuetify.ts @@ -5,7 +5,9 @@ import { ComponentResolver } from '../types' * * @link https://github.com/vuetifyjs/vuetify */ -export const VuetifyResolver = (): ComponentResolver => (name: string) => { - if (name.match(/^V[A-Z]/)) - return { importName: name, path: 'vuetify/lib' } +export function VuetifyResolver(): ComponentResolver { + return (name: string) => { + if (name.match(/^V[A-Z]/)) + return { importName: name, path: 'vuetify/lib' } + } } diff --git a/src/resolvers/vueuse.ts b/src/resolvers/vueuse.ts index 0cdfc6b8..e984ede3 100644 --- a/src/resolvers/vueuse.ts +++ b/src/resolvers/vueuse.ts @@ -7,21 +7,23 @@ let components: string[] | undefined * * @link https://github.com/vueuse/vueuse */ -export const VueUseComponentsResolver = (): ComponentResolver => (name: string) => { - if (!components) { - try { - /* eslint-disable @typescript-eslint/no-var-requires */ - const indexesJson = require('@vueuse/core/indexes.json') - components = indexesJson - .functions - .filter((i: any) => i.component && i.name) - .map(({ name }: any) => name[0].toUpperCase() + name.slice(1)) +export function VueUseComponentsResolver(): ComponentResolver { + return (name: string) => { + if (!components) { + try { + /* eslint-disable @typescript-eslint/no-var-requires */ + const indexesJson = require('@vueuse/core/indexes.json') + components = indexesJson + .functions + .filter((i: any) => i.component && i.name) + .map(({ name }: any) => name[0].toUpperCase() + name.slice(1)) + } + catch (error) { + components = [] + } } - catch (error) { - components = [] - } - } - if (components && components.includes(name)) - return { importName: name, path: '@vueuse/components' } + if (components && components.includes(name)) + return { importName: name, path: '@vueuse/components' } + } } diff --git a/src/types.ts b/src/types.ts index 7a6fba99..7c19f953 100644 --- a/src/types.ts +++ b/src/types.ts @@ -6,7 +6,7 @@ export interface ImportInfo { path: string } -export type SideEffectsInfo = (ImportInfo | string)[] | ImportInfo | string +export type SideEffectsInfo = (ImportInfo | string)[] | ImportInfo | string | undefined export interface ComponentInfo extends ImportInfo { sideEffects?: SideEffectsInfo