# Testing and CI/CD integration — Webpack

Source: https://www.geekswithgeeks.com/en/webpack/webpack-21

> Integrate Webpack with testing and deployment.

## Build in CI pipelines

CI/CD pipelines run Webpack builds in controlled environments. npm scripts in package.json trigger builds. Set CI environment variables to customize build behavior (e.g., CI=true). Generate build artifacts, reports, and sourcemaps. Store bundles for deployment. Unit tests may mock Webpack configuration.

## CI/CD build script

Typical npm scripts for CI builds.

```json
{
  "scripts": {
    "build:dev": "webpack --mode development",
    "build:prod": "webpack --mode production",
    "build:ci": "CI=true npm run build:prod",
    "test": "jest --coverage",
    "lint": "eslint src/**/*.js"
  }
}
```

Output:

```
CI runs: npm run lint && npm run test && npm run build:ci
```

## Analyze bundles in CI

Use webpack-bundle-analyzer to generate visual reports of bundle composition. Store reports as CI artifacts. Set bundle size limits and fail builds if exceeded. This catches performance regressions early.

Quick check

**Quiz:** Why analyze bundles in CI?

- [x] To catch performance regressions early.
- [ ] To make builds faster.
- [ ] To reduce deployment time.

*Answer:* To catch performance regressions early.. Bundle analysis in CI detects size increases and performance issues before code reaches production.