Skip to content

Latest commit

 

History

History
199 lines (147 loc) · 3.64 KB

.README.md

File metadata and controls

199 lines (147 loc) · 3.64 KB

${pkg.name}

${badge('npm')} ${badge('npm-license')} ${badge('github-issues')}

${pkg.description}

${badge('nodei')}

${badge('travis-status')} ${badge('github-stars')} ${badge('github-forks')}

${badge('dependencies')} ${badge('devDependencies')}

Installation

$ npm i ${pkg.name}

or with yarn

$ yarn ${pkg.name}

Don't forget to save it in your project (use --save-dev or -D flag)

$ npm i -D ${pkg.name}

or with yarn

$ yarn add -D ${pkg.name}

Example

With the following folder structure:

|- index.js
|- actions
    |- action.a.js
    |- action_b.js
    |- sub_dir
        |- actionC.js

and with the following JS:

import actions from './actions';

will be compiled to:

const _dirImport = {};
import * as _actionA from "./actions/action.a";
import * as _actionB from "./actions/action_b";
_dirImport.actionA = _actionA;
_dirImport.actionB = _actionB;
const actions = _dirImport;

You can also import files recursively using double asterisk like this:

import actions from './actions/**';

will be compiled to:

const _dirImport = {};
import * as _actionA from "./actions/action.a";
import * as _actionB from "./actions/action_b";
import * as _actionC from "./actions/sub_dir/actionC";
_dirImport.actionA = _actionA;
_dirImport.actionB = _actionB;
_dirImport.actionC = _actionC;
const actions = _dirImport;

You can also import all the methods directly, using a single asterisk.

the following JS:

import actions from './actions/*';

will be compiled to:

const _dirImport = {};
import * as _actionA from "./actions/action.a";
import * as _actionB from "./actions/action_b";
for (let key in _actionA) {
  _dirImport[key === 'default' ? 'actionA' : key] = _actionA[key];
}

for (let key in _actionB) {
  _dirImport[key === 'default' ? 'actionB' : key] = _actionB[key];
}
const actions = _dirImport;

And you can use both, double and single asterisk, like this:

import actions from './actions/**/*';

will be compiled to:

const _dirImport = {};
import * as _actionA from "./actions/action.a";
import * as _actionB from "./actions/action_b";
import * as _actionC from "./actions/sub_dir/actionC";
for (let key in _actionA) {
  _dirImport[key === 'default' ? 'actionA' : key] = _actionA[key];
}

for (let key in _actionB) {
  _dirImport[key === 'default' ? 'actionB' : key] = _actionB[key];
}

for (let key in _actionC) {
  _dirImport[key === 'default' ? 'actionC' : key] = _actionC[key];
}
const actions = _dirImport;

Usage

Just add it to your .babelrc file

{
  "plugins": ["import-directory"]
}

And don't write the index.js ;)

Options

exts

By default, the files with the following extensions: ["js", "es6", "es", "jsx"], will be imported. You can change this using:

{
    "plugins": [
        ["wildcard", {
            "exts": ["js", "es6", "es", "jsx", "javascript"]
        }]
    ]
}

snakeCase

By default, the variables name would be in camelCase. You can change this using:

{
    "plugins": [
        ["wildcard", {
            "snakeCase": true
        }]
    ]
}

** result: action_a, action_b and action_c **

Scripts

${scripts()}

Dependencies

${dependencies()}

Contributing

Contributions welcome; Please submit all pull requests the against master branch. If your pull request contains JavaScript patches or features, you should include relevant unit tests. Please check the Contributing Guidelines for more details. Thanks!

Author

${author()}

License

${license()}