RemotecUk RemotecUk - 1 year ago 101
Javascript Question

What is the difference between ng build and webpack

As I understand it,

ng-build
creates a distributable packaged version of your application. I also understand that
webpack
is used to bundle Javascript modules.

I ran
ng build
on a test project and found that it created a
dist
folder containing what looked like a packaged version of my Angular application. All of the
.js
files had been combined however my referenced
.css
files had been left in the original form (not bundled or minified).

Therefore, what is the difference between using
ng build
or
webpack
to do this job. Or are they complimentary? Would I potentially use both in my deployment pipeline?

Answer Source

Not a complete answer, but worth to note:

If your css files were not compiled, it probably means, either:

  1. you ran ng build (a.k.a. ng build --dev) which adds default --extract-css to false:

--extract-css (aliases: -ec)

Extract css from global styles onto css files instead of js ones.

  1. You ran ng build --prod but forgot to reference your styles as global styles in angular.cli.json:

    "styles": [ "styles.css", "assets/styles/test.component.css" ],

Once you do this you will find your css files inlined, however, you will also find them in normal format as well. Cant understand why is that..

Recommended from our users: Dynamic Network Monitoring from WhatsUp Gold from IPSwitch. Free Download