babel-plugin-alias-config

Babel 7 plugin for aliases

Usage no npm install needed!

<script type="module">
  import babelPluginAliasConfig from 'https://cdn.skypack.dev/babel-plugin-alias-config';
</script>

README

babel-plugin-alias-config

This Babel 7 plugin allows you to use webpack resolve aliases from alias configs in Babel.

Example

alias.config.js

var path = require('path');
...

module.exports = {
  ...
  alias: {
    '@libs': path.join(__dirname, '/myLibs/')
  }
  ...
};

or webpack.config.js

var path = require('path');
...

module.exports = {
    ...
    resolve: {
        ...
        alias: {
            '@libs': path.join(__dirname, '/myLibs/')
        }
    }
    ...
};

Code:

    const myLib = require('@libs/myLib');

Transpiles to:

    const myLib = require('/myLibs/myLib');

Installation

    $ npm install --save-dev babel-plugin-alias-config

Add the plugin to your .babelrc. Optionally, add a path to a webpack config file, otherwise the plugin will look for webpack.config.js or alias.config.js or app.config.js in the root where the build was run. Setting the config option will transform all alias destinations to be relative to the custom config.

    {
        "plugins": [
            "@babel/plugin-transform-strict-mode",
            "@babel/plugin-transform-parameters",
            "@babel/plugin-transform-destructuring",
            "@babel/plugin-transform-modules-commonjs",
            "@babel/plugin-proposal-object-rest-spread",
            "@babel/plugin-transform-spread",
            "@babel/plugin-proposal-export-default-from",
            "@babel/plugin-proposal-export-namespace-from"
        ],
        "env": {
            "test": {
                "plugins": [
                    [ "babel-plugin-alias-config", { "config": "./configs/webpack.config.test.js" } ]
                ]
            }
        }
    }

In this example, the plugin will only be run when NODE_ENV is set to test.

Notes