Babel Plugin Import Glob

Babel plugin to enable importing modules using glob patterns.

Usage

Given the following file structure:

├── images
│   ├── cat.webp
│   └── dog.webp
└── videos
    ├── example-1.mp4
    └── example-2.mp4

Simple

import { cat, dog } from './images/*.webp'

Alias

import { cat as c, dog as d } from './images/*.webp'

Default

import videos from './videos/*.mp4'

console.log(videos['example-1'])

Namespace

import * as videos from './videos/*.mp4'

console.log(videos['example-1'])

Install

$ npm install @jteppinette/babel-plugin-import-glob

Configuration

This plugin simply needs to be added to the Babel plugins array.

Here is a simple bare-bones babel configuration file which only supports this singular plugin.

.babelrc

{
  "plugins": ["@jteppinette/babel-plugin-import-glob"]
}

History

This repo was originally forked from and inspired by novemberborn/babel-plugin-import-glob. All license and git commits have been kept intact.

The origin repo mentioned above had stagnated for many years and was missing a features that I needed:

• You could not import the default export.
• Namespace import keys were transformed into valid identifiers instead of simply using their wildcard path names.

While I do not think we would ever merge the two, I would be open to the idea.

Development

Required Software

• direnv
• git
• nvm
• pre-commit

Getting Started

Setup

$ nvm install 16
$ direnv allow
$ pre-commit install
$ npm install

Test

$ npm test

Publishing

The publish process is automated by GitHub Actions. Once a release is created (at the end of these steps), the package will be published to the private GitHub NPM Registry.

1. Bump version, commit, and tag:

   $ npm run version:<major|minor|patch>

2. Commit the changes, tag the commit, and push the tags:

   $ git push origin main --tags

3. Convert the tag to a release in GitHub.

   $ open "https://github.com/jteppinette/babel-plugin-import-glob/releases/new?tag=<tag>"