JElement-biz

基于 @jdcloud/jelement-next 封装的京东云业务组件库。文档地址

Install

Using npm:

# Requried @jdcloud/jelement-next lib
# npm i @jdcloud/jelement-next --save
npm install @jdcloud/jelement-biz --save

Using a script tag for global use:

<!-- import CSS -->
<link rel="stylesheet" href="//xxx.xxx.com/dist/theme-default/index.css">
<!-- import JavaScript -->
<script type="text/javascript" src="//xxx.xxx.com/dist/jelement-biz.min.js"></script>

Usage

Fully import

In main.js:

import Vue from "vue";
import JElementBiz from "@jdcloud/jelement-biz";
import "@jdcloud/jelement-biz/dist/theme-default/index.css";
import App from "./App.vue";

Vue.use(JElementBiz);

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

On demand

With the help of babel-plugin-component, we can import components we actually need, making the project smaller than otherwise.

First, install babel-plugin-component:

npm install babel-plugin-component --save-dev

Then edit .babelrc/babel.config.js:

{
  "presets": [
    // other config
  ],
  "plugins": [
    [
      "component",
      {
        "libraryName": "@jdcloud/jelement-biz",
        "libDir": "dist",
        "styleLibrary": {
          "name": "theme-default",
          "base": false
        }
      }
    ]
  ]
}

Next, if you need Text and other component, edit main.js:

import Vue from "vue";
import { Text } from "@jdcloud/jelement-biz";
import App from "./App.vue";

Vue.component(Text.name, Text);
/* or
 * Vue.use(Text)
 */

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

Features

• [x] Support on-demand loading
• [x] I18n
• [x] Add CLI to support rapid development
• [x] Example docs with vuepress
• [x] Unit Test
• [x] CSS dynamic separation