index.html 中包含的 JS 在 VUE 项目的 main.js 中不起作用

Question

下面是一个简单的 VueJS 应用程序的 index.html。我包含了来自 netvibes.com 的小部件。我已将小部件代码包含在 html 文件及其工作中。

<?xml version="1.0" encoding="utf-8"?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xmlns:widget="http://www.netvibes.com/ns/">

<head>
  <!-- Application Metas -->
  <title>Hello World sample</title>
  <meta name="debugMode" content="false" />
  <meta name="strictMode" content="false" />
  
  <!-- UWA Environment -->
  <script type="text/javascript" src="https://uwa.netvibes.com/lib/c/UWA/js/UWA_Standalone_Alone.js"></script>

  <!-- Application Preferences -->
  <widget:preferences>
  </widget:preferences>

  <script>
    var MyWidget = {
      onLoad: function () {
        widget.setBody('Hello World!');
      }
    };
    widget.addEvent('onLoad', MyWidget.onLoad);
  </script>
</head>

<body>
  <div id="app"></div>
</body>

</html>

但是 main.js 文件中没有反映相同的“小部件”。编译时出现“error 'widget' is not defined no-undef”。我正在使用 Visual Studio 代码。

import { createApp } from 'vue';
import App from './App.vue';
import router from './router';
import store from './store';

var mainComponent = null;
function start() {
    widget.setTitle('Find Coach Application');
    mainComponent = createApp(App);
    mainComponent.use(router);
    mainComponent.use(store);
    window.Bus = mainComponent;
    mainComponent.mount("#app");
}

export default function () {
    widget.addEvent("onLoad", () => {
        start();
    });
    widget.addEvent("onRefresh", () => {
        mainComponent.$emit("widgetRefresh");
    });
    widget.addEvent("onResize", () => {
        mainComponent.$emit("widgetResize");
    });
    widget.addEvent("onSearch", (data) => {
        mainComponent.$emit("widgetSearch", data);
    });
}

请帮忙。不确定我在这里遗漏了什么。

Answer 1

从 main.js 尝试访问它：

window.widget

index.html 中包含的 JS 在 VUE 项目的 main.js 中不起作用

Included JS in the index.html is not working in main.js in VUE project

html

javascript

jsp

widget

vue.js