@bleushan/babel-preset-env NPM

@bleushan/babel-preset-env

About

This is a sane-ish attempt at adding some bells and whistles to @babel/preset-env. It integrates babel-transform-imports, babel-preset-minify and some commonjs module transforms as required by jest test environment.

Out of the box it works @babel/preset-env with spec, shippedProposals turned on and useBuiltIns set to usage. We also added @babel/plugin-proposal-optional-chaining, @babel/plugin-proposal-class-properties and @babel/plugin-proposal-decorators

Usage

Configuration works as expected by @babel/preset-env. To accommodate the additions to the preset we added the following:

Decorator support

Defaults to:

{
  "preset": [
    "@bleushan/babel-preset-env"
    {
      "decorators": true,
      "decoratorsBeforeExport": true
    }
  ]
}

to turn on legacy behavior:

{
  "preset": [
    "@bleushan/babel-preset-env"
    {
      "decorators": "legacy"
    }
  ]
}

babel-preset-minify

babel-preset-minify, by default, is turned on configured with:

{
  "preset": [
    "@bleushan/babel-preset-env"
    {
      "minify": {
        "keepFnName": true,
        "keepClassName": true,
        "tdz": true
      }
    }
  ]
}

to turn it off:

{
  "preset": [
    "@bleushan/babel-preset-env"
    {
      "minify": false
    }
  ]
}

It also accepts some per environment configuration like so:

{
  "preset": [
    "@bleushan/babel-preset-env"
    {
      "minify": {
        "env": {
          "production": {
            "keepFnName": true,
            "keepClassName": true
          }
        }
      }
    }
  ]
}

This also turn off minification for all other environments. To turn it back on with our defaults:

{
  "preset": [
    "@bleushan/babel-preset-env"
    {
      "minify": {
        "useDefaults": true,
        "env": {
          "production": {
            "keepFnName": false,
            "keepClassName": false
          }
        }
      }
    }
  ]
}

Or if you'd like use some baseline config:

{
  "preset": [
    "@bleushan/babel-preset-env"
    {
      "minify": {
        "keepFnName": false,
        "keepClassName": false,
        "env": {
          "development": {
            "keepFnName": true,
            "keepClassName": true
          }
        }
      }
    }
  ]
}

For more information about configuration options see the preset doc

Caveats

Minification is turned off on test environment because it messed up jest mocking.

babel-plugin-transform-imports

By default we provide mappings for ramda, lodash, lodash/fp. To add an entry:

{
  "preset": [
    "@bleushan/babel-preset-env"
    {
      "imports": {
        "mappings": {
          "react-bootstrap": {
            "transform": "react-bootstrap/lib/${member}",
            "preventFullImport": true
          }
        }
      }
    }
  ]
}

to add a bunch of entries:

{
  "preset": [
    "@bleushan/babel-preset-env"
    {
      "imports":  {
        "mappings": {
          "react-bootstrap": {
            "transform": "react-bootstrap/lib/${member}",
            "preventFullImport": true
          },
          "my-library\/?(((\\w*)?\/?)*)": {
            "transform": "my-library/${1}/${member}",
            "preventFullImport": true
          }
        }
      }
    }
  ]
}

Please refer to babel-plugin-transform-imports documentation for how to configure entries.