Jon Sud
Jon Sud

Reputation: 11661

How to see webpack config from angular application?

I create angular application using ng new my-app command.

How I can see webpack.config that Angular built for my app? I don't want to customize this webpack config. just to log it to file/screen...

Upvotes: 3

Views: 8757

Answers (2)

Mahdi Zarei
Mahdi Zarei

Reputation: 7456

Angular core webpack config is placed in node_modules/@angular-devkit/build-angular/src/webpack/configs/browser.js and you can change the parameters there.

Suggestion is to create a patch.js file to change the file after every npm update to prevent rewriting codes.

And if you are talking about the webpack to use in building your additional package you have to create config file yourself and reference that in angular.json

Update:

In the earlier versions of Angular, this file is placed in the following path node_modules/@angular-devkit/build-angular/src/builders/browser-esbuild/index.js.

Upvotes: 2

Kamran Taghaddos
Kamran Taghaddos

Reputation: 614

I wanted to have a custom webpack config file like you and implement it as below:

  1. Install custom-webpack library

    npm i -D @angular-builders/custom-webpack
    
  2. Add the following configurations to angular.json file

    "architect": {
        ...
        "build": {
            "builder": "@angular-builders/custom-webpack:browser",
            "options": {
                "customWebpackConfig": {
                    "path": "./webpack.config.js"
                },
             ...
         }
    }
    
  3. If your project configured with angular universal (SSR) then you should add following configurations in your angular.json file too:

    "architect": {
        ...
        "serve": {
          "builder": "@angular-builders/custom-webpack:dev-server",
          "options": {
              "customWebpackConfig": {
              "path": "./webpack.config.js"
          }
      }
      ...
    

    }

  4. Create webpack.config.js in the root of your application project and write your custom webpack configurations in it

Upvotes: 3

Related Questions