我在运行 vue.js
的 Laravel 项目中使用 svg.js
。
这就是我使用svg.js
第 1 步:在我的 vue 应用程序中安装 svg.js
作为插件。
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
插件。我想使用以下三个插件,以防有人想知道。
- svg.select.js
- svg.resize.js
- svg.draggable.js
最佳答案
我有处理非 npm
的解决方案/module
图书馆。
首先我将使用jsdelivr直接从 Github 提供文件。例如https://cdn.jsdelivr.net/npm/<a href="https://stackoverflow.com/cdn-cgi/l/email-protection" class="__cf_email__" data-cfemail="255653420b4f5665170b120b14" rel="noreferrer noopener nofollow">[email protected]</a>/dist/svg.min.js
.
然后我使用script.js加载它们。
script.order([
"https://cdn.jsdelivr.net/npm/<a href="https://stackoverflow.com/cdn-cgi/l/email-protection" class="__cf_email__" data-cfemail="730005145d190033415d445d42" rel="noreferrer noopener nofollow">[email protected]</a>/dist/svg.min.js",
"https://cdn.jsdelivr.net/npm/<a href="https://stackoverflow.com/cdn-cgi/l/email-protection" class="__cf_email__" data-cfemail="83f0f5e4adf0e6efe6e0f7ade9f0c3b0adb3adb2" rel="noreferrer noopener nofollow">[email protected]</a>/dist/svg.select.min.js"
], () => {
// window.SVG is available
});
关于javascript - 如何在 vue.js 中使用 SVG.js 插件?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/55588400/