Vue项目中自动加载外部JS文件

如果你想在Vue项目的main.js中加载外部JS文件，你可以使用动态创建script标签的方式来加载该文件。具体代码如下：

// main.js

import Vue from 'vue'
import App from './App.vue'

// 动态创建script标签加载外部JS文件
let script = document.createElement('script');
script.src = 'http://192.168.1.2:20/web-apps/apps/api/documents/app.js';
document.body.appendChild(script);

new Vue({
  render: h => h(App),
}).$mount('#app')

按照使用环境来动态加载JS文件你可以这么写：

// main.js

if (process.env.NODE_ENV === 'development') {
  // 在开发环境中执行的代码
  Vue.prototype.docApi = devApi
  console.log('这是开发环境',Vue.prototype.docApi);
  // 动态创建script标签加载外部JS文件
  let script = document.createElement('script');
  script.src = 'http://192.168.1.2/web-apps/apps/api/documents/api.js';
  document.body.appendChild(script);
} else if (process.env.NODE_ENV === 'production') {
  // 在生产环境中执行的代码
  Vue.prototype.docApi = prodApi
  console.log('这是生产环境',Vue.prototype.docApi);
  // 动态创建script标签加载外部JS文件
  let script = document.createElement('script');
  script.src = 'http://192.168.1.2:20/web-apps/apps/api/documents/api.js';
  document.body.appendChild(script);
}

这样在main.js中动态创建了一个script标签来加载你想要的外部JS文件。当Vue应用加载时，该外部JS文件也会被自动加载。请确保该JS文件能够被访问到。

F12检查可以在Elements中看到已经成功加载。