swc-import-glob-array-plugin

SWC Import Glob Array Plugin

This plugin is a port of babel-plugin-import-glob-array from JavaScript to Rust for Speedy Web Compiler (SWC).

Before continuing, please understand that SWC plugins are distributed as WebAssembly binaries and are currently not backwards compatible, meaning that plugins may break frequently between versions. To ensure that you're using a version of this plugin that is compatible with your current @swc/core or next package(s), check out the compatibility table below.

Installation

Installation can be done via npm:

# npm
$ npm install --save-dev swc-import-glob-array-plugin

# yarn
$ yarn add -D swc-import-glob-array-plugin

# pnpm
$ pnpm add -D swc-import-glob-array-plugin

Then you'll add the plugin under jsc.experimental.plugins:

{
  "jsc": {
    "experimental": {
      "plugins": [
        [
          "swc-import-glob-array-plugin",
          {}
        ]
      ]
    }
  }
}

For more information on adding and configuration an SWC plugin, check out their documentation.

Usage

This plugin check the imports of each SWC file to determine if it contains a glob pattern. If it does, it will expand the single import to individual imports. As an example, let's say you have the following directory structure:

|- my-app
  |- docs
    |- hello.md
    |- world.md
  |- index.js

And index.js, which will get compiled by SWC, has the following import:

import docs from "./docs/*.md";

The single import will get parsed and expanded into:

import _iga1 from "./docs/hello.md";
import _iga2 from "./docs/world.md";

const docs = [ _iga1, _iga2 ];

Adding Import Metadata

In addition to expanding a single import, you can also import metadata information about where the file came from and what was imported via the special _importMeta property.

Using the example above, we can slightly modify our import statement:

import docs, { _importMeta as metadata } from "./docs/*.md";

Which will get parsed and expanded into:

import _iga1 from "./docs/hello.md";
import _iga2 from "./docs/world.md";

const docs = [ _iga1, _iga2 ];

const metadata = [
    {
        absolutePath: "/path/to/project/docs/hello.md",
        importedPath: "./docs/hello.md"
    },
    {
        absolutePath: "/path/to/project/docs/world.md",
        importedPath: "./docs/world.md"
    }
];

Compatibility

swc-import-glob-array-plugin	@swc/core
1.0.1	1.3.44 ~ 1.3.47
1.0.2	1.3.49 ~ 1.3.56