feat: add skiyee/ui resolver #20
Conversation
WalkthroughIntroduces a new Vue component resolver module that maps component names with specific prefixes/patterns to kebab-case paths under @skiyee/uni-ui/components/{name}.vue, returning undefined for non-matching names. Exports a default function returning a ComponentResolver. Changes
Sequence Diagram(s)sequenceDiagram
autonumber
participant App as App (Auto-import)
participant Resolver as SkResolver
participant Registry as ComponentRegistry
participant FS as @skiyee/uni-ui/components
App->>Resolver: resolve(componentName)
alt name matches /^((Sk[A-Z].*)|(sk-[a-z].*))$/
Resolver->>Resolver: convert to kebab-case
Resolver->>Registry: return path "@skiyee/uni-ui/components/{kebab}.vue"
Registry->>FS: load {kebab}.vue
FS-->>Registry: component module
Registry-->>App: component resolved
else no match
Resolver-->>App: undefined
end
Estimated code review effort🎯 2 (Simple) | ⏱️ ~10 minutes Poem
Pre-merge checks and finishing touches❌ Failed checks (1 warning)
✅ Passed checks (2 passed)
✨ Finishing touches
🧪 Generate unit tests
Tip 👮 Agentic pre-merge checks are now available in preview!Pro plan users can now enable pre-merge checks in their settings to enforce checklists before merging PRs.
Please see the documentation for more information. Example: reviews:
pre_merge_checks:
custom_checks:
- name: "Undocumented Breaking Changes"
mode: "warning"
instructions: |
Pass/fail criteria: All breaking changes to public APIs, CLI flags, environment variables, configuration keys, database schemas, or HTTP/GraphQL endpoints must be documented in the "Breaking Change" section of the PR description and in CHANGELOG.md. Exclude purely internal or private changes (e.g., code not exported from package entry points or explicitly marked as internal).Please share your feedback with us on this Discord post. Thanks for using CodeRabbit! It's free for OSS, and your support helps us grow. If you like it, consider giving us a shout-out. Comment |
![coderabbitai[bot]](https://avatars.githubusercontent.com/in/347564?s=60&v=4){kind=small}
There was a problem hiding this comment.
Actionable comments posted: 1
🧹 Nitpick comments (3)
packages/core/src/_resolvers/skiyee-ui.ts (3)
8-16: Tighten the match and simplify control flow.Use an anchored regex with
test()and early return; cover digits/hyphens and avoid partial-prefix matches.- if (name.match(/^(?:Sk[A-Z]|sk-[a-z])/)) { - let kebabCaseName: string = kebabCase(name) + if (!/^(?:Sk[A-Z][A-Za-z0-9]*|sk-[a-z][a-z0-9-]*)$/.test(name)) return + const kebabCaseName = kebabCase(name) - return { - name, - from: `@skiyee/uni-ui/components/${kebabCaseName}.vue` - } - } + return { + name, + from: `@skiyee/uni-ui/components/${kebabCaseName}.vue` + }
9-9: Prefer const over let for immutables.
kebabCaseNamenever changes.- let kebabCaseName: string = kebabCase(name) + const kebabCaseName = kebabCase(name)
4-4: Name the resolver explicitly for clarity.Consider
SkiyeeUiResolverto match other resolver naming conventions.-export default function SkResolver(): ComponentResolver { +export default function SkiyeeUiResolver(): ComponentResolver {
📜 Review details
Configuration used: CodeRabbit UI
Review profile: CHILL
Plan: Pro
📒 Files selected for processing (1)
packages/core/src/_resolvers/skiyee-ui.ts(1 hunks)
🧰 Additional context used
🧬 Code graph analysis (1)
packages/core/src/_resolvers/skiyee-ui.ts (1)
packages/core/src/types.ts (1)
ComponentResolver(41-41)
🔇 Additional comments (1)
packages/core/src/_resolvers/skiyee-ui.ts (1)
11-14: Confirm @skiyee/uni-ui import paths or delegate to official resolver
Hard-coding@skiyee/uni-ui/components/${kebabCaseName}.vuemay not match the actual published file layout. Verify the real component paths in@skiyee/uni-ui(or its GitHub repo) or re-export/delegate to@skiyee/ui-resolverto keep up-to-date.
| return { | ||
| name, | ||
| from: `@skiyee/uni-ui/components/${kebabCaseName}.vue` | ||
| } |
There was a problem hiding this comment.
🧩 Analysis chain
Consider style side-effects if the library expects per-component CSS.
If components ship styles separately, expose sideEffects to auto-import them (pattern depends on the lib).
🌐 Web query:
Check the skiyee/ui docs for per-component style import paths and whether styles are auto-included or require manual import.
💡 Result:
Short answer: The skiyee UI packages do not appear to auto-inject all component CSS by default — you must import styles yourself (either a global CSS entry or use a helper/resolver). The project has packages for styling and automation: @skiyee/ui-preset (UnoCSS preset) and an @skiyee/ui-resolver (component auto-import resolver) which indicate on-demand/automatic wiring is available via those tools, but core docs/npm README show manual import of the library CSS (e.g. import the package CSS from dist or include a global stylesheet). [1][2][3]
References
- ski-ui / ski (README showing explicit global CSS import instructions). [1]
- npm listing for ski-ui (same global-style import examples). [2]
- @skiyee/ui-resolver and @skiyee/ui-preset package pages (resolver/preset to enable auto-import / UnoCSS-driven styling). [3][4]
Expose per-component CSS via sideEffects in the skiyee resolver.
skiyee UI doesn't auto-inject component CSS; update packages/core/src/_resolvers/skiyee-ui.ts (the resolver return) to include a sideEffects entry that imports the library's per-component style path (or ensure the global/dist stylesheet is imported via the preset/resolver).
🤖 Prompt for AI Agents
In packages/core/src/_resolvers/skiyee-ui.ts around lines 11 to 14, the resolver
return only exposes name and from and does not mark per-component CSS as side
effects; update the returned object to include a sideEffects entry that imports
the component's stylesheet (for example add sideEffects:
[`@skiyee/uni-ui/components/${kebabCaseName}.css`] or the correct library
per-component style path), or alternatively ensure the resolver/preset imports
the library global/dist stylesheet; make the sideEffects value an array so
bundlers include the CSS when the component is used.
1 participant
Description 描述
新增 skiyee/ui 组件的resolver
Linked Issues 关联的 Issues
Additional context 额外上下文
Summary by CodeRabbit