# @automattic/wordpress-external-dependencies-plugin

> Webpack plugin to externalize WordPress dependencies

Latest version **1.0.0** (published 2019-04-10) · GPL-2.0-or-later license · 0 weekly downloads

## Install

```sh
npm install @automattic/wordpress-external-dependencies-plugin
pnpm add @automattic/wordpress-external-dependencies-plugin
yarn add @automattic/wordpress-external-dependencies-plugin
bun add @automattic/wordpress-external-dependencies-plugin
```

## Health

**Score 35/100 (D)** — status: abandoned.

Positive: no vulnerabilities; high maintenance score; popular repo.

Warnings: low downloads; no types; no esm support.

Negative: abandoned.

## Facts

| | |
|---|---|
| Version | 1.0.0 |
| Published | 2019-04-10 |
| First published | 2019-04-05 |
| Weekly downloads | 0 |
| License | GPL-2.0-or-later |
| TypeScript types | none |
| Module format | CommonJS |
| Dependencies | 2 |
| Unpacked size | 21.2 KB |
| Known vulnerabilities | 0 |
| Install scripts | no |
| GitHub stars | 12641 |
| Author | Jon Surrell |
| Maintainers | a8c, beaucollins, blowery, dchymko, elazzabi, enej, gwwar, hanifn, jeherve, joshbetz, jsnajdr, mjangda, nickdaugherty, ockham, quasistar, rodrigoia8c, sirreal, tug, undemian, vindl |
| Keywords | WordPress, Webpack |

## Links

- npm: https://www.npmjs.com/package/@automattic/wordpress-external-dependencies-plugin
- Repository: https://github.com/Automattic/wp-calypso
- Homepage: https://github.com/Automattic/wp-calypso/tree/master/packages/wordpress-external-dependencies-plugin
- Issues: https://github.com/Automattic/wp-calypso/issues
- npm.io page: https://npm.io/package/@automattic/wordpress-external-dependencies-plugin

## Dependencies (2)

- [webpack](https://npm.io/package/webpack.md) ^4.29.6
- [webpack-sources](https://npm.io/package/webpack-sources.md) ^1.3.0

## Alternatives

- [raw-loader](https://npm.io/package/raw-loader.md) — 4.3M weekly downloads
- [plop](https://npm.io/package/plop.md) — 1.4M weekly downloads
- [webpack-deadcode-plugin](https://npm.io/package/webpack-deadcode-plugin.md) — 80.3K weekly downloads
- [@storybook/preact-vite](https://npm.io/package/@storybook/preact-vite.md) — 54.2K weekly downloads
- [vite-plugin-transform](https://npm.io/package/vite-plugin-transform.md) — 2.4K weekly downloads

## Recent versions

- 1.0.0 (latest) — 2019-04-10
- 1.0.0-alpha.0 — 2019-04-05

## README

# @automattic/wordpress-external-dependencies-plugin

This webpack plugin serves two purposes:

- Externalize dependencies that are available as script dependencies on modern WordPress sites.
- Add a JSON file for each entrypoint that declares the WordPress script dependencies for the
  entrypoint.

This allows JavaScript bundles produced by webpack to leverage WordPress style dependency sharing
without an error-prone process of manually maintaining a dependency list.

Consult the [webpack website](https://webpack.js.org) for additional information on webpack concepts.

## Usage

### Webpack

Use this plugin as you would other webpack plugins:

```js
// webpack.config.js
const WordPressExternalDependenciesPlugin = require( '@automattic/wordpress-external-dependencies-plugin' );

module.exports = {
  // …snip
  plugins: [
    new WordPressExternalDependenciesPlugin(),
  ]
}
```

Each entrypoint in the webpack bundle will include JSON file that declares the WordPress script dependencies that should be enqueued.

For example:

```
// Source file entrypoint.js
import { Component } from '@wordpress/element';

// Webpack will produce the output output/entrypoint.js
/* bundle JS output */

// Webpack will also produce output/entrypoint.deps.json declaring script dependencies
['wp-element']
```

### WordPress

Enqueue your script as usual and read the script dependencies dynamically:

```php
$script_path      = 'path/to/script.js';
$script_deps_path = 'path/to/script.deps.json';
$script_dependencies = file_exists( $script_deps_path )
	? json_decode( file_get_contents( $script_deps_path ) )
	: array();
$script_url = plugins_url( $script_path, __FILE__ );
wp_enqueue_script( 'script', $script_url, $script_dependencies );
```

---
_Source: https://npm.io/package/@automattic/wordpress-external-dependencies-plugin · Machine-readable twin of the npm.io package page. Health data is recomputed on every publish._