sc-common-vue

sc-common-vue 文档

Install

npm i sc-common-vue -S

Usage(全局)

import Vue from 'vue';
import CommonVue from 'sc-common-vue';
 
// 初始化
const Common = CommonVue({
    handleRequestError: () => {},
    selectUrl: '/example/common/getSelectBykeys',
    setSelectUrlPrefix: () => {}
});
 
// 注册组件
Vue.use(Common.Components);
 
// 全局Filters注册
Vue.use(Common.Filters);
 
// 全局Directives注册
Vue.use(Common.Directives);
 

Usage(按需引用)

import Vue from 'vue';
import { KlText, Filters, Directives } from 'sc-common-vue';
 
// 初始化
 
// 注册组件
Vue.use(KlText)
 
// 全局Filters注册
Vue.use(Filters)
 
// 全局Directives注册
Vue.use(Directives);
 

// mixins在页面级使用
import { listMixin as list } from 'sc-common-vue';
 
export default {
    //...
    mixins: [list],
    //...
}
 

// common/index.js
import select from '../../../sc-common-vue/lib/selectMixin'
import authProvider from '../../../sc-common-vue/lib/authProvider'
import request from '../../../sc-common-vue/lib/requestUtil'
 
import Vue from 'vue'
 
// 初始化SelectMixin
let selectUrl = '/example/common/getSelectBykeys'
let setSelectUrlPrefix = () => {
    console.log(11111)
}
const SelectMixin = select(selectUrl, setSelectUrlPrefix)
 
// 初始化AuthProviderMixin
let authUrl = '/example/common/authUrl'
let transferAuthResult = () => {}
const AuthProviderMixin = authProvider(authUrl, transferAuthResult)
 
// 初始化request
let handleRequestError = () => {}
const RequestUtil = request(handleRequestError)
 
Vue.use(Filters)
 
// Vue.use(klText)
Vue.use(KlText)
 
export {
    SelectMixin,
    AuthProviderMixin,
    RequestUtil
}

本地开发

$ yarn
$ npm run dev

组件开发

• src/components下开发组件（前缀Kl,前缀Kl,前缀Kl,重要的事情说3便），开发完成在组件文件夹下添加index.js。并且在根目录下的components.json中添加路径，用于组件单独打包

import KlExample from './index.vue';
 
KlExample.install = function(Vue) {
    Vue.component(KlExample.name, KlExample);
};
 
export default KlExample;

• 然后在src/components/index.js中注册，
• 预览效果 在examples/views文件夹下写预览demo，并在examples/routes.js中注册路由

打包

$ npm run build

文档编写

文档地址（http://seven-kl.netease.com/docs/20325/）

在开发文档前需要执行npm run build打包代码，然后执行

$ yarn
$ npm run docs:dev

进行编写