Registry / web-framework / yuang-framework-ui-pc

yuang-framework-ui-pc

JSON →
library1.1.141jsnpmunverified

yuang-framework-ui-pc, also known as EleAdminPlus, is a UI component library designed specifically for building administrative interfaces using Vue 3 and Element Plus. Currently at version 1.1.141, it appears to be under active development with a rapid patch release cycle, as indicated by its high patch number. The library aims to streamline the development of enterprise admin dashboards by providing a set of opinionated components, layouts, and utilities that extend the base functionality of Element Plus. This approach differentiates it by offering a more integrated and ready-to-use solution compared to starting solely with raw Element Plus components. It establishes strict peer dependencies, requiring Vue >= 3.1.0 and Element Plus >= 2.7.0, ensuring compatibility with specific versions of its foundational frameworks. Its focus is on providing a comprehensive framework-level solution for common admin UI patterns.

npm install yuang-framework-ui-pc
INSTALL
IMPORT
SIG · YUANG-FRAMEWORK-UI
Y
yuang-framework-ui-pc
web-frameworkjavascriptv1.1.141
Install
Import
Disk
Pass rate
0/ 6
Env Coverage0 / 6
glibc
1822
musl
1822
Install & Compatibility
Where this runs
tested against v? · npm install
Install × environment matrix
Each cell = how many times install + import succeeded across repeated harness runs. Partial = flaky.
glibc = Debian/Ubuntu slim · musl = Alpine Linux
musl
node 18226 runs
build_error
glibc
node 18226 runs
build_error
Code
Verified usage

Verified import paths — ran on the pinned version, not inferred.

EleAdminPlus
import EleAdminPlus from 'yuang-framework-ui-pc';
import { EleAdminPlus } from 'yuang-framework-ui-pc'
This is likely the default export for global plugin installation in a Vue application, registering all components and directives. Do not use named import.
EleAlert
import { EleAlert } from 'yuang-framework-ui-pc';
import EleAlert from 'yuang-framework-ui-pc/components/EleAlert'
For tree-shaking and on-demand imports, specific components are typically exposed as named exports. Avoid direct path imports.
EleAlertInstance
import type { EleAlertInstance } from 'yuang-framework-ui-pc';
Importing TypeScript types for component instances or props to ensure type safety, especially when defining component options or using ref.
EleAdminPlus
const EleAdminPlus = require('yuang-framework-ui-pc').default;
const { EleAdminPlus } = require('yuang-framework-ui-pc')
While primarily designed for ESM, if CommonJS is strictly required, the global plugin can be accessed via the default property of the `require` call.

Demonstrates the global installation of the EleAdminPlus plugin and basic usage of its components alongside Element Plus in a Vue 3 application.

import { createApp } from 'vue'; import App from './App.vue'; import ElementPlus from 'element-plus'; import 'element-plus/dist/index.css'; import EleAdminPlus from 'yuang-framework-ui-pc'; import 'yuang-framework-ui-pc/dist/index.css'; // Assuming the library ships its own CSS const app = createApp(App); // Globally install Element Plus and EleAdminPlus app.use(ElementPlus); app.use(EleAdminPlus); app.mount('#app'); /* -- App.vue (Example Usage) -- */ /* <template> <div id="app"> <h1>Welcome to EleAdminPlus App</h1> <el-button type="primary">Element Plus Button</el-button> <EleAlert title="Hello from EleAdminPlus" description="This is a custom alert component." type="success" /> <el-alert title="Standard Element Plus Alert" type="info" show-icon /> </div> </template> <script lang="ts"> import { defineComponent } from 'vue'; // When EleAdminPlus is globally installed via app.use(), its components are available directly in templates. // Explicit imports are generally not needed in <script setup> or defineComponent's components option // unless you need specific types or want to override global registration. export default defineComponent({ name: 'App', // components: { EleAlert } // Only needed if NOT globally installed or for specific local registration }); </script> <style> #app { font-family: Avenir, Helvetica, Arial, sans-serif; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; text-align: center; color: #2c3e50; margin-top: 60px; } </style> */
Debug
Known issues
gotchaNode.js v18 and older versions are not supported for development and build processes with this library, explicitly leading to build failures. Node.js v20 or newer is a prerequisite.
fix
Upgrade your Node.js environment to version 20 or higher (e.g., using `nvm install 20 && nvm use 20`).
affects: all
gotchaInstallation via `npm install` may encounter `E404` errors or slow downloads when using the default npm registry. The project explicitly recommends using `registry.npmmirror.com` for reliable installation.
fix
Configure your npm registry to `https://registry.npmmirror.com` before installing: `npm config set registry https://registry.npmmirror.com`.
affects: all
breakingThis library has strong peer dependencies on `element-plus` and `vue`. Major version updates of these core frameworks (e.g., `element-plus` 2.x to 3.x, or `vue` 3.x to 4.x) are highly likely to introduce breaking changes requiring corresponding updates or adaptations within `yuang-framework-ui-pc`.
fix
Always consult the release notes and migration guides for both `element-plus` and `vue` before upgrading. Update `yuang-framework-ui-pc` to a version explicitly compatible with the new peer dependency versions.
affects: >=1.0.0
Errors
Common errors & fixes
Error: Node Sass does not yet support your current environment: OS X 64-bit with Node.js 18.x
Using an unsupported Node.js version (e.g., v18 or older) that is incompatible with the library's underlying build tools or dependencies like `node-sass`.
fix
Upgrade Node.js to v20 or newer: `nvm install 20 && nvm use 20` (or similar for your environment).
npm ERR! code E404 npm ERR! 404 Not Found - GET https://registry.npmjs.org/yuang-framework-ui-pc
The package or one of its transitive dependencies could not be found on the default npm registry, often due to network issues or package availability in certain regions.
fix
Switch to the recommended registry before retrying installation: `npm config set registry https://registry.npmmirror.com && npm install`.
TypeError: app.use is not a function
Attempting to call `use()` on an object that is not a Vue 3 application instance (returned by `createApp`), or calling it in a non-Vue 3 context.
fix
Ensure your entry file correctly initializes a Vue 3 application with `createApp(App)` and that `app.use()` is called on the resulting `app` instance.
Upgrade
Version history
1.1.141latest on npm
Audit
Dependencies
element-plusrequiredCore UI component library it builds upon, providing fundamental components and styling.
vuerequiredThe JavaScript framework the library is built for and integrates with.
Agent activity
25 hits · last 30 days
node
22
OpenAI (training)
1
Resources
yuang-framework-ui-pc — npm install yuang-framework-ui-pc · libregistry