https://github.com/egoist/babel-plugin-webpack-chunkname

Automatically set the chunkname for dynamic imports
https://github.com/egoist/babel-plugin-webpack-chunkname

webpack

Last synced: about 1 year ago
JSON representation

Automatically set the chunkname for dynamic imports

• Host: GitHub
• URL: https://github.com/egoist/babel-plugin-webpack-chunkname
• Owner: egoist
• License: mit
• Created: 2017-12-28T14:59:18.000Z (over 8 years ago)
• Default Branch: master
• Last Pushed: 2022-12-07T09:17:01.000Z (over 3 years ago)
• Last Synced: 2025-04-15T01:15:42.022Z (about 1 year ago)
• Topics: webpack
• Language: JavaScript
• Homepage:
• Size: 412 KB
• Stars: 36
• Watchers: 3
• Forks: 2
• Open Issues: 17
• Metadata Files:
  • Readme: README.md
  • License: LICENSE

Awesome Lists containing this project

README

          

# babel-plugin-webpack-chunkname

[![NPM version](https://img.shields.io/npm/v/babel-plugin-webpack-chunkname.svg?style=flat)](https://npmjs.com/package/babel-plugin-webpack-chunkname) [![NPM downloads](https://img.shields.io/npm/dm/babel-plugin-webpack-chunkname.svg?style=flat)](https://npmjs.com/package/babel-plugin-webpack-chunkname) [![CircleCI](https://circleci.com/gh/egoist/babel-plugin-webpack-chunkname/tree/master.svg?style=shield)](https://circleci.com/gh/egoist/babel-plugin-webpack-chunkname/tree/master)  [![donate](https://img.shields.io/badge/$-donate-ff69b4.svg?maxAge=2592000&style=flat)](https://github.com/egoist/donate) [![chat](https://img.shields.io/badge/chat-on%20discord-7289DA.svg?style=flat)](https://chat.egoist.moe)

## Install

```bash

yarn add babel-plugin-webpack-chunkname

```

## Usage

With `.babelrc`:

```json

{

  "plugins": [

    "webpack-chunkname"

  ]

}

```

And it does this:

```js

import('./pages/Home')

      ↓ ↓ ↓ ↓ ↓ ↓

import( /* webpackChunkName: 'pages/Home' */'./pages/Home')

```

And if you're using dynamic imports:

```js

import(`./pages/${name}`)

      ↓ ↓ ↓ ↓ ↓ ↓

import( /* webpackChunkName: 'pages/[request]' */`./pages/${name}`)

```

Or using placeholder:

```js

import(/* webpackChunkName: "__CHUNK_NAME__" */ `./foo`)

      ↓ ↓ ↓ ↓ ↓ ↓

import(/* webpackChunkName: "foo" */ `./foo`)

```

## Options

#### getChunkName

- __Type__: `(imported: string) => string`

- __Default__: `imported => imported.replace(/^[./]+|(\.js$)/g, '')`

## Contributing

1. Fork it!

2. Create your feature branch: `git checkout -b my-new-feature`

3. Commit your changes: `git commit -am 'Add some feature'`

4. Push to the branch: `git push origin my-new-feature`

5. Submit a pull request :D

## Author

**babel-plugin-webpack-chunkname** © [EGOIST](https://github.com/egoist), Released under the [MIT](./LICENSE) License.


Authored and maintained by EGOIST with help from contributors ([list](https://github.com/egoist/babel-plugin-webpack-chunkname/contributors)).

> [egoist.moe](https://egoist.moe) · GitHub [@EGOIST](https://github.com/egoist) · Twitter [@_egoistlily](https://twitter.com/_egoistlily)