0

[ 使用 Laravel ^8.40 / Inertia JS / Vue ^3.2.11 / Laravel Mix ^6.0.31 ]

我正在开发一个用于发布客户端网站的多租户 SaaS 平台,其中每个租户都有一个或多个项目,每个项目都有自己的混合工作流程。每个租户项目都有针对该租户域的唯一路由,而不是每个单独租户的相同路由,这就是我配置并行混合工作流(每个项目一个工作流)的原因。我发现完全按照我想要的方式配置输出目录结构具有挑战性,我试图根据在线可用的文档来解决这个问题,但我确实觉得我错过了一些东西,而且我在兜圈子...

我的 Vue 组件和 Sass 样式存储在resources/{js|scss}/projects/{tenant}/(也包括pages子目录)中,我希望 Laravel Mix 将所有编译的 JS/CSS文件输出到public/projects/{tenant}/{js|css}/并将mix-manifest.json文件输出到public/projects/{tenant}并拥有所有“ chunk'ed" 页面组件输出到与其他 JS 文件相同的文件夹...虽然我还没有完全完成...我尝试了各种选项组合,但还没有找到获胜的集合。

我的 webpack 文件({tenant}这里是p017):

const mix = require('laravel-mix');
const path = require('path');

mix
    /* Setup */
    .setPublicPath('public/projects/p017')
    .disableNotifications()
    .autoload({jquery: ['$', 'window.jQuery']})
    .webpackConfig({
        resolve: {
            extensions: ['.js', '.json', '.vue', '.css', '.scss'],
            alias: {
                '@': path.resolve(__dirname, 'resources/js/'),
                '~': path.resolve(__dirname, 'resources/scss/')
            }
        },
        output: {
            chunkFilename: 'projects/p017/js/[name].js?id=[chunkhash]'
        },
        devtool: 'inline-source-map'
    })
    .options({
        postCss: [
            require('postcss-import'),
            require('tailwindcss')
        ],
        processCssUrls: true,
        cssNano: {
            discardComments: {removeAll: true}
        }
    })
    /* Scripts */
    .js('resources/js/projects/p017/p017.js', 'projects/p017/js/app.js')
    .vue({version: 3, extractStyles: 'projects/p017/css/vue.css'})
    .extract('projects/p017/js/vendor.js')
    /* Styles */
    .sass('resources/scss/projects/p017/p017.scss', 'projects/p017/css/app.css')
    /* Cleanup */
    .sourceMaps()
    .version();

这个 webpack 文件会导致以下(不需要的)目录结构(全部在 下public):

projects/p017/projects/p017/css/app.css
projects/p017/projects/p017/css/vue.css
projects/p017/projects/p017/js/app.js
projects/p017/projects/p017/js/manifest.js
projects/p017/projects/p017/js/resources_js_projects_p017_pages_Home_vue.js
projects/p017/projects/p017/js/vendor.js
projects/p017/mix-manifest.json

...这是所需的目录结构(注意mix-manifest.json不应该移动)...

projects/p017/css/app.css
projects/p017/css/vue.css
projects/p017/js/app.js
projects/p017/js/manifest.js
projects/p017/js/resources_js_projects_p017_pages_Home_vue.js
projects/p017/js/vendor.js
projects/p017/mix-manifest.json

如果我删除该.setPublicPath()行,则该mix-manifest.json文件位于public目录中并与其他租户发生冲突,如果我将输出路径设置为.js().vue().extract().sass(),public/projects/{tenant}/{js|css}/...然后将所有 JS/CSS 文件混合输出为/{js|css}/...(删除projects/{tenant})解决他们实际去的地方。

可能的问题/解决方案:

有没有办法自定义 mix-manifest.json目录甚至文件名本身,这样我就可以防止租户冲突?

或者,我可以在没有 Laravel Mix从输出路径中剥离的情况下添加public/到每个输出目录中 吗?.js().vue().extract().sass()projects/{tenant}

或者,我是否错过了一组更好/包罗万象的文档,更详细地描述了如何实现这一点?

4

0 回答 0