如何在 Laravel VueJs 中使用多个文件夹编译多个 mix.webpackConfig

问题描述

我在 laravel vuejs 中有一个 webpack.mix.js,我想要为 Admin、Subscribers 和 Dealers 单独配置,这些文件夹是我创建到 resourse/js 文件夹中的文件夹,我想将这些文件夹编译到单独的文件夹中公共/管理应用程序、公共/订阅应用程序、公共/经销商应用程序 我怎样才能达到这样的结果? 我试图在 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',//     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')

解决方法

您可以将所有 js 资产放入这样的数组中:mix.js([source assests],'destination.js').vue();。我添加了 vue() 方法来告诉 webpack 我们正在处理 vue 文件;