javascript - 我如何在 vue.js 中使用 SVG.js 插件？

Question

我在运行 vue.js 的 Laravel 项目中使用 svg.js。

这就是我使用 svg.js

的方式

第 1 步:将 svg.js 作为插件安装到我的 vue 应用中。

import svgJs from "svg.js/dist/svg"

export default {
    install(Vue) {
        Vue.prototype.$svg = svgJs
    }
}

第 2 步:导入并使用插件。

import svgJs from "./plugins/vueSvgPlugin"

Vue.use(svgJs);

第 3 步:然后我可以这样做。

console.log(this.$svg);

console.log(this.$svg.get("samplesvg"));

但是我不确定如何添加 svg.js 插件。我想使用以下三个插件，以防有人想知道。

1. svg.select.js
2. svg.resize.js
3. svg.draggable.js

Answer 1

我有使用非 npm/module 库的解决方案。

首先我将使用 jsdelivr直接从 Github 提供文件。例如 https://cdn.jsdelivr.net/npm/svg.js@2.7.1/dist/svg.min.js。

然后我使用 script.js加载它们。

script.order([
  "https://cdn.jsdelivr.net/npm/svg.js@2.7.1/dist/svg.min.js",
  "https://cdn.jsdelivr.net/npm/svg.select.js@3.0.1/dist/svg.select.min.js"
], () => {
  // window.SVG is available
});

Live Example