[英]Difference between npm run dev and npm run production
I am very new in Laravel and vue.js.Please let me know what is the difference between npm run dev
and npm run production
.Is this something related with the environment? I am very new in Laravel and vue.js.Please let me know what is the difference between
npm run dev
and npm run production
this something related with the environment?
npm run dev
creates a source map and doesn't minify your js/css which makes it easier to debug and find errors out npm run dev
创建一个源 map 并且不会缩小您的 js/css,从而更容易调试和发现错误
npm run production
on the other hand does not create a source map and minifies all your js/css files so that they are ready for production and are faster to read by the system.另一方面,
npm run production
不会创建源 map 并缩小所有 js/css 文件,以便它们可以用于生产并更快地被系统读取。
Generally you would want to use npm run dev
when you're developing the site, and npm run production
when it's ready to be deployed.通常,您会希望在开发站点时使用
npm run dev
,而在准备部署时使用npm run production
。
Those are aliases defined on the package.json
to execute scripts这些是在
package.json
上定义的别名来执行脚本
Here are the aliases and respective commands with parameters.这是别名和带有参数的相应命令。
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"
},
We see two differences in parameters between two commands here我们在这里看到两个命令之间的两个参数差异
for dev/development it is对于开发/开发,它是
NODE_ENV=development --progress
While for production it is而对于生产它是
NODE_ENV=production --no-progress
This means when dev command is run the node environment is set to development and when prod is run node environment is set to production.这意味着当 dev 命令运行时,节点环境设置为开发,而当 prod 运行时,节点环境设置为生产。 Additionally progress is not shown in production while shown on development command.
此外,在开发命令上显示时,生产中不会显示进度。
The default tasks will be different based on the environment.默认任务会因环境而异。 Also you can use it to customize your own tasks on
webpack.mix.js
file something like this您也可以使用它在
webpack.mix.js
文件上自定义您自己的任务,如下所示
const mix = require('laravel-mix');
/*
|--------------------------------------------------------------------------
| Mix Asset Management
|--------------------------------------------------------------------------
|
| Mix provides a clean, fluent API for defining some Webpack build steps
| for your Laravel application. By default, we are compiling the Sass
| file for the application as well as bundling up all the JS files.
|
*/
mix.js('resources/js/app.js', 'public/js')
.sass('resources/sass/app.scss', 'public/css');
//run this task if the environment is not in production
if(!mix.inProduction()) {
mix.sourceMaps();
mix.webpackConfig({ devtool: 'inline-source-map'})
}
Webpack Webpack
The actual difference between development and production is optimization.开发和生产之间的实际区别在于优化。 For production the build time will be more compared to development as some optimization tasks will be done only for production, this will minify the code as well.
对于生产而言,与开发相比,构建时间会更多,因为一些优化任务将只针对生产完成,这也会缩小代码。 In Laravel by default Laravel mix is used to configure it easily.
在 Laravel 默认情况下,Laravel 混合用于轻松配置它。 The underlying is handled by webpack.
底层由 webpack 处理。 From the webpack documentation here you can check actually what are the differences between two environments and environment specific tasks.
从此处的 webpack 文档中,您可以实际检查两种环境和环境特定任务之间的区别。
Build performance develpment vs production构建性能开发与生产
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.