0

嗨,我有一个名为的应用程序Home,它具有可安装的插件,我可以在任何时间点安装它运行在iframe

<Home /home/user/mainprojects/index.html> <-- Home app
   <Bed iframe /home/user/plugins/bed/index.html> <-- plugins app
   <Bed /iframe>
</Home>

通过此nginx设置,我可以在构建后加载插件应用程序(床)(这很耗时)

这是 nginx 设置

     location / {
             alias /home/user/mainprojects/dist/;
             index index.html;
     }


  location /Bed {
      alias    /home/user/plugins/bed/dist/;
      index  index.html index.htm;
  }

问题:我不想构建Home我想通过它运行的主应用程序serve,但是我将始终构建第二个应用程序,即插件,它将作为捆绑包提供。nginx在构建两者(即 npm run build,bundle)之后使用上述设置,它将正常工作。我想避免主应用程序构建。

这是我的vue.config.js样子

module.exports = {
    devServer:{
        proxy:{
            '^/appReplacer':{
                 target: 'http://100.148.1.9:9003/',
                 changeOrigin:true,
                 logLevel:'debug',
                 pathRewrite: {'^/appReplacer':'/'}
            }
        }
    }
}

还在寻找解决方案。。

请帮助我提前谢谢!

4

1 回答 1

1

假设您使用的是基于 Webpack 4 的 Vue CLI v4

Webpack DevServer 基于Express框架,允许使用devServer.before选项设置自定义 Express 中间件

通过这种方式,您可以配置任何路径来提供几乎任何您想要的服务。例如使用静态中间件来提供一些静态文件(在这种情况下是插件的 dist)

请注意,以下代码很大程度上取决于使用的 Vue CLI 版本。Vue CLI 4.5.15 的当前版本正在使用"webpack-dev-server": "^3.11.0"which uses"express": "^4.17.1"

// vue.config.js

// express should be installed as it is used by webpack-dev-server
const express = require('express');

module.exports = {
  //...
  devServer: {
    before: function(app, server, compiler) {
      app.use('/url/to/plugin', express.static('dist/location/of/your/plugin'));
    }
  }
};
于 2022-01-13T18:06:13.530 回答