VueJS 应用程序是空白的

Question

我已经开始克隆这个 repo https://github.com/auth0-blog/vue-jwt-authentication 的 vueJS 应用程序。我已经用它开发了几天，并用它开发了一些页面。后来才知道是Vue1.0。然后我使用 https://github.com/vuejs/vue-migration-helper 并迁移到 vue 2.0。我已经一一修正了所有的错误。

现在，当我运行该应用程序时，它只是没有显示任何错误，而是空的。我什至在浏览器控制台或 npm 终端中都没有收到任何错误。在 Inspect 元素中， <div id="app"></div> 是空的。有人请花点时间。我在这里有这个 repo 中的代码。 https://bitbucket.org/AswinKP/vuesample 。我正在分享整个回购协议，因为我无法弄清楚我在哪里犯了错误。

我已经为此进行了研究，但找不到任何此类问题。我是 vue js 的初学者，最近两天我在这方面苦苦挣扎。提前致谢。

原文由 Aswin Kumar K P 发布，翻译遵循 CC BY-SA 4.0 许可协议

Answer 1

有几个错误。首先，repo 根本无法编译。

在 index.js:8 和 :37 中，文件 components/IncidentTrendI7.vue 不存在，只需删除这两行即可。

和 build.js index.html 包含在您的 index.html <script src="build/build.js"></script>

最后一个是您的根组件。您需要一个渲染函数来在 Vue 2.0 中渲染您的应用程序（如果您使用独立构建，则需要一个模板，但首选运行时版本），因此 index.js 中的根组件将如下所示：

 const app = new Vue({
  el: '#app',
  router,
  render: h => h(App),
  components: { App }
})

原文由 CodinCat 发布，翻译遵循 CC BY-SA 3.0 许可协议

Answer 2

面对同样的问题我解决了它我将基本 url 添加到 routerwebhistory 默认情况下它指向你的文件夹的根目录

// vue.config.js
module.exports = {
  publicPath: process.env.NODE_ENV === 'production' ? '/vue/dist/' : '/'
}

const router = createRouter({
  history: createWebHistory('/vue/dist'),
  routes,
});

原文由 Muhammad Ibrahim 发布，翻译遵循 CC BY-SA 4.0 许可协议