af-webpack

1.14.9 verified Sat Apr 25 auth: no javascript deprecated

Internal webpack configuration wrapper used by Ant Financial and UmiJS. Version 1.14.9 is the latest stable release, but active development has moved to the Utoopack bundler within UmiJS v4+. Originally designed to abstract webpack complexities, it is now effectively superseded by utoopack. Key differentiator: provides a unique, opinionated webpack interface tailored for Ant Financial's ecosystem.

Common errors

error Error: Cannot find module 'af-webpack' ↓

cause Package not installed or version mismatch.

fix

npm install af-webpack@1.14.9 --save-dev

error TypeError: getConfig is not a function ↓

cause Incorrect import (default instead of named).

fix

Use import { getConfig } from 'af-webpack' instead of import getConfig from 'af-webpack'.

Warnings

deprecated af-webpack is deprecated in favor of utoopack. New projects should use UmiJS v4+ which bundles utoopack. ↓

fix Migrate to UmiJS v4+ and use utoopack or directly use webpack 5.

breaking Incompatible with webpack 5 without modifications. af-webpack was designed for webpack 4 and may not work out-of-the-box with webpack 5. ↓

fix Use webpack 4 or manually adapt configurations for webpack 5 compatibility.

gotcha Configuration keys may differ from standard webpack. For example, `useHash` instead of `filename: '[hash]'`. ↓

fix Refer to af-webpack documentation for its unique configuration schema.

Install

npm install af-webpack

yarn add af-webpack

pnpm add af-webpack

Imports

Config

wrong

const { Config } = require('af-webpack')

correct

import { Config } from 'af-webpack'

ESM-only; not available as default export.

getUserConfig

wrong

import getUserConfig from 'af-webpack'

correct

import { getUserConfig } from 'af-webpack'

Named export, not a default export.

getConfig
```
import { getConfig } from 'af-webpack'
```
Use this for programmatic access to the generated webpack config.

Quickstart

Demonstrates generating a webpack configuration object using af-webpack's getConfig function.

import { getConfig } from 'af-webpack';

const config = getConfig({
  cwd: process.cwd(),
  entry: {
    app: './src/index.js',
  },
  output: {
    path: './dist',
    filename: '[name].[hash].js',
  },
  env: process.env.NODE_ENV || 'development',
});

// config is a webpack configuration object
console.log(config);