Javascript 为SASS（编译、产品中的缩小）、JS（Concat+缩小）和多个Vue单页应用程序构建Webpack 4配置

正在尝试在我们的应用程序中为我的整个资源生成工作流设置网页设置。我不需要任何热重新加载、browsersync等。只需要监视更改，并在进行更改时重建依赖对象。文件结构如下所示：

我为我认真查找其他方法来发布结构的图像道歉，但是预览没有效果，我可以在评论中发布一个小提琴或代码笔

唯一值得注意的领域是：

1 vue spas下的每个文件夹每个单页迷你应用程序spas生成自己的应用程序输出文件。 2 js下的构件中的所有项目都被压缩并缩小为一个输出文件/dist/js/main.min.js，但js/components/下的每个项目只呈现该文件的缩小和损坏版本

最后，我明白这可能是一个很难解决的问题，但我现在让Gulp做了一些，Webpack做了Vue编译，只是想看看是否有可能整合到Webpack中，让它来完成工作

---

谢谢您的帮助。

有几种方法。最简单的方法是为webpack.config.js文件中的每个应用程序添加一个密钥

在您的webpack.config.js文件中类似于此：

这将在您的dist中为每个应用程序文件输出单独的目录

默认情况下，如果您将生产变量传递给webpack build命令，它将应用您正在寻找的所有优化。如果缺少现成的，那么很可能有一个加载程序可以处理您需要的任何优化

对于Sass，您可以将Sass加载程序添加到您的网页包文件：

您的开发服务器可以递归地监视vue spa目录以查看更改

另一种方法是使用lerna——尽管这需要额外的配置，并且只有在您所在的企业环境中，每个单独的应用程序都被发送到一个私有NPM注册表，并且需要单独的semver来进行目录输出时，才需要进行配置。

module.exports = {
  entry: {
    app1: './vue-spa/vue-spa1/app.js',
    app2: './vue-spa/vue-spa2/app.js'
    // etc
  }
};