I use the following command to bundle my scripts via the Laravel Mix module:
npm run dev // Compile scripts.
npm run prod // Compile and minify scripts.
Are these native npm commands or custom Laravel Mix commands? Where are they defined?
I noticed they are listed as "scripts" in the Laravel package.json. What exactly are these scripts, custom commands for Webpack via Laravel Mix?
"scripts": {
"dev": "npm run development",
"development": "cross-env NODE_ENV=development node_modules/webpack/bin/webpack.js --progress --hide-modules --config=node_modules/laravel-mix/setup/webpack.config.js",
"watch": "npm run development -- --watch",
"watch-poll": "npm run watch -- --watch-poll",
"hot": "cross-env NODE_ENV=development node_modules/webpack-dev-server/bin/webpack-dev-server.js --inline --hot --disable-host-check --config=node_modules/laravel-mix/setup/webpack.config.js",
"prod": "npm run production",
"production": "cross-env NODE_ENV=production node_modules/webpack/bin/webpack.js --no-progress --hide-modules --config=node_modules/laravel-mix/setup/webpack.config.js"
},
They are indeed the scripts as defined in the package.json
file as you discovered. The values are run by your shell (so, for example, bash
, zsh
, etc. on UNIX-like operating systems).
One key thing to note is that the node_modules/.bin
directory is added to PATH
before executing. So, in the case of the two scripts you're asking about, cross-env
can be found in node_modules/.bin
(because it's almost certainly specified as a devDependency elsewhere in the package.json
) as long as you've already run npm install
or npm ci
within the project directory.
Those commands are used at any project which supports JSON files on NPM. Regarding OP questions:
Are these native npm commands or custom Laravel Mix commands? Where are they defined?
npm
: One could say that it is a command native to the system, for calling Node Package Manager program. In Windows, for example, it should be the default command for calling npm from any console.run
: It is a command native to npm. More information here. Keep in mind this is an aliases to the original command run-script
.dev
and prod
: They're user defined.
dev
: Used for running the specific commands for serving the project, to any server, to live development. In the case of a web page, you'll see your web page in the browser, and any change you make to the HTML code, for example, will be reflected immediately in the page you see in your browser.prod
: Compiles all the necessary files for production. Final product. In the case of a web page, for example, the HTML, CSS, and JS files you'll handle to the client. The result of running this command, it is expected to be one single folder with all the afore mentioned content.I noticed they are listed as "scripts" in the Laravel package.json. What exactly are these scripts, custom commands for Webpack via Laravel Mix?
"dev": "npm run development"
: Runs the commandment immediately below, which is: "development": "cross-env NODE_ENV=development node_modules/webpack/bin/webpack.js --progress --hide-modules --config=node_modules/laravel-mix/setup/webpack.config.js"
. What this line of code does, depends on what dependencies you have on your project (see the node_modules
folder, and read their respective documentation)."prod": "npm run production"
: It has the same description than the item above, but for npm run prod
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With