babel-plugin-transform-with

babel-plugin-transform-with

Babel plugin that turns with statements into strict-mode JS.

• Alternative strict-mode-compatible syntax
• Falls back to global variables if a variable is not available in the object
• Supports this references
• Supports nesting
• Supports return, break, continue
• Supports yield, await
• Supports arguments (unlikely to be supported)

Alternative syntax

Babel errors out on any with statements during parsing by default, which can be frustrating when eventually the code will be converted anyway. This plugin implements an escape hatch using comments:

with (obj || {}) {
  console.log(str);
}

// The `with` block above is equivalent to the following:

// @with
{
  obj || {};
  console.log(str);
}

This feature is enabled by default, but you could set alternative option to false to disable it.

Example output

with (obj || {}) {
  console.log(str);
}

var _ref = obj || {};

(function (console, str) {
  console.log(str);
})("console" in _ref ?
     _ref.console :
     typeof console !== "undefined" ?
       console :
       undefined,
   "str" in _ref ?
     _ref.str :
     typeof str !== "undefined" ?
       a :
       undefined);

Exclude variables

If there are certain variables that should be regarded as globals and excluded from the closure, there are two ways to make this possible.

The plugin accepts an exclude option that takes an array of excluded variable names. This option applies to all withs compiled, so it is usually more suitable to be used when the variable is a global, like Array, Object, process, or console.

If you want to tweak the excluded variables on a per-instance basis, you can use @with ignore annotation (which works for both with () {} construct and the alternative syntax):

var i = 0, j = 0, k = 0;
var obj = { i: 1, j: 1, k: 0 };

// @with exclude: i
with (obj) {
  console.log(i, j);
}

// @with exclude: i, j
with (obj) {
  console.log(i, j);
}

results in

var i = 0, j = 0, k = 0;
var obj = { i: 1, j: 1, k: 0 };

(function (console, j) {
  console.log(i, j);
})("console" in obj ? obj.console : typeof console !== "undefined" ? console : undefined, "j" in obj ? obj.j : typeof j !== "undefined" ? j : undefined);

(function (console) {
  console.log(i, j);
})("console" in obj ? obj.console : typeof console !== "undefined" ? console : undefined);