Laravel Mix multiple entry points generates one manifest.js Laravel Mix multiple entry points generates one manifest.js laravel laravel

Laravel Mix multiple entry points generates one manifest.js


In order to create a mix file for backend and frontend each (and other entry points if needed), adjust package.json:

"scripts": {    "dev": "npm run development",    "development": "cross-env process.env.section=website NODE_ENV=development node_modules/webpack/bin/webpack.js --progress --hide-modules --config=node_modules/laravel-mix/setup/webpack.config.js",    "watch": "cross-env process.env.section=website NODE_ENV=development node_modules/webpack/bin/webpack.js --watch --progress --hide-modules --config=node_modules/laravel-mix/setup/webpack.config.js",    "prod": "npm run production",    "production": "cross-env process.env.section=website NODE_ENV=production node_modules/webpack/bin/webpack.js --progress --hide-modules --config=node_modules/laravel-mix/setup/webpack.config.js",    "admin-dev": "npm run admin-development",    "admin-development": "cross-env process.env.section=admin NODE_ENV=development node_modules/webpack/bin/webpack.js --progress --hide-modules --config=node_modules/laravel-mix/setup/webpack.config.js",    "admin-watch": "cross-env process.env.section=admin NODE_ENV=development node_modules/webpack/bin/webpack.js --watch --progress --hide-modules --config=node_modules/laravel-mix/setup/webpack.config.js",    "admin-prod": "npm run admin-production",    "admin-production": "cross-env process.env.section=admin NODE_ENV=production node_modules/webpack/bin/webpack.js --progress --hide-modules --config=node_modules/laravel-mix/setup/webpack.config.js"  },

webpack.mix.js:

let mix = require('laravel-mix');if (process.env.section) {  require(`${__dirname}/webpack.mix.${process.env.section}.js`);}

create webpack.mix.website.js:

let { mix } = require('laravel-mix');mix  .setPublicPath(path.normalize('public_html/assets/website'))  .less('resources/assets/website/less/website.less', 'css/style.css')  .options({    processCssUrls: false  })  .js('resources/assets/website/js/website.js', 'js/global.js');

create webpack.mix.admin.js:

let mix = require('laravel-mix');mix  .setPublicPath(path.normalize('public_html/assets/admin'))  .options({    processCssUrls: false  })  .js('resources/assets/admin/js/admin.js', 'js/global.js')  .less('resources/assets/admin/less/admin.less', 'css/style.css');

This is currently the only way to create multiple manifest files etc. for multiple entry points on different directory levels.


Add "gulp": "^3.9.1" in your package.jsone file

"devDependencies": {    "axios": "^0.15.3",    "bootstrap-sass": "^3.3.7",    "cross-env": "^3.2.3",    "jquery": "^3.1.1",    "laravel-mix": "0.*",    "lodash": "^4.17.4",    "gulp": "^3.9.1",    "vue": "^2.1.10"  },

and in your webpack.mix.js file add bellow code

 const { mix } = require('laravel-mix');    mix.scripts([    'resources/assets/js/app.js'    ], 'public/js/manifest.js')//Combine All JS files into one file   .minify();

and then run bellow command for minify js

npm run production

{{ HTML::script('public/js/manifest.js') }}{{ HTML::script('app/js/app.js') }}