Vue引入js文件Vue项目中引入外部js文件，动态创建script标签，或者使用es6进行导入文件，在html中可通过

静态引入js文件

HTML引入JS文件(es5)

// head或者body里面添加script标签，script标签内定义JS方法
<head>
    <script>
        function fn() {
            alert("orange");
        }
    </script>
</head> 
 
// head或者body里面添加script标签引入外部JS文件
<script type="text/javascript" src="../utils/orange.js"></script>

vue文件引入JS文件(es6)

// script标签内直接导入js文件
<script>  
    import { orange } from '../utils/orange.js'  
    export default {  
        data() {
            return {}
        }
    }  
</script>

动态态引入js文件

HTML动态引入加载JS文件(es5)

// 动态创建script标签，并指定script的src属性
/**
* @param src {String} 文件路径
* @param onloadAtt {String} 无堵塞加载JS，异步加载属性（async、defer），async和defer不同之处是async加载完成后会自动执行脚本，defer加载完成后需要等待页面也加载完成才会执行代码；
* @param timeStemp {String | Number} 时间戳之类（用于减少资源请求以及确定当前版本）
* @param onloadFn {Function} script加载完成的回调函数
* @param onerrorFn {Function} script加载失败的回调函数
*/
function createScript(src, onloadAtt, timeStemp, onloadFn, onerrorFn) {
    src += '?timeStemp=' + timeStemp;
    var script = document.createElement('script');
    script.setAttribute('type', 'text/javascript');
    script.setAttribute('src', src);
    if (onloadAtt) { // 是否无堵塞加载JS
        script.setAttribute(onloadAtt, true);
        // script[onloadAtt] = true;
    }
    script.onload = onloadFn; // 添加加载完毕函数
    
    // 注意！！！ 虽然HTML5规定了<script>元素的onerror时间处理程序，但还没有被任何浏览器实现
    script.onerror = onerrorFn; // 添加加载失败函数
    document.head.appendChild(script);
}

// 执行
createScript('../utils/orange.js', '', 9527, () => {
    console.log('js加载成功')
}, () => {
    console.log('js加载失败')
})

vue文件动态引入加载JS文件(es6)

export default {
    data() {
        return {}
    },
    created() {
        // 动态引入js
        import('../utils/orange.js')
            .then(result => {
                this.$nextTick(() => {
                     console.log('result: ', result)
                     console.log('引入成功！')
                })
            })
            .catch(e => {
                console.log('e: ', e)
                console.log('引入失败！')
            })
    }
}

做个优化，搞个预加载，配合script标签使用

function createLink(url, timeStemp) {
	var href = url + '?timeStemp=' + timeStemp;
	var link = document.createElement('link');
	link.setAttribute('rel', 'modulepreload');
	link.setAttribute('href', href);
	document.head.appendChild(link);
}

总结：个人觉得有条件的话优先使用es6的语法，比较好用而且比较少问题。