Vuejs：包含带有 <script> 标签的本地 javascript 文件

问题描述

我想在 vuejs 组件中包含这个 jquery 插件：http://jvenn.toulouse.inra.fr/app/js/jvenn.min.js。

为此，我添加了这些行

mounted () {
  const jvenn = document.createElement('script')
  jvenn.setAttribute(
    'src','http://jvenn.toulouse.inra.fr/app/js/jvenn.min.js'
  )
  jvenn.async = true
  document.head.appendChild(jvenn)
}

它工作正常，但我想拥有此脚本的本地副本，以防此文件不再在线。我尝试将它添加到我的资产目录中，并通过 /static/js/jvenn.min.js 更改 http://jvenn.toulouse.inra.fr/app/js/jvenn.min.js 没有成功。

有什么想法吗？

解决方法

如果

js
└─jvenn.min.js
index.html

然后就是js/jvenn.min.js

假设一个 Vue CLI 脚手架项目，将第三方脚本放在 public folder 中，使其成为静态资产：

public
└─js
|  └─jvenn.min.js
└─index.html

然后编辑 public/index.html 以导入脚本：

<body>
  <script src="<%= BASE_URL %>js/jvenn.min.js"></script>
</body>

如果配置了项目的基本 URL，<%= BASE_URL %> 中的 src 前缀很重要。

javascript venn vue.js

Vuejs：包含带有 <script> 标签的本地 javascript 文件

问题描述

解决方法

相关问答