javascript - 在 Vue 应用程序中导入脚本后 undefined variable

Question

我正在尝试将 JavaScript 文件导入我的 Vue 应用程序(在 main.js 中)，但控制台显示 Uncaught ReferenceError: CI is not defined .

CI是 Defines.js 中的一个变量，这是一个第三方库，不幸的是我无法对其进行任何修改。请看下面的代码:

main.js

import Vue from 'vue'
import App from './App.vue'
import router from './router'
import store from './store'
import './afw/Utils/Defines.js' // <<< this line!

console.log(CI) // <<< I got the error here!

Vue.config.productionTip = false

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

作为Defines.js是一个包含敏感信息的私有(private)脚本，我无法向您展示太多。但是，这是此脚本的一部分:

var CI = {};

...

if (typeof module !== 'undefined') {
    module.exports = CI.Utils.Define;
}

我应该怎么做才能让它发挥作用？如果我转向经典 Web 应用程序(使用 <script/> 导入脚本)，它可以工作，但我需要使用 VueJS 2。

更新

当我导入另一个需要 Defines.js 中的变量的 JavaScript 时，我也遇到了同样的麻烦。 :

import './afw/Utils/Defines'
import './afw/System/Core.js' // <<< Core.js needs a variable inside the Defines.js

Answer 1

您公开了 CI.Utils.Define 中的内容，而不是 CI 本身。除非您从 ./afw/Utils/Defines.js 中导出 CI，否则没有办法解决这个问题。

当您通过脚本将它包含在网页中时，它会起作用，因为那里没有模块的概念，并且 CI 最终在 window 对象上声明，但正如您注意到的那样，情况并非如此使用模块时。