如何在 Laravel VueJs 中使用多个文件夹编译多个 mix.webpack Config答案

【问题标题】：How to compile multiple mix.webpackConfig with multple folders in Laravel VueJs如何在 Laravel VueJs 中使用多个文件夹编译多个 mix.webpack Config
【发布时间】：2021-04-26 05:28:59
【问题描述】：

我在 laravel vuejs 中有一个 webpack.mix.js，我想要为管理员、订阅者和经销商进行单独配置，这些文件夹是我在资源/js 文件夹中创建的文件夹，我想将这些文件夹编译成单独的文件夹public/adminapp、public/subscriberapp、public/dealerapp 我怎样才能达到这样的结果？我尝试在 webpack 中添加多个配置但无法成功，这是我的 webpack.mix.js 代码

mix.webpackConfig({
  output: { chunkFilename: 'adminapp/js/chunks/[name].js?id=[chunkhash]' },
  resolve: {
    extensions: ['.js', '.vue', '.json'],
    alias: {
      '@': __dirname + '/resources/adminapp/js',
      '@pages': __dirname + '/resources/adminapp/js/pages',
      '@components': __dirname + '/resources/adminapp/js/components',
      '@cruds': __dirname + '/resources/adminapp/js/cruds'
    }
  }
})

// Admin App
mix
  .js('resources/adminapp/js/app.js', 'public/adminapp/js')
  .sass('resources/adminapp/sass/app.scss', 'public/adminapp/css')

// subscriber
// mix.webpackConfig({
//   output: { chunkFilename: 'subscriberapp/js/chunks/[name].js?id=[chunkhash]' },
//   resolve: {
//     extensions: ['.js', '.vue', '.json'],
//     alias: {
//       '@': __dirname + '/resources/subscriberapp/js',
//       '@pages': __dirname + '/resources/subscriberapp/js/pages',
//       '@components': __dirname + '/resources/subscriberapp/js/components',
//       '@cruds': __dirname + '/resources/subscriberapp/js/cruds'
//     }
//   }
// })

// Subscriber App
// mix
//   .js('resources/subscriberapp/js/app.js', 'public/subscriberapp/js')
//   .sass('resources/subscriberapp/sass/app.scss', 'public/subscriberapp/css')

【问题讨论】：

标签： laravel vue.js webpack laravel-8 webpack-mix

【解决方案1】：

你可以把你所有的 js 资源放在一个数组中，像这样：mix.js([source assests],'destination.js').vue();。我已经添加了 vue() 方法来告诉 webpack 我们正在处理 vue 文件；

【讨论】：

但这将适用于来自 adminapp 但我也想来自subscriberapp 的配置 1