首页 > 解决方案 > 当我在模板中包含本地 .js 文件时,Vue 拒绝构建,该文件引用了“窗口”全局 - ReferenceError:未定义窗口

问题描述

我有一个 VuePress 项目,我只需要在一个画廊的组件中包含一个本地 js 文件。.js 文件引用了 window 对象,而我的项目拒绝构建:

(node:57059) UnhandledPromiseRejectionWarning: ReferenceError: window is not defined
    at isMobile (4.server-bundle.js:1470:27)
    at 4.server-bundle.js:3343:20
    at 4.server-bundle.js:937:109
    at Object.345 (4.server-bundle.js:942:3)
    at __webpack_require__ (server-bundle.js:27:30)
    at Module.356 (4.server-bundle.js:5022:17)
    at __webpack_require__ (server-bundle.js:27:30)
(node:57059) UnhandledPromiseRejectionWarning: Unhandled promise rejection. This error originated either by throwing inside of an async function without a catch block, or by rejecting a promise which was not handled with .catch(). To terminate the node process on unhandled promise rejection, use the CLI flag `--unhandled-rejections=strict` (see https://nodejs.org/api/cli.html#cli_unhandled_rejections_mode). (rejection id: 49)
(node:57059) [DEP0018] DeprecationWarning: Unhandled promise rejections are deprecated. In the future, promise rejections that are not handled will terminate the Node.js process with a non-zero exit code.

从我了解的文档中,我只应该windowmounted生命周期方法中引用。但是其他脚本呢?我该如何处理?

这是我包含脚本的方式:

</template>
<script>
import * as GLightbox from '../assets/scripts/glightbox.js'

export default {
// ...

以下是我的使用方式:

// ...
mounted: function () {
  this.lightbox = GLightbox({
      touchNavigation: true,
      loop: true
  })
},

干杯

标签: vue.jsvuepress

解决方案


推荐阅读