MyUI是美亞柏科旗下新德匯出品的Web前端項(xiàng)目工程框架。基于 Vue + ElementUI ，專(zhuān)注于中臺(tái)系統(tǒng)快速搭建，框架已在多個(gè)項(xiàng)目實(shí)戰(zhàn)檢驗(yàn)。

特色搭載代碼生成器，可生成底層api調(diào)用、vuex管理、模擬數(shù)據(jù)代碼；

內(nèi)置常用超過(guò)150個(gè)基礎(chǔ)UI組件；

集成圖表庫(kù)、地圖應(yīng)用類(lèi)庫(kù)；

支持子前端微服務(wù)子應(yīng)用，可獨(dú)立開(kāi)發(fā)、運(yùn)行、部署；

自動(dòng)生成路由；

組件自動(dòng)注冊(cè)及按需加載；

支持自定義主題，可以實(shí)現(xiàn)在線(xiàn)切換；

支持靜態(tài)配置。

安裝

推薦使用 npm 的方式安裝，它能更好地和 webpack 打包工具配合使用。npm i @xdh/my --save

快速上手

可通過(guò)以下兩種使用 My

一、用項(xiàng)目工程模板創(chuàng)建項(xiàng)目

官網(wǎng)提供的基于Vue項(xiàng)目的一站式解決方案。git clone https://gitee.com/newgateway/my-web.git

只需把工程模板項(xiàng)目獲取下來(lái)就可以使用，包括全部功能，開(kāi)箱即用。

二、調(diào)用組件庫(kù)功能

如只需用到 My 其中的某些組件，可以在已有的項(xiàng)目工程中安裝，并完成配置。步驟：

1.安裝組件庫(kù)和相關(guān)插件

安裝組件npm i element-ui @xdh/my --save

安裝項(xiàng)目依賴(lài)插件npm i babel-plugin-component node-sass sass-loader --save-dev

2、配置 babel.config.js

組件采用了按需加載，需要 在babel.config.js 加上插件，如：module.exports = {

presets: [

'@vue/cli-plugin-babel/preset'

],

plugins: [

...require('@xdh/my/core/babel.plugins')

]

}

3、配置 vue.config.js

需要在vue.config.js加上別名，如：module.exports = {

transpileDependencies: ['@xdh/my'],

chainWebpack(chain) {

chain.resolve.alias.set('$ui', '@xdh/my/ui/lib')

}

}

4、引用組件

到此，你可以開(kāi)始引入組件開(kāi)始編碼了，如：

Button

Content

import {Button} from 'element-ui'

import {MyPanel} from '$ui'

export default {

components: {

Button,

MyPanel

}

}

三、演示截圖

結(jié)尾本期就分享到這里，我是小編南風(fēng)吹，專(zhuān)注分享好玩有趣、新奇、實(shí)用的開(kāi)源項(xiàng)目及開(kāi)發(fā)者工具、學(xué)習(xí)資源！

希望能與大家共同學(xué)習(xí)交流,歡迎關(guān)注我的公眾號(hào)【Github導(dǎo)航站】。

往期推薦

總結(jié)

以上是生活随笔為你收集整理的vue2.0桌面端框架_这款优秀的Vue+ElementUI桌面端一站式框架,爱了！的全部?jī)?nèi)容，希望文章能夠幫你解決所遇到的問(wèn)題。

如果覺(jué)得生活随笔網(wǎng)站內(nèi)容還不錯(cuò)，歡迎將生活随笔推薦給好友。