fit2cloud ui

Fit2cloud UI

FIT2Cloud UI adalah perpustakaan komponen VUE berdasarkan pengembangan sekunder UI elemen, menyediakan komponen, filter, instruksi, dll. Yang biasa digunakan dalam pengembangan perangkat lunak perusahaan.

Memasang

npm install fit2cloud-ui

Elemen UI harus diinstal saat menggunakannya

npm install element-ui

Karena Anda perlu menggunakan SCSS, Anda perlu menginstal Sass

npm install -D [email protected] [email protected]

Pendahuluan Lengkap

 import Vue from 'vue' ;
import ElementUI from 'element-ui'
import Fit2CloudUI from 'fit2cloud-ui' ;
import "fit2cloud-ui/src/styles/index.scss" ; // 已经包含了element ui的scss
import App from './App.vue' ;

Vue . use ( ElementUI ) ;
Vue . use ( Fit2CloudUI ) ;

new Vue ( {
  el : '#app' ,
  render : h => h ( App )
} ) ;

Memperkenalkan permintaan

Dengan Babel-Plugin-Import, kami hanya dapat memperkenalkan komponen yang diperlukan untuk mencapai tujuan mengurangi ukuran proyek.

Pertama, pasang komponen babel-plugin:

npm install babel-plugin-import -D

Kemudian, tulis yang berikut di Babel.config.js:

 module . exports = {
  presets : [
    '@vue/cli-plugin-babel/preset'
  ] ,
  plugins : [
    [
      "import" ,
      {
        "libraryName" : "fit2cloud-ui" ,
        "customStyleName" : ( name ) => {
          return `fit2cloud-ui/src/styles/components/ ${ name } .scss` ;
        } ,
      } ,
    ] ,
  ]
}

Selanjutnya, beberapa komponen dapat diperkenalkan, seperti SearchBar dan Table, sehingga konten berikut perlu ditulis di Main.js:

 import Vue from 'vue' ;
import ElementUI from 'element-ui'
import 'fit2cloud-ui/src/styles/require.scss' ; // 已经包含了element ui的scss
import { SearchBar , Table } from 'fit2cloud-ui' ;
import App from './App.vue' ;

Vue . use ( ElementUI ) ;
Vue . use ( SearchBar ) ;
Vue . use ( Table ) ;

new Vue ( {
  el : '#app' ,
  render : h => h ( App )
} ) ;

Internasionalisasi

Menggunakan VUE-I18N

 import Vue from 'vue' ;
import Fit2CloudUI from 'fit2cloud-ui' ;
import "fit2cloud-ui/src/styles/index.scss" ; // 已经包含了element ui的scss
import zhCN from "fit2cloud-ui/src/locale/lang/zh-CN" ;
import App from './App.vue' ;

const message = {
  'zh-CN' : {
    hello : '你好' ,
    ... zhCN
  }
}

const i18n = new VueI18n ( {
  locale : 'zh-CN' ,
  messages ,
} ) ;

Vue . use ( Fit2CloudUI , {
  i18n : ( key , value ) => i18n . t ( key , value )
} ) ;

new Vue ( {
  el : '#app' ,
  i18n ,
  render : h => h ( App )
} ) ;

Dokumentasi Komponen

Alamat dokumen: https://fit2cloud-ui.github.io/docs/

Ucapan Terima Kasih

• Elemen terima kasih untuk elemen untuk pustaka komponen yang sangat baik

Lisensi & Hak Cipta

Hak Cipta (C) 2014-2024 Feizhiyun Fit2Cloud, semua hak dilindungi undang-undang.

Berlisensi di bawah GNU Umum Lisensi Publik Versi 3 (GPLV3) ("Lisensi"); Anda tidak boleh menggunakan file ini kecuali sesuai dengan lisensi. Anda dapat memperoleh salinan lisensi di

https://www.gnu.org/licenses/gpl-3.0.html

Kecuali diharuskan oleh hukum yang berlaku atau disepakati secara tertulis, perangkat lunak yang didistribusikan di bawah lisensi didistribusikan berdasarkan "sebagaimana adanya", tanpa jaminan atau ketentuan dalam bentuk apa pun, baik tersurat maupun tersirat. Lihat lisensi untuk bahasa spesifik yang mengatur izin dan batasan di bawah lisensi.