K
K
KBBS2021-02-15 14:54:09
Laravel
KBBS, 2021-02-15 14:54:09

Laravel mix. Is it possible to build resources separately for the front and the admin panel?

Hello.
There is a public part of the site (hereinafter referred to as the frontend) and an administrative part (backend).
Resources (css, js) are collected via laravel-mix. Mix of the sixth version.
At the output, I want to get something like this directory structure: public/assets/frontend/js/ - with files related to the front, and public/assets/backend/js/ - with backend files.
At the same time, the key point is that for the front and back, their own manifest.js and vendor.js are generated.
Unfortunately, I can't get that result.

The most workable option I've come up with is to split the common webpack.mix.js into separate webpack.mix.frontend.js and webpack.mix.backend.js. And in package.json, write separate scripts for assembly with an explicit indication of --mix-config: --mix-config webpack.mix.frontend and --mix-config webpack.mix.backend, respectively.
This even works. But at the same time, mix-manifest.json is expectedly overwritten, which is not particularly suitable for me. I mean, if I collect resources for the back, then only they will be in mix-manifest.json, and the entries for the front are lost.

In general, how realistic is it to implement what I want within laravel-mix?

Thank you.

Answer the question

In order to leave comments, you need to log in

1 answer(s)
S
Sergey delphinpro, 2021-02-15
@KBBS

spoiler
Вы можете сделать дополнительные таски в package.json
Вы можете писать условия в webpack.mix.js
Доп. таски:
scripts: {
        "production": "cross-env NODE_ENV=production node_modules/webpack/bin/webpack.js --no-progress --config=node_modules/laravel-mix/setup/webpack.config.js"
        "production:admin": "cross-env TARGET=admin NODE_ENV=production node_modules/webpack/bin/webpack.js --no-progress --config=node_modules/laravel-mix/setup/webpack.config.js"
}

Проверка
const mix = require('laravel-mix');

if (process.env.TARGET == 'admin') {

  mix.js('src/admin.js', 'dist');

} esle {

  mix.js('src/front.js', 'dist');

}

// Общие настройки

if (mix.inProduction()) mix.version();


UPD
Sorry. You have already made the division.
about different manifests, only one thought is to rewrite the webpack configuration, namely the Manifest plugin setting. Those. through the API method, .override()try to set different names for the manifests.

Didn't find what you were looking for?

Ask your question

Ask a Question

731 491 924 answers to any question