diff --git a/.eslintrc.js b/.eslintrc.js deleted file mode 100644 index 8286197..0000000 --- a/.eslintrc.js +++ /dev/null @@ -1,25 +0,0 @@ -module.exports = { - root: true, - env: { - node: true - }, - extends: ["plugin:vue/vue3-essential", "eslint:recommended", "@vue/prettier"], - parserOptions: { - ecmaVersion: 2020, - parser: "@typescript-eslint/parser" - }, - rules: { - "no-console": process.env.NODE_ENV === "production" ? "warn" : "off", - "no-debugger": process.env.NODE_ENV === "production" ? "warn" : "off", - "vue/multi-word-component-names": "off" - }, - overrides: [ - { - files: ["*.ts"], - extends: [ - "@vue/typescript/recommended", - "@vue/prettier/@typescript-eslint" - ] - } - ] -}; diff --git a/.eslintrc.json b/.eslintrc.json new file mode 100644 index 0000000..5040304 --- /dev/null +++ b/.eslintrc.json @@ -0,0 +1,24 @@ +{ + "root": true, + "env": { + "node": true + }, + "extends": ["plugin:vue/vue3-essential", "eslint:recommended", "@vue/prettier"], + "parserOptions": { + "ecmaVersion": 2020, + "parser": "@typescript-eslint/parser" + }, + "rules": { + "no-console": "off", + "vue/multi-word-component-names": "off" + }, + "overrides": [ + { + "files": ["*.ts"], + "extends": [ + "@vue/typescript/recommended", + "@vue/prettier/@typescript-eslint" + ] + } + ] +} diff --git a/babel.config.js b/babel.config.js deleted file mode 100644 index 397abca..0000000 --- a/babel.config.js +++ /dev/null @@ -1,3 +0,0 @@ -module.exports = { - presets: ["@vue/cli-plugin-babel/preset"] -}; diff --git a/babel.config.json b/babel.config.json new file mode 100644 index 0000000..7895cad --- /dev/null +++ b/babel.config.json @@ -0,0 +1,3 @@ +{ + "presets": ["@vue/cli-plugin-babel/preset"] +} diff --git a/package.json b/package.json index 2e9a601..e9258f4 100644 --- a/package.json +++ b/package.json @@ -44,7 +44,7 @@ "@vueuse/core": "^10.5.0", "comment-mark": "^1.1.1", "core-js": "^3.33.2", - "echarts": "^5.4.3", + "echarts": "^5.5.0", "echarts-gl": "^2.0.9", "echarts-liquidfill": "^3.1.0", "esbuild-wasm": "^0.19.2", diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml index f15808e..92829e8 100644 --- a/pnpm-lock.yaml +++ b/pnpm-lock.yaml @@ -68,14 +68,14 @@ devDependencies: specifier: ^3.33.2 version: 3.33.2 echarts: - specifier: ^5.4.3 - version: 5.4.3 + specifier: ^5.5.0 + version: 5.5.0 echarts-gl: specifier: ^2.0.9 - version: 2.0.9(echarts@5.4.3) + version: 2.0.9(echarts@5.5.0) echarts-liquidfill: specifier: ^3.1.0 - version: 3.1.0(echarts@5.4.3) + version: 3.1.0(echarts@5.5.0) esbuild-wasm: specifier: ^0.19.2 version: 0.19.2 @@ -178,6 +178,16 @@ packages: chalk: 2.4.2 dev: true + /@babel/code-frame@7.23.5: + resolution: {integrity: sha512-CgH3s1a96LipHCmSUmYFPwY7MNx8C3avkq7i4Wl3cfa662ldtUe4VM1TPXX70pfmrlWTb6jLqTYrZyT2ZTJBgA==} + engines: {node: '>=6.9.0'} + requiresBuild: true + dependencies: + '@babel/highlight': 7.23.4 + chalk: 2.4.2 + dev: true + optional: true + /@babel/compat-data@7.23.2: resolution: {integrity: sha512-0S9TQMmDHlqAZ2ITT95irXKfxN9bncq8ZCoJhun3nHL/lLUxd2NKBJYoNGWH7S0hz6fRQwWlAWn/ILM0C70KZQ==} engines: {node: '>=6.9.0'} @@ -433,6 +443,17 @@ packages: js-tokens: 4.0.0 dev: true + /@babel/highlight@7.23.4: + resolution: {integrity: sha512-acGdbYSfp2WheJoJm/EBBBLh/ID8KDc64ISZ9DYtBmC8/Q204PZJLHyzeB5qMzJ5trcOkybd78M4x2KWsUq++A==} + engines: {node: '>=6.9.0'} + requiresBuild: true + dependencies: + '@babel/helper-validator-identifier': 7.22.20 + chalk: 2.4.2 + js-tokens: 4.0.0 + dev: true + optional: true + /@babel/parser@7.23.0: resolution: {integrity: sha512-vvPKKdMemU85V9WE/l5wZEmImpCtLqbnTvqDS2U1fJ96KrxoW7KrXhNsNCblQlg8Ck4b85yxdTyelsMUgFUXiw==} engines: {node: '>=6.0.0'} @@ -4333,29 +4354,29 @@ packages: engines: {node: '>=6.0.0'} dev: true - /echarts-gl@2.0.9(echarts@5.4.3): + /echarts-gl@2.0.9(echarts@5.5.0): resolution: {integrity: sha512-oKeMdkkkpJGWOzjgZUsF41DOh6cMsyrGGXimbjK2l6Xeq/dBQu4ShG2w2Dzrs/1bD27b2pLTGSaUzouY191gzA==} peerDependencies: echarts: ^5.1.2 dependencies: claygl: 1.3.0 - echarts: 5.4.3 + echarts: 5.5.0 zrender: 5.4.4 dev: true - /echarts-liquidfill@3.1.0(echarts@5.4.3): + /echarts-liquidfill@3.1.0(echarts@5.5.0): resolution: {integrity: sha512-5Dlqs/jTsdTUAsd+K5LPLLTgrbbNORUSBQyk8PSy1Mg2zgHDWm83FmvA4s0ooNepCJojFYRITTQ4GU1UUSKYLw==} peerDependencies: echarts: ^5.0.1 dependencies: - echarts: 5.4.3 + echarts: 5.5.0 dev: true - /echarts@5.4.3: - resolution: {integrity: sha512-mYKxLxhzy6zyTi/FaEbJMOZU1ULGEQHaeIeuMR5L+JnJTpz+YR03mnnpBhbR4+UYJAgiXgpyTVLffPAjOTLkZA==} + /echarts@5.5.0: + resolution: {integrity: sha512-rNYnNCzqDAPCr4m/fqyUFv7fD9qIsd50S6GDFgO1DxZhncCsNsG7IfUlAlvZe5oSEQxtsjnHiUuppzccry93Xw==} dependencies: tslib: 2.3.0 - zrender: 5.4.4 + zrender: 5.5.0 dev: true /ee-first@1.1.1: @@ -6989,7 +7010,7 @@ packages: rollup: 4.12.0 typescript: 4.6.4 optionalDependencies: - '@babel/code-frame': 7.22.13 + '@babel/code-frame': 7.23.5 dev: true /rollup-plugin-esbuild@6.1.1(esbuild@0.20.1)(rollup@4.12.0): @@ -8296,3 +8317,9 @@ packages: dependencies: tslib: 2.3.0 dev: true + + /zrender@5.5.0: + resolution: {integrity: sha512-O3MilSi/9mwoovx77m6ROZM7sXShR/O/JIanvzTwjN3FORfLSr81PsUGd7jlaYOeds9d8tw82oP44+3YucVo+w==} + dependencies: + tslib: 2.3.0 + dev: true diff --git a/rollup.config.js b/rollup.config.js index 32428ec..8f18209 100644 --- a/rollup.config.js +++ b/rollup.config.js @@ -2,6 +2,7 @@ import esbuild from "rollup-plugin-esbuild"; import { dts } from "rollup-plugin-dts"; import replace from "@rollup/plugin-replace"; import css from "rollup-plugin-import-css"; +import { ignoreCss } from "./scripts/rollup.js"; /** * Modifies the Rollup options for a build to support strict CSP @@ -38,7 +39,7 @@ const builds = [ { input: "src/index.ts", plugins: [esbuild()], - external: ["vue-demi", "echarts/core", "resize-detector"], + external: ["vue-demi", /^echarts/, "resize-detector"], output: [ { file: "dist/index.esm.js", @@ -56,7 +57,7 @@ const builds = [ { input: "src/index.ts", plugins: [esbuild({ minify: true })], - external: ["vue-demi", "echarts/core", "resize-detector"], + external: ["vue-demi", /^echarts/, "resize-detector"], output: [ { file: "dist/index.esm.min.js", @@ -74,10 +75,15 @@ const builds = [ { input: "src/index.ts", plugins: [ + ignoreCss, dts({ - respectExternal: true + compilerOptions: { + // see https://github.com/unjs/unbuild/pull/57/files + preserveSymlinks: false + } }) ], + external: ["vue-demi", /^echarts/, "resize-detector"], output: { file: "dist/index.d.ts", format: "esm" diff --git a/scripts/postinstall.js b/scripts/postinstall.js index f13cee5..fa5140d 100644 --- a/scripts/postinstall.js +++ b/scripts/postinstall.js @@ -1,6 +1,6 @@ /* eslint-disable @typescript-eslint/no-var-requires */ -const path = require("path"); -const fs = require("fs"); +import path from "node:path"; +import fs from "node:fs"; const packageFile = path.resolve(__dirname, "../package.json"); @@ -12,35 +12,40 @@ const typesPaths = { function switchVersion(version) { const typesPath = typesPaths[version]; - const package = JSON.parse(fs.readFileSync(packageFile, "utf8")); - if (typesPath !== package.types) { - package.types = typesPath; - fs.writeFileSync(packageFile, JSON.stringify(package, null, " "), "utf8"); + const pkg = JSON.parse(fs.readFileSync(packageFile, "utf8")); + if (typesPath !== pkg.types) { + pkg.types = typesPath; + fs.writeFileSync(packageFile, JSON.stringify(pkg, null, " "), "utf8"); } console.log(`[vue-echarts] Switched to Vue ${version} environment.`); } -function loadVue() { +async function loadVue() { try { - return require("vue"); + const Vue = await import("vue"); + return Vue; } catch (e) { return null; } } -const Vue = loadVue(); +async function main() { + const Vue = await loadVue(); -// Align the process with vue-demi -if (!Vue || typeof Vue.version !== "string") { - console.warn( - '[vue-echarts] Vue is not found. Please run "npm install vue" to install.' - ); -} else if (Vue.version.startsWith("3.")) { - switchVersion(3); -} else if (Vue.version.startsWith("2.7.")) { - switchVersion(2.7); -} else if (Vue.version.startsWith("2.")) { - switchVersion(2); -} else { - console.warn(`[vue-echarts] Vue version v${Vue.version} is not supported.`); + // Align the process with vue-demi + if (!Vue || typeof Vue.version !== "string") { + console.warn( + '[vue-echarts] Vue is not found. Please run "npm install vue" to install.' + ); + } else if (Vue.version.startsWith("3.")) { + switchVersion(3); + } else if (Vue.version.startsWith("2.7.")) { + switchVersion(2.7); + } else if (Vue.version.startsWith("2.")) { + switchVersion(2); + } else { + console.warn(`[vue-echarts] Vue version v${Vue.version} is not supported.`); + } } + +main(); diff --git a/scripts/rollup.js b/scripts/rollup.js index 7c7e2b2..b0c8f3c 100644 --- a/scripts/rollup.js +++ b/scripts/rollup.js @@ -1,7 +1,7 @@ const EMPTY_FILE_ID = "__rollup_empty__"; /** @type {import('rollup').Plugin} */ -export const ingoreCss = { +export const ignoreCss = { name: "ignore-css", resolveId(source) { if (source.endsWith(".css")) { diff --git a/src/ECharts.ts b/src/ECharts.ts index 9063140..09739df 100644 --- a/src/ECharts.ts +++ b/src/ECharts.ts @@ -13,11 +13,20 @@ import { nextTick, watchEffect, getCurrentInstance, - Vue2, - type PropType, - type InjectionKey + Vue2 } from "vue-demi"; import { init as initChart } from "echarts/core"; +import { + usePublicAPI, + useAutoresize, + autoresizeProps, + useLoading, + loadingProps +} from "./composables"; +import { omitOn, unwrapInjected } from "./utils"; +import { register, TAG_NAME } from "./wc"; + +import type { PropType, InjectionKey } from "vue-demi"; import type { EChartsType, EventTarget, @@ -30,15 +39,8 @@ import type { UpdateOptionsInjection, Emits } from "./types"; -import { - usePublicAPI, - useAutoresize, - autoresizeProps, - useLoading, - loadingProps -} from "./composables"; -import { omitOn, unwrapInjected } from "./utils"; -import { register, TAG_NAME, type EChartsElement } from "./wc"; +import type { EChartsElement } from "./wc"; + import "./style.css"; const __CSP__ = false; diff --git a/src/composables/api.ts b/src/composables/api.ts index 707c9d8..fadedfe 100644 --- a/src/composables/api.ts +++ b/src/composables/api.ts @@ -1,6 +1,6 @@ /* eslint-disable @typescript-eslint/no-explicit-any */ -import { Ref } from "vue-demi"; -import { EChartsType } from "../types"; +import type { Ref } from "vue-demi"; +import type { EChartsType } from "../types"; const METHOD_NAMES = [ "getWidth", diff --git a/src/composables/autoresize.ts b/src/composables/autoresize.ts index 9d2f6a3..0b37a64 100644 --- a/src/composables/autoresize.ts +++ b/src/composables/autoresize.ts @@ -1,11 +1,10 @@ -import { watch, type Ref, type PropType } from "vue-demi"; +import { watch } from "vue-demi"; import { throttle } from "echarts/core"; -import { - addListener, - removeListener, - type ResizeCallback -} from "resize-detector"; -import { type EChartsType } from "../types"; +import { addListener, removeListener } from "resize-detector"; + +import type { Ref, PropType } from "vue-demi"; +import type { ResizeCallback } from "resize-detector"; +import type { EChartsType } from "../types"; type AutoresizeProp = | boolean diff --git a/src/composables/loading.ts b/src/composables/loading.ts index ae552a2..0aeb146 100644 --- a/src/composables/loading.ts +++ b/src/composables/loading.ts @@ -1,12 +1,7 @@ +import { inject, computed, watchEffect } from "vue-demi"; import { unwrapInjected } from "../utils"; -import { - inject, - computed, - watchEffect, - type Ref, - type InjectionKey, - type PropType -} from "vue-demi"; + +import type { Ref, InjectionKey, PropType } from "vue-demi"; import type { EChartsType, LoadingOptions } from "../types"; export const LOADING_OPTIONS_KEY = diff --git a/src/types.ts b/src/types.ts index a53eb56..102df3d 100644 --- a/src/types.ts +++ b/src/types.ts @@ -1,6 +1,6 @@ import { init } from "echarts/core"; -import type { SetOptionOpts, ECElementEvent, ElementEvent } from "echarts"; import type { Ref } from "vue"; +import type { SetOptionOpts, ECElementEvent, ElementEvent } from "echarts"; export type Injection = T | null | Ref | { value: T | null }; diff --git a/src/utils.ts b/src/utils.ts index a0e7e71..4fbc535 100644 --- a/src/utils.ts +++ b/src/utils.ts @@ -1,4 +1,5 @@ import { unref } from "vue-demi"; + import type { Injection } from "./types"; type Attrs = { diff --git a/vue.config.js b/vue.config.js index b98cf8e..0c0ddb1 100644 --- a/vue.config.js +++ b/vue.config.js @@ -1,7 +1,7 @@ /* eslint-disable @typescript-eslint/no-var-requires */ -const nested = require("postcss-nested"); +import nested from "postcss-nested"; -module.exports = { +export default { outputDir: "demo", css: { loaderOptions: {