DEXTUploadX5 React Webpack Helper

Webpack helper package for dextuploadx5-react.

dextuploadx5-react requires the DX5 static files to be available at the runtime productPath.

This package automates that setup in Webpack projects. During development or production builds, it copies the DX5 files to the path that will be served as productPath and can also register that directory in devServer.

Features

• Exposes withDEXTUploadX5() to extend an existing Webpack config
• Automatically copies DX5 static files to the location served as productPath
• Works in both development and production Webpack workflows
• Can copy DX5 static files into the Webpack output directory
• Can copy DX5 static files into a separate public directory
• Can register static directories in webpack-dev-server

Requirements

• Webpack 5 or later
• [email protected] or later
• DEXTUploadX5 4.4.0.0 (beta) or later through dextuploadx5-react

Installation

npm install dextuploadx5-react
npm install -D dextuploadx5-react-webpack webpack

Install dextuploadx5-react-webpack as a devDependency because it is used in the Webpack build configuration, not in browser runtime code.

Quick Start

import path from "path";
import { withDEXTUploadX5 } from "dextuploadx5-react-webpack";

function createConfig() {
    return {
        entry: "./src/index.jsx",
        output: {
            path: path.resolve(process.cwd(), "dist"),
            filename: "bundle.js",
            clean: true
        }
    };
}

export default withDEXTUploadX5(createConfig(), {
    publicDir: path.resolve(process.cwd(), "public"),
    dx5DirName: "dx5"
});

With this configuration, the DX5 files are copied automatically so dextuploadx5-react can load them with productPath="/dx5/".

API

withDEXTUploadX5(webpackConfig, options?)

Returns a Webpack config with DX5 copy and serving behavior applied.

const config = withDEXTUploadX5(baseConfig, options);

Options

from?: string

Source DX5 directory.

• Default: node_modules/dextuploadx5-react/dist/dx5

dx5DirName?: string

Directory name used in output paths and URLs.

• Default: "dx5"

to?: string

Target directory inside the Webpack output when emitToOutput is enabled.

• Default: same value as dx5DirName

emitToOutput?: boolean

Copies DX5 files into the Webpack output using copy-webpack-plugin.

• Default: true

publicDir?: string

Absolute path of an external public directory.

When set, the helper copies DX5 files to publicDir/<dx5DirName> and also registers that directory with devServer.static.

This is useful when your application serves productPath from a public static directory such as public/dx5.

Typical Usage

Copy DX5 files into the Webpack output

import { withDEXTUploadX5 } from "dextuploadx5-react-webpack";

export default withDEXTUploadX5(baseConfig);

Copy DX5 files into public/dx5

import path from "path";
import { withDEXTUploadX5 } from "dextuploadx5-react-webpack";

export default withDEXTUploadX5(baseConfig, {
    publicDir: path.resolve(process.cwd(), "public"),
    dx5DirName: "dx5"
});

Notes

• This package is a build-time helper. It does not replace dextuploadx5-react.
• DX5 files are resolved from the installed dextuploadx5-react package first.
• If dextuploadx5-react cannot be resolved automatically, the helper falls back to process.cwd()/node_modules/dextuploadx5-react/dist/dx5.
• The purpose of this package is to remove the need to manage DX5 static file copying manually in Webpack projects.
• DEXTUploadX5 itself is not distributed through npm, so its required version is documented here instead of package.json.

Compatibility

| dextuploadx5-react-webpack | Minimum dextuploadx5-react | Minimum DEXTUploadX5 version | | --- | --- | --- | | 0.0.4 | 0.0.1 | 4.4.0.0 (beta) |

History

0.0.4

• Disabled injectScripts temporarily to avoid conflict with DEXTUploadX5Provider
• Updated README and packaging metadata for npm publishing

License

This package is free to use, including commercial use. Modification for internal use is allowed. Redistribution of modified versions is prohibited. DEXTUploadX5 itself is a commercial product and is not free to use under the same terms as DEXTUploadX5 React Webpack Helper.

See the LICENSE file for full terms.