当我们使用 Vue 构建应用时，有时需要引入一些静态的 JavaScript 文件。在 Vue 中，我们可以使用以下步骤引入静态的 JS 文件：
- 使用 script 标签引入静态 JS 文件
最简单的方式就是使用 HTML 中的 script 标签引入静态 JS 文件。这种方式的缺点是无法做到模块化。
例如，我们在 index.html 文件中引入一个位于 public 目录下的静态 JavaScript 文件：
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>Vue App</title>
</head>
<body>
<div id="app"></div>
<script src="./public/js/myscript.js"></script>
</body>
</html>
- 使用 import 引入静态 JS 文件
我们可以使用 ES6 的 import 语法引入静态 JS 文件，这种方式可以做到模块化，并且可以使用命名空间来避免命名冲突。
假设我们有一个名为 myscript.js 的静态 JS 文件，位于 src 目录下。
首先，在需要使用这个静态 JS 文件的组件、页面或者 Vue 实例中，使用 import 语句引入 myscript.js 文件：
import myscript from '@/js/myscript.js'
然后，我们在 Vue 组件的 mounted() 钩子函数中执行 myscript.js 中的方法：
mounted() {
myscript.init(this.$el)
}
做完以上两步，静态 JS 文件就被成功引入了 Vue 应用。
综上所述，我们可以使用 script 标签或者 import 语句来引入一个静态的 JavaScript 文件，并使用其中的方法和变量。
本站文章如无特殊说明，均为本站原创，如若转载，请注明出处：vue引入静态js文件的方法 - Python技术站
微信扫一扫 
支付宝扫一扫 