JSPM

  • ESM via JSPM
  • ES Module Entrypoint
  • Export Map
  • Keywords
  • License
  • Repository URL
  • TypeScript Types
  • README
  • Created
  • Published
  • Downloads 1
  • Score
    100M100P100Q21348F
  • License MIT

A magical vue admin. An out-of-box UI solution for enterprise applications. Newest development stack of vue. Lots of awesome features

Package Exports

  • @yuechan/element-design
  • @yuechan/element-design/lib/elmDesign.min.css

Readme

element-design-plus

简介

基于 vue3 + ts + element-plus 的代码进行封装，将频繁使用的组件抽离，使用简单的代码完成复杂的业务场景。

vue3: @yuechan/element-design@2.x.x

vue2: @yuechan/element-design@1.x.x

安装

npm i @yuechan/element-design@vue3

使用

在mian.js中配置增加下列配置

import ElementPlus from 'element-plus'
import 'element-plus/dist/index.css'
import '@yuechan/element-design/lib/elmDesign.min/css'

let app = createApp(App)
app
  .use(elmDesign, {
    notRegistryGlobal: true, //是否全局注册组件
    useStore, //默认使用pinia
    router, //路由
    i18n //国际化
  })
  .mount('#app')

下面添加国际化相关配置，由于不同项目国际化配置位置不同，下面贴出常用配置

import { createI18n } from 'vue-i18n'
import enLocale from './en'
import zhLocale from './zh'
import elementEnLocale from 'element-plus/es/locale/lang/en' // element-ui lang
import elementZhLocale from 'element-plus/es/locale/lang/zh-CN'// element-ui lang
import enEmLocale from '../../src/locale/lang/en'
import zhEmLocale from '../../src/locale/lang/zh'

const messages = {
  en: {
    ...enLocale, ...elementEnLocale, ...enEmLocale
  },
  'zh-cn': {
    ...zhLocale, ...elementZhLocale, ...zhEmLocale
  }
}

const i18n = createI18n({
    allowComposition: true,
    globalInjection: true,
    legacy: false,
    locale: JSON.parse(sessionStorage.getItem('main') as string)?.lang || 'zh-cn',
    messages
})

export default i18n

组件