npm run dev 和 npm run production 的区别

Question

我在Laravel非常新，vue.js.Please让我知道是有什么区别npm run dev和npm run production。就是这个事情与环境有关？

Answer 1

npm run dev 创建源映射并且不会缩小您的 js/css，这使得调试和查找错误更容易

npm run production 另一方面，不会创建源映射并缩小所有 js/css 文件，以便它们可以用于生产并且系统可以更快地读取它们。

通常，您会希望npm run dev在开发站点以及npm run production准备部署时使用。

Answer 2

package.json这些是在执行脚本上定义的别名

以下是别名和带有参数的相应命令。

 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"
    },

我们在这里看到两个命令之间参数的两个差异

对于开发/开发来说是

NODE_ENV=development --progress

虽然对于生产来说是

NODE_ENV=production --no-progress

这意味着当运行 dev 命令时，节点环境设置为开发，而当运行 prod 时，节点环境设置为生产。此外，在生产中不会显示进度，而在开发命令中会显示进度。

默认任务会根据环境而有所不同。您也可以使用它来自定义您自己的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'})
}

网页包

开发和生产之间的实际区别在于优化。对于生产来说，与开发相比，构建时间会更多，因为一些优化任务将仅针对生产完成，这也会减少代码。在 Laravel 中，默认使用 Laravel mix 来轻松配置它。底层由 webpack 处理。从这里的 webpack 文档中，您可以实际检查两个环境和环境特定任务之间的差异。

构建性能开发与生产