Skip to content

feat(resolver): add resolver for layui-vue #366

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Merged
merged 2 commits into from
Apr 27, 2022
Merged
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
1 change: 1 addition & 0 deletions src/core/resolvers/index.ts
Original file line number Diff line number Diff line change
Expand Up @@ -16,3 +16,4 @@ export * from './quasar'
export * from './devui'
export * from './arco'
export * from './tdesign'
export * from './layui-vue'
171 changes: 171 additions & 0 deletions src/core/resolvers/layui-vue.ts
Original file line number Diff line number Diff line change
@@ -0,0 +1,171 @@
import type { ComponentInfo, ComponentResolver, SideEffectsInfo } from '../../types'
import { camelCase } from '../utils'

const matchComponents = [
{
pattern: /^LayAvatarList$/,
styleDir: 'avatar',
},
{
pattern: /^LayBreadcrumbItem$/,
styleDir: 'breadcrumb',
},
{
pattern: /^(LayCarouselItem)$/,
styleDir: 'carousel',
},
{
pattern: /^(LayCheckboxGroup)$/,
styleDir: 'checkbox',
},
{
pattern: /^LayCol$/,
styleDir: 'row',
},
{
pattern: /^(LayCollapseItem)$/,
styleDir: 'collapse',
},
{
pattern: /^LayConfigProvider$/,
styleDir: undefined,
},
{
pattern: /^LayCountUp$/,
styleDir: undefined,
},
{
pattern: /^(LayDropdownMenu|LayDropdownMenuItem)$/,
styleDir: 'dropdown',
},
{
pattern: /^(LayFormItem)$/,
styleDir: 'form',
},
{
pattern: /^(LayMenuItem|LaySubMenu)$/,
styleDir: 'menu',
},
{
pattern: /^LaySelectOption$/,
styleDir: 'select',
},
{
pattern: /^LaySkeletonItem$/,
styleDir: 'skeleton',
},
{
pattern: /^LaySplitPanelItem$/,
styleDir: 'splitPanel',
},
{
pattern: /^LayStepItem$/,
styleDir: 'step',
},
{
pattern: /^(LayTabItem)$/,
styleDir: 'tab',
},
{
pattern: /^LayTimelineItem$/,
styleDir: 'timeline',
},
]

export interface LayuiVueResolverOptions {
/**
* import style along with components
*
* @default 'css'
*/
importStyle?: boolean | 'css'

/**
* resolve '@layui/layui-vue' icons
* requires package `@layui/icons-vue`
*
* @default false
*/
resolveIcons?: boolean

/**
* exclude components that do not require automatic import
*
*/
exclude?: Array<string | RegExp>
}

const layuiRE = /^Lay[A-Z]/
const layerRE = /^(layer|LayLayer)$/
const iconsRE = /^([A-Z][\w]+Icon|LayIcon)$/
let libName = '@layui/layui-vue'

function getSideEffects(importName: string, options: LayuiVueResolverOptions): SideEffectsInfo | undefined {
const { importStyle = 'css' } = options
if (!importStyle)
return undefined

if (libName !== '@layui/layui-vue')
return `${libName}/lib/index.css`

let styleDir: string | undefined = camelCase(importName.slice(3)) // LayBackTop -> backTop
for (const item of matchComponents) {
if (item.pattern.test(importName)) {
styleDir = item.styleDir
break
}
}
if (importStyle === 'css' || importStyle) {
return styleDir
? [`@layui/layui-vue/es/${styleDir}/index.css`, '@layui/layui-vue/es/index/index.css']
: undefined
}
}

function resolveComponent(importName: string, options: LayuiVueResolverOptions): ComponentInfo | undefined {
let name: string | undefined

if (options.exclude && isExclude(importName, options.exclude))
return undefined

if (options.resolveIcons && importName.match(iconsRE)) {
name = importName
libName = '@layui/icons-vue'
}
else if (importName.match(layerRE)) {
name = importName
libName = '@layui/layer-vue'
}
else if (importName.match(layuiRE)) {
name = importName
libName = '@layui/layui-vue'
}
return name
? { name, from: libName, sideEffects: getSideEffects(name, options) }
: undefined
}

function isExclude(name: string, exclude: Array<string | RegExp>): boolean {
for (const item of exclude) {
if (name === item || name.match(item))
return true
}
return false
}

/**
* Resolver for layui-vue
*
* @link http://www.layui-vue.com/ for layui-vue
*
*/
export function LayuiVueResolver(
options: LayuiVueResolverOptions = {},
): ComponentResolver {
return {
type: 'component',
resolve: (name: string) => {
return resolveComponent(name, options)
},
}
}
pFad - Phonifier reborn

Pfad - The Proxy pFad of © 2024 Garber Painting. All rights reserved.

Note: This service is not intended for secure transactions such as banking, social media, email, or purchasing. Use at your own risk. We assume no liability whatsoever for broken pages.


Alternative Proxies:

Alternative Proxy

pFad Proxy

pFad v3 Proxy

pFad v4 Proxy