如何在一个项目中拥有多个vue应用

Question

在我工作的地方，我们有一个 .net 网站，其中包含 3 个不同的 MVC 区域，分别针对我们合作的每种类型的用户。 客户、招聘人员和员工。 我想在 vue 中重新创建它，它是一个 vue 项目，但又是一个单独的客户端应用程序、招聘人员应用程序和员工应用程序。 使用 vue.config.js 文件我可以做到这一点。

const { defineConfig } = require('@vue/cli-service')
module.exports = defineConfig({
  transpileDependencies: true,

  pages: {
    app1: {
      entry: 'src/clients/main.js',
      template: 'public/client.html',
      filename: 'client.html',
      title: 'Clients',
      chunks: ['chunk-vendors', 'chunk-common', 'index']
    },
    app2: {
      entry: 'src/recruiters/main.js',
      template: 'public/recruiter.html',
      filename: 'recruiter.html',
      title: 'Recruiters',
      chunks: ['chunk-vendors', 'chunk-common', 'index']
    }
  }
})

当我使用 cli 构建站点的生产版本时，这工作得很好。 但是，当我运行本地开发版本时，我无法让它正常工作。 这是我的项目的屏幕截图（使用 webstorm）。

在设置所有单独的应用程序之前，当我运行 vue-cli-service 服务时，公共 index.html 文件将从注入其中的 src 文件夹中获取 main.js 文件。 我试图在 Clients 和 Recruiters 文件夹中发生同样的事情，其中Recruiters/main.js 文件被注入到 public/recruiter.html 文件中，等等。 目前，我猜测由于 vue.config.js 文件，它不再将 src/main.js 注入 public/index.html 文件中。

cli 是否有设置可以执行此操作？ 或者我丢失了一个配置文件？

Answer 1

找到解决方案有运气吗？ Angular 支持这一点，因此它不是 NPM 限制。