Javascriptservices: How to Run Webpack to Build for Production

Created on 22 Apr 2017  路  3Comments  路  Source: aspnet/JavaScriptServices

I've been trying to figure out how to make webpack build for production.

I added some console.log to check the values of variables like below:

const isDevBuild = !(env && env.prod);
console.log(isDevBuild);
console.log(env);

And the output is:

true
undefined
  1. Can anyone show me how to run webpack to build production files?

Most helpful comment

@uNkNowN92-git

I resolved mine by editing the webpack configuration to:

const isDevBuild = !(env && env === 'prod');
console.log("isDevBuild: " + isDevBuild);

and running the following console command:
webpack -p --env=prod --progress

Hope that helps!

Edit - after attempting to publish my ASP.NET Core application, I realised that the the template's .csproj (if you generate one from yeoman) is already defined with a target that executes the production webpack commands.

Using the original javascript, you can specify production build with

webpack.js --env.prod

as seen below (original csproj)

 <Target Name="RunWebpack" AfterTargets="ComputeFilesToPublish">
    <!-- As part of publishing, ensure the JS resources are freshly built in production mode -->
    <Exec Command="npm install" />
    <Exec Command="node node_modules/webpack/bin/webpack.js --config webpack.config.vendor.js --env.prod" />
    <Exec Command="node node_modules/webpack/bin/webpack.js --env.prod" />
  </Target>

All 3 comments

Hey have a looking into the following.

https://webpack.js.org/guides/production-build/

@uNkNowN92-git

I resolved mine by editing the webpack configuration to:

const isDevBuild = !(env && env === 'prod');
console.log("isDevBuild: " + isDevBuild);

and running the following console command:
webpack -p --env=prod --progress

Hope that helps!

Edit - after attempting to publish my ASP.NET Core application, I realised that the the template's .csproj (if you generate one from yeoman) is already defined with a target that executes the production webpack commands.

Using the original javascript, you can specify production build with

webpack.js --env.prod

as seen below (original csproj)

 <Target Name="RunWebpack" AfterTargets="ComputeFilesToPublish">
    <!-- As part of publishing, ensure the JS resources are freshly built in production mode -->
    <Exec Command="npm install" />
    <Exec Command="node node_modules/webpack/bin/webpack.js --config webpack.config.vendor.js --env.prod" />
    <Exec Command="node node_modules/webpack/bin/webpack.js --env.prod" />
  </Target>

@chromefox Thanks for answering.

Yes, the way to do it is to specify --env.prod when invoking Webpack on the command line, i.e.,

webpack --config webpack.config.vendor.js --env.prod
webpack --env.prod
Was this page helpful?
0 / 5 - 0 ratings