@autoguru/babel-preset

@autoguru/babel-preset

AutoGuru's org-wide Babel set of presets and plugins.

Usage

yarn add --dev @autoguru/babel-preset \
	@babel/core

Then, in your babel.config.js, or .babelrc file:

module.exports = {
	presets: [
		'@autoguru/babel-preset/web', // for browser based targets
		'@autoguru/babel-preset/react', // additional presets for web based react projects
	],
};

Presets

• @autoguru/babel-preset is merely an alias of @autoguru/babel-preset/web.

• @autoguru/babel-preset/node is for node based targets.

  • version (default: current) - the version of node you're targeting
  • modules (default: commonjs) - what module transformations to apply.
  • debug (default: isProduction) - a boolean indicating if you want debug information from @babel/preset-env.
  • corejs (default: 3) - The version of core-js to use.

• @autoguru/babel-preset/web is used for browser based targets, which adds typical transformations needed to support esnext features on older browsers. This will look for a browserslist config file up the tree.

  • modules (default: false) - if you require module transformations. False is default as we use webpack's bundling system and want naked esmodules.
  • debug (default: isProduction) - a boolean indicating if you want debug information from @babel/preset-env.
  • corejs (default: 3) - The version of core-js to use.

• @autoguru/babel-preset/react is for React based projects, including transformations for JSX. Also hoists FunctionComponents to the root, where it can. See @babel/plugin-transform-react-constant-elements . You can use this alongside @autoguru/babel-preset/web.