title: How to exclude file type from build in Angular?
body: <p>In an Angular 9 project, I am working with two environments: production &amp; mock.</p>
  
  <p>I want that:</p>
  
  <ul>
  <li><p>WHEN I run <code>ng build --prod</code></p></li>
  <li><p>THEN the mock files should not be included in the js bundle.</p></li>
  </ul>
  
  <p>I am using the extension <code>.mock.ts</code> for mock files and creating <code>mocks</code> folders so they are easier to filter.</p>
  
  <p>I think this can be done with webpack, but I can't make it :(</p>
  
  <p>Project <strong>structure</strong>:</p>
  
  <pre><code>|- app
    |- integration
      |- country
        |- mocks
          get-countries.mock.ts
        country.service.ts
      |- device
        |- mocks
          get-devices.mock.ts
        device.service.ts
  </code></pre>
  
  <p>This is the build configuration I have in my <strong>angular.json</strong> file:</p>
  
  <pre><code>"architect": {
      "build": {
        "builder": "@angular-devkit/build-angular:browser",
        "options": {
          ...
        },
        "configurations": {
          "production": {
            "fileReplacements": [
              {
                "replace": "src/environments/environment.ts",
                "with": "src/environments/environment.prod.ts"
              }
            ],
            "optimization": true,
            "outputHashing": "all",
            "sourceMap": false,
            "extractCss": true,
            "namedChunks": false,
            "aot": true,
            "extractLicenses": true,
            "vendorChunk": false,
            "buildOptimizer": true,
          },
          "mock": {
            "fileReplacements": [
              {
                "replace": "src/environments/environment.ts",
                "with": "src/environments/environment.mock.ts"
              }
            ]
          }
        }
      },
  }
  </code></pre>
  
  <p>And this is my <strong>webpack.config.js</strong>:</p>
  
  <pre class="lang-js prettyprint-override"><code>const path = require('path');
  
  module.exports = {
    mode: 'development',
    // make sure the source maps work
    devtool: 'eval-source-map',
    // webpack will transpile TS and JS files
    resolve: {
      extensions: ['.ts', '.js'],
    },
    output: {
      filename: 'bundle.js',
      path: path.resolve(__dirname, 'dist'),
    },
    module: {
      rules: [
        {
          test: /\.ts$/,
          exclude: ['/node_modules/', '/src/app/integration'],
          use: [
            {
              loader: 'ts-loader',
              options: {
                transpileOnly: true,
              },
            },
          ],
        },
      ],
    },
  };
  </code></pre>