Security 在vue应用程序的登录页面中隐藏app.js中的其他代码

我正在使用laravel+vue创建一个应用程序。Vue加载app.js中的所有javascript代码，即使在用户尚未通过身份验证的登录页面中也是如此。在用户登录之前，我不想公开所有js代码。有没有办法让我只显示登录页面所需的代码，而不公开应用程序的所有js代码？我这样做也是为了限制登录页面下载app.js的大小，以缩短页面加载时间。

如果您使用的是Laravel mix，您可以为登录脚本添加一个新的入口点

mix.js('resources/assets/app/js/app.js', 'public/app/js')
  .js('resources/assets/app/js/login.js, 'public/app/js);

因此，您可以在基本布局中添加@yield语句，以放置页面视图中声明的脚本

base.blade.php

应用程序名称-@yield（'title'））
@节（“侧栏”）
这是主侧边栏。
@展示
@产量（‘含量’）
@产量（'脚本'）

login.blade.php

@extends（'layouts.base'））
@节（“标题”、“页面标题”）
@节（“内容”）
这是我的身体内容

@停止
@节（“脚本”）
@停止

已编辑

对于SPA，您可以使用另一个捆绑入口点来定义登录组件：

Vue.component('login-form', {
  ... component code here
})

您可以使用从Vue路由器加载

beforeach

方法中的

login.js

脚本。因此，该组件将在呈现登录页面之前可用

router.beforeEach(async (to, from, next) => {
  if (to === 'login'){
    await Vue.loadScript('login entry point url here')
  }
  next();
});

此外，您还可以使用

beforeMount

钩子在页面内部执行此操作。这里是一个使用虚假承诺和入口点的示例

如果您使用的是Vue CLI，它已经支持动态导入的延迟加载

这里有一篇详细的文章：

---

这是一个vue SPA btw。问题是我的登录页面位于vue应用程序的vue路由内，并且登录页面是vue应用程序的一个组件。您使用什么捆绑您的SPA？拉维混合？你是用vue cli创建的吗？@japhfortin我更新了答案。我希望这能有所帮助。我正在使用laravel mix，我相信它可以将所有资产编译成一个文件-app.js？即使我在登录页面，该文件也包含我的所有代码。