alias-dirs v0.0.11

alias-dirs

Automically creates aliased directories for babel! No more relative path traversing in babel like so:

import ExampleComponent from "../../../../../components/ExampleComponent"

Instead, with the help of the babel-plugin-module-resolver, this package automatically creates aliases to root-level . directories and top-level directories within the src directory... so you don't have to:

import ExampleComponent from "~components/ExampleComponent"

If you add a folder to one of these directories while developing, not a problem, simply restart the node service and the folder will be automatically aliased!

Installation

Usage

Props

Advanced Usage

Alias Symbols

Ignore Directories

Pathing

Debugging

Example

Report Bugs

Feature Requests

License

Installation

npm i -D alias-dirs

or

yarn -D alias-dirs

Usage

babel.config.js (must be a .js file)

const aliasDirs = require("alias-dirs")

module.exports = api => {
  api.cache.using(() => process.env.NODE_ENV)

  return {
    presets: [...],
    plugins: [
      [
        "module-resolver",
        {
          alias: aliasDirs()
        }
      ]
    ]
  }
}

And you're all set! Now you can import a ~root directory from within any nested .js files:

import "~styles"
import ExampleComponent from "~components/Example" 
import ExampleContainer from "~containers/Example"

Props

The following props are accepted by aliasDirs():

Advanced Usage

Alias Symbols

By default this package will alias all directories with a tilde ~.

If you wish to override the predefined alias, then you can supply a string to the alias property.

For example:

aliasDirs({ alias: "$" })

WARNING: This module will not play well with public or private npm @ name-spaced packages. Aliasing with an empty string "" or with the private @ symbol is discouraged and not recommended as it may conflict with a node_module package. A warning will be shown if an empty string or @ is used. If you want to supress warnings, then add suppressWarnings: true property. As such, use at your own risk.

Ignore Directories

By default this package will ignore the following directories:

build
config
coverage
cypress
dist
env
public

In addition, these directories will also be automatically ignored by enforcement:

^[.]/ // any directories with "." in their name
node_modules

If you wish to override the defaults, then you must supply an array of string directory names to ignoreDirectories:

For example:

// this will override the default and ignore ANY directories named "secret"
aliasDirs({ ignoreDirectories: ["secret"] })

If you want to keep the default ignored directories and extend from them, then you can utilize the predefined aliasDirs.ignoreDirectories array.

For example:

const aliasDirs = require("../index")

module.exports = api => {
  api.cache.using(() => process.env.NODE_ENV)

  return {
    presets: [...],
    plugins: [
      [
        "module-resolver",
        {
          alias: aliasDirs({
            ignoreDirectories: [ ...aliasDirs.ignoreDirectories, "components" ]
          })
        }
      ]
    ]
  }
}

Pathing

By default, this package will only alias root-level directories within the project's root directory . and top-level directories within the ./src directory.

If you wish to override the default paths, then you can supply an array of root-level relative string paths to the paths property (do NOT include trailing slashes).

For example:

// this traverses all subdirectories within "./server", ignoring the root "." and "./src" directories
aliasDirs({ paths: ["./server"] })

Debugging

If you want to make sure your directories are being properly ignored/aliased, then add a debug: true property. This will display a console log of: the traversed paths, the alias, the ignored directories, and the resulting aliased directories.

For example:

aliasDirs({ debug: true })

Example

This package comes with a very simple example.

To run it, clone the repo: git clone git@github.com:mattcarlotta/alias-dirs.git

Install the example dependencies: cd example && npm i or cd example && yarn

Run the example: npm run example or yarn example

Feature Requests

Have a feature you want included or believe the package is missing something? You can either fork the repo, commit changes, and submit a new PR (please include relevant .tests.js files and run npm run test:cov or yarn test:cov to make sure the code is covered) or you can submit a feature request.

Report bugs

If you run into any issues, please fill out a bug report.

⚠️ NOTE: Please provide a reproducible codesandbox example of the bug(s) you're experiencing. Issues that don't provide a reproducible example may be ignored.

License

alias-dirs is MIT licensed.