4.0.1 โ€ข Published 2 years ago

babel-plugin-filenamespace v4.0.1

Weekly downloads
1,226
License
MIT
Repository
github
Last release
2 years ago

Build Status Build status Coverage Status

Watch on GitHub Star on GitHub Tweet

๐Ÿ“„ Description

Directories and filenames are typically descriptive by nature so let's use them to namespace our code.

Think about unit test describe blocks, Storybook stories and Redux action types (DDD).

Node provides __dirname and __filename which are perfect for this, but with code bundling and client-side JS they lose their meaning. The purpose of this plugin is to give that meaning back.

// src/components/Button.test.js
describe(__filenamespace, () => {})
// is transformed into
describe('src/components/Button', () => {})

๐Ÿ“ฆ Install

npm install --save-dev babel-plugin-filenamespace

๐Ÿš€ Usage

Via .babelrc

{
  "plugins": [
    "filenamespace"
  ]
}

Via .eslintrc

{
  "globals": {
    "__filenamespace": false
  }
}

Then in any file you want a filename based namespace generated use the placeholder __filenamespace.

โš™๏ธ Options

Use Babel's plugin options by replacing the plugin string with an array of the plugin name and an object with the options:

  • root: (Default: project root)
    • Specify root directory relative to project src (e.g. src).
  • separator: (Default: "/")
    • Specify directory separator.
  • dropAllFilenames: (Default: false)
    • Setting to true will exclude all filenames and use directory structure only.
    • Note: files named index OR have a name that match the parent directory (file extention ignored) are always dropped, regardless of this setting, as they do not provide meaning.
  • dropExtensions: (Default: ".spec", ".test", ".story", ".stories")
    • Specify the extensions you want removed.
    • Note: file extension are always removed, these extensions are for removing extensions from common file naming conventions (e.g. path/to/file.test.js will transform to path/to/file).
  • customPlaceholders: (Default: [])
    • Specify custom placeholders, each with their own configuration (all above options) e.g. [{ "placeholder": "__testnamespace", "separator": "." }].

โœจ Examples

root:

{
  "plugins": [
    [
      "filenamespace",
      {
        "root": "app",
      }
    ]
  ]
}
// app/container/App/data/file.js
const namespace = __filenamespace;
// is transformed into
const namespace = 'container/App/data/file';

separator:

{
  "plugins": [
    [
      "filenamespace",
      {
        "separator": "๐Ÿ‘Œ"
      }
    ]
  ]
}
// app/container/App/data/file.js
const namespace = __filenamespace;
// is transformed into
const namespace = 'app๐Ÿ‘Œcontainer๐Ÿ‘ŒApp๐Ÿ‘Œdata๐Ÿ‘Œfile';

dropAllFilenames:

{
  "plugins": [
    [
      "filenamespace",
      {
        "dropAllFilenames": true
      }
    ]
  ]
}
// app/container/HomePage/Home.js
const namespace = __filenamespace;
// is transformed into
const namespace = 'app/container/HomePage';

dropExtensions:

{
  "plugins": [
    [
      "filenamespace",
      {
        "dropExtensions": [".test"]
      }
    ]
  ]
}
// app/container/HomePage/Home.test.js
const namespace = __filenamespace;
// is transformed into
const namespace = 'app/container/HomePage/Home';

customPlaceholders:

{
  "plugins": [
    [
      "filenamespace",
      {
        "separator": ".",
        "customPlaceholders": [
          {
            "placeholder": "__dotDot",
            "separator": ".."
          },
          {
            "placeholder": "__dotDotDot",
            "separator": "...",
            "root": "app",
            "dropAllFilenames": true
          }
        ]
      }
    ]
  ]
}
// app/container/App/data/file.js
const namespace = __filenamespace;
const dotDotNamespace = __dotDot;
const dotDotDotNamespace = __dotDotDot;
// is transformed into
const namespace = 'app.container.App.data.file';
const dotDotNamespace = 'app.container..App..data..file';
const dotDotDotNamespace = 'container...App...data';

๐Ÿค Contributing

Contributions, issues and feature requests are welcome. Feel free to check the Contributing page if you want to contribute.

๐Ÿ“ License

Copyright ยฉ 2019 Samuel Sharpe. This project is MIT licensed.

4.0.1

2 years ago

4.0.0

2 years ago

3.0.0

4 years ago

2.0.4

5 years ago

2.0.3

5 years ago

2.0.2

5 years ago

2.0.1

5 years ago

2.0.0

5 years ago

2.0.0-beta.1

5 years ago

2.0.0-beta.0

5 years ago

1.2.0

5 years ago

1.1.3

7 years ago

1.1.2

7 years ago

1.1.1

7 years ago

1.1.0

7 years ago

1.0.1

8 years ago

1.0.0

8 years ago

0.0.4

8 years ago

0.0.3

8 years ago

0.0.2

8 years ago

0.0.1

8 years ago