mirror of
https://github.com/ecomfe/vue-echarts.git
synced 2025-08-14 19:23:28 +08:00
feat: use custom element, update vue-demi
This commit is contained in:
10
README.md
10
README.md
@ -283,11 +283,10 @@ Drop `<script>` inside your HTML file and access the component via `window.VueEC
|
||||
<!-- vue3Scripts:start -->
|
||||
```html
|
||||
<script src="https://cdn.jsdelivr.net/npm/vue@3.0.5"></script>
|
||||
<script src="https://cdn.jsdelivr.net/npm/vue-demi@0.6.1"></script>
|
||||
<script src="https://cdn.jsdelivr.net/npm/vue-demi@0.7.0"></script>
|
||||
<script src="https://cdn.jsdelivr.net/npm/echarts@5.0.2"></script>
|
||||
<script src="https://cdn.jsdelivr.net/npm/vue-echarts@6.0.0-alpha.5"></script>
|
||||
<script src="https://cdn.jsdelivr.net/npm/vue-echarts@6.0.0-beta.1"></script>
|
||||
```
|
||||
|
||||
<!-- vue3Scripts:end -->
|
||||
|
||||
```js
|
||||
@ -308,11 +307,10 @@ app.component('v-chart', VueECharts)
|
||||
```html
|
||||
<script src="https://cdn.jsdelivr.net/npm/vue@2.6.12"></script>
|
||||
<script src="https://cdn.jsdelivr.net/npm/@vue/composition-api@1.0.0-rc.2"></script>
|
||||
<script src="https://cdn.jsdelivr.net/npm/vue-demi@0.6.1"></script>
|
||||
<script src="https://cdn.jsdelivr.net/npm/vue-demi@0.7.0"></script>
|
||||
<script src="https://cdn.jsdelivr.net/npm/echarts@5.0.2"></script>
|
||||
<script src="https://cdn.jsdelivr.net/npm/vue-echarts@6.0.0-alpha.5"></script>
|
||||
<script src="https://cdn.jsdelivr.net/npm/vue-echarts@6.0.0-beta.1"></script>
|
||||
```
|
||||
|
||||
<!-- vue2Scripts:end -->
|
||||
|
||||
```js
|
||||
|
@ -281,11 +281,10 @@ export default {
|
||||
<!-- vue3Scripts:start -->
|
||||
```html
|
||||
<script src="https://cdn.jsdelivr.net/npm/vue@3.0.5"></script>
|
||||
<script src="https://cdn.jsdelivr.net/npm/vue-demi@0.6.1"></script>
|
||||
<script src="https://cdn.jsdelivr.net/npm/vue-demi@0.7.0"></script>
|
||||
<script src="https://cdn.jsdelivr.net/npm/echarts@5.0.2"></script>
|
||||
<script src="https://cdn.jsdelivr.net/npm/vue-echarts@6.0.0-alpha.5"></script>
|
||||
<script src="https://cdn.jsdelivr.net/npm/vue-echarts@6.0.0-beta.1"></script>
|
||||
```
|
||||
|
||||
<!-- vue3Scripts:end -->
|
||||
|
||||
```js
|
||||
@ -306,11 +305,10 @@ app.component('v-chart', VueECharts)
|
||||
```html
|
||||
<script src="https://cdn.jsdelivr.net/npm/vue@2.6.12"></script>
|
||||
<script src="https://cdn.jsdelivr.net/npm/@vue/composition-api@1.0.0-rc.2"></script>
|
||||
<script src="https://cdn.jsdelivr.net/npm/vue-demi@0.6.1"></script>
|
||||
<script src="https://cdn.jsdelivr.net/npm/vue-demi@0.7.0"></script>
|
||||
<script src="https://cdn.jsdelivr.net/npm/echarts@5.0.2"></script>
|
||||
<script src="https://cdn.jsdelivr.net/npm/vue-echarts@6.0.0-alpha.5"></script>
|
||||
<script src="https://cdn.jsdelivr.net/npm/vue-echarts@6.0.0-beta.1"></script>
|
||||
```
|
||||
|
||||
<!-- vue2Scripts:end -->
|
||||
|
||||
```js
|
||||
|
1004
package-lock.json
generated
1004
package-lock.json
generated
File diff suppressed because it is too large
Load Diff
@ -1,7 +1,10 @@
|
||||
{
|
||||
"name": "vue-echarts",
|
||||
"description": "Vue.js component for Apache ECharts.",
|
||||
"version": "6.0.0-alpha.5",
|
||||
"version": "6.0.0-beta.1",
|
||||
"repository": "https://github.com/ecomfe/vue-echarts.git",
|
||||
"license": "MIT",
|
||||
"author": "GU Yiling <justice360@gmail.com>",
|
||||
"scripts": {
|
||||
"serve": "vue-cli-service serve",
|
||||
"build:demo": "vue-cli-service build",
|
||||
@ -20,7 +23,7 @@
|
||||
],
|
||||
"dependencies": {
|
||||
"resize-detector": "^0.3.0",
|
||||
"vue-demi": "^0.6.1"
|
||||
"vue-demi": "^0.7.0"
|
||||
},
|
||||
"devDependencies": {
|
||||
"@rollup/plugin-node-resolve": "^11.1.1",
|
||||
@ -57,7 +60,7 @@
|
||||
"peerDependencies": {
|
||||
"@vue/composition-api": "^1.0.0-rc.2",
|
||||
"echarts": "^5.0.2",
|
||||
"vue": "^2.6.11 || ^3.0.0"
|
||||
"vue": "^2.6.12 || ^3.0.0"
|
||||
},
|
||||
"peerDependenciesMeta": {
|
||||
"@vue/composition-api": {
|
||||
|
@ -10,7 +10,7 @@ const CDN_PREFIX = "https://cdn.jsdelivr.net/npm/";
|
||||
const DEP_VERSIONS = {
|
||||
"vue@3": "3.0.5",
|
||||
"vue@2": "2.6.12",
|
||||
"vue-demi": "0.6.1",
|
||||
"vue-demi": "0.7.0",
|
||||
"@vue/composition-api": "1.0.0-rc.2",
|
||||
echarts: "5.0.2",
|
||||
[name]: version
|
||||
@ -23,7 +23,7 @@ function getScriptsMd(deps) {
|
||||
return `<script src="${CDN_PREFIX}${name}@${DEP_VERSIONS[dep]}"></script>`;
|
||||
})
|
||||
.join("\n");
|
||||
return "```html\n" + code + "\n```\n";
|
||||
return "```html\n" + code + "\n```";
|
||||
}
|
||||
|
||||
const README_FILES = ["README.md", "README.zh-Hans.md"].map(name =>
|
||||
|
@ -13,7 +13,8 @@ import {
|
||||
onUnmounted,
|
||||
h,
|
||||
PropType,
|
||||
watchEffect
|
||||
watchEffect,
|
||||
Vue2
|
||||
} from "vue-demi";
|
||||
import { init as initChart } from "echarts/core";
|
||||
import {
|
||||
@ -35,6 +36,12 @@ import {
|
||||
} from "./composables";
|
||||
import "./style.css";
|
||||
|
||||
const TAG_NAME = "x-vue-echarts";
|
||||
|
||||
if (Vue2) {
|
||||
Vue2.config.ignoredElements.push(TAG_NAME);
|
||||
}
|
||||
|
||||
export const THEME_KEY = "ecTheme";
|
||||
export const INIT_OPTIONS_KEY = "ecInitOptions";
|
||||
export const UPDATE_OPTIONS_KEY = "ecUpdateOptions";
|
||||
@ -229,6 +236,6 @@ export default defineComponent({
|
||||
return exposed;
|
||||
},
|
||||
render() {
|
||||
return h("div", { class: "echarts", ref: "root" });
|
||||
return h(TAG_NAME, { class: "echarts", ref: "root" });
|
||||
}
|
||||
});
|
||||
|
@ -1 +1 @@
|
||||
.echarts{width:100%;height:100%}
|
||||
x-vue-echarts{display:block;width:100%;height:100%}
|
Reference in New Issue
Block a user