Vue 開發中經常需要在頁面中加載本地JS文件，以實現更完善的功能。這篇文章將介紹如何在Vue中加載本地JS文件。

首先，需要在html文件中引入相關的JS文件。可以通過script標簽來實現，比如：

<!-- 引入jquery -->
<script src="js/jquery.min.js"></script>
<!-- 引入其他JS文件 -->
<script src="js/common.js"></script>

但是，在Vue中引入JS文件需要注意一些細節。Vue提供了兩種引入JS文件的方式：通過CDN鏈接和通過本地文件加載。我們可以通過Vue的webpack配置來實現在Vue組件中加載本地JS文件。下面，以本地JS文件的引入為例，介紹如何使用Vue加載本地JS文件。

第一步，我們需要在webpack配置文件中添加文件讀取的loader，以便正確加載JS文件。在webpack.config.js中，添加如下代碼，即可加載JS文件：

module: {
rules: [
{
test: /\.js$/,  // 匹配 js 文件
loader: 'babel-loader',  // 使用 babel-loader 轉義
exclude: /node_modules/ // 排除 node_modules 下的 js 文件
},
{
test: /\.txt$/, // 匹配 txt 文件
use: 'raw-loader' // 使用 raw-loader 加載
}
]
}

第二步，我們需要在Vue組件中引入需要的JS文件。可以在組件的methods選項中添加methods，引入各自需要的JS文件，如下所示：

methods: {
loadJS() {
let script = document.createElement('script')
script.src = '/path/to/js/file.js'
document.body.appendChild(script)
}
}

第三步，我們需要在Vue組件中調用需要的JS文件。可以在生命周期鉤子函數created中調用方法，如下所示：

created() {
this.loadJS()
}

此時，我們就可以在Vue組件中成功加載本地JS文件了。需要注意，由于Vue組件采用了異步加載的方式，因此需要等組件mounted后才能調用。

以上便是Vue中加載本地JS文件的方法，希望本篇文章能幫助到大家！