├── .npmrc ├── .gitignore ├── .eslintrc ├── .travis.yml ├── LICENSE.md ├── package.json ├── CHANGELOG.md ├── index.js └── README.md /.npmrc: -------------------------------------------------------------------------------- 1 | package-lock=false 2 | -------------------------------------------------------------------------------- /.gitignore: -------------------------------------------------------------------------------- 1 | # gitignore 2 | 3 | node_modules 4 | 5 | # Only apps should have lockfiles 6 | package-lock.json 7 | yarn.lock 8 | npm-shrinkwrap.json 9 | -------------------------------------------------------------------------------- /.eslintrc: -------------------------------------------------------------------------------- 1 | { 2 | "root": true, 3 | 4 | "extends": "airbnb-base", 5 | 6 | "rules": { 7 | "global-require": 0, 8 | "strict": ["error", "global"] 9 | }, 10 | "parserOptions": { 11 | "sourceType": "script" 12 | }, 13 | } 14 | -------------------------------------------------------------------------------- /.travis.yml: -------------------------------------------------------------------------------- 1 | language: node_js 2 | os: 3 | - linux 4 | node_js: 5 | - "10" 6 | - "8" 7 | - "6" 8 | before_install: 9 | - 'nvm install-latest-npm' 10 | script: 11 | - 'if [ -n "${PRETEST-}" ]; then npm run pretest ; fi' 12 | - 'if [ -n "${POSTTEST-}" ]; then npm run posttest ; fi' 13 | - 'if [ -n "${COVERAGE-}" ]; then npm run coverage ; fi' 14 | - 'if [ -n "${TEST-}" ]; then npm run tests-only ; fi' 15 | sudo: false 16 | env: 17 | - TEST=true 18 | matrix: 19 | fast_finish: true 20 | include: 21 | - node_js: "node" 22 | env: PRETEST=true 23 | allow_failures: 24 | - os: osx 25 | - env: TEST=true ALLOW_FAILURE=true 26 | -------------------------------------------------------------------------------- /LICENSE.md: -------------------------------------------------------------------------------- 1 | MIT License 2 | 3 | Copyright (c) 2015 Airbnb 4 | 5 | Permission is hereby granted, free of charge, to any person obtaining a copy of this software and associated documentation files (the "Software"), to deal in the Software without restriction, including without limitation the rights to use, copy, modify, merge, publish, distribute, sublicense, and/or sell copies of the Software, and to permit persons to whom the Software is furnished to do so, subject to the following conditions: 6 | 7 | The above copyright notice and this permission notice shall be included in all copies or substantial portions of the Software. 8 | 9 | THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE. 10 | -------------------------------------------------------------------------------- /package.json: -------------------------------------------------------------------------------- 1 | { 2 | "name": "babel-preset-airbnb", 3 | "version": "5.0.0", 4 | "description": "A babel preset for transforming your JavaScript for Airbnb", 5 | "main": "index.js", 6 | "author": "Josh Perez ", 7 | "repository": { 8 | "type": "git", 9 | "url": "git@github.com:airbnb/babel-preset-airbnb.git" 10 | }, 11 | "keywords": [ 12 | "babel", 13 | "es6", 14 | "es2015", 15 | "javascript" 16 | ], 17 | "license": "MIT", 18 | "dependencies": { 19 | "@babel/helper-plugin-utils": "^7.8.3", 20 | "@babel/plugin-proposal-nullish-coalescing-operator": "^7.8.3", 21 | "@babel/plugin-proposal-numeric-separator": "^7.8.3", 22 | "@babel/plugin-proposal-object-rest-spread": "^7.9.0", 23 | "@babel/plugin-proposal-optional-catch-binding": "^7.8.3", 24 | "@babel/plugin-proposal-optional-chaining": "^7.9.0", 25 | "@babel/plugin-transform-classes": "^7.9.2", 26 | "@babel/plugin-transform-exponentiation-operator": "^7.8.3", 27 | "@babel/plugin-transform-member-expression-literals": "^7.8.3", 28 | "@babel/plugin-transform-property-literals": "^7.8.3", 29 | "@babel/plugin-transform-property-mutators": "^7.8.3", 30 | "@babel/plugin-transform-runtime": "^7.9.0", 31 | "@babel/plugin-transform-template-literals": "^7.8.3", 32 | "@babel/preset-env": "^7.9.0", 33 | "@babel/preset-react": "^7.9.4", 34 | "babel-plugin-transform-react-remove-prop-types": "^0.4.24" 35 | }, 36 | "peerDependencies": { 37 | "@babel/core": "^7.0.0", 38 | "@babel/runtime": "^7.0.0" 39 | }, 40 | "devDependencies": { 41 | "@babel/core": "^7.0.0", 42 | "@babel/runtime": "^7.0.0", 43 | "eslint": "^5.16.0", 44 | "eslint-config-airbnb-base": "^13.1.0", 45 | "eslint-plugin-import": "^2.17.3", 46 | "safe-publish-latest": "^1.1.2" 47 | }, 48 | "scripts": { 49 | "prepublish": "safe-publish-latest", 50 | "pretest": "npm run lint", 51 | "test": "npm run tests-only", 52 | "tests-only": "node . && echo 'parsed successfully'", 53 | "lint": "eslint ." 54 | } 55 | } 56 | -------------------------------------------------------------------------------- /CHANGELOG.md: -------------------------------------------------------------------------------- 1 | # Change Log 2 | 3 | All notable changes to this project will be documented in this file. 4 | This project adheres to [Semantic Versioning](http://semver.org/). 5 | 6 | ## [5.0.0] - 2020.04.02 7 | * [Breaking] Update browser targets: Chrome 35 -> 40, Edge 14 -> 18, IE 9 -> 11, Firefox 52 -> 72, Safari 8 -> 12, Android 30 -> 35. 8 | * [Breaking] Removed JScript support (IE 6-8). 9 | 10 | ## [4.5.0] - 2020.04.02 11 | * [New] Add `@babel/plugin-proposal-numeric-separator` and `@babel/plugin-proposal-optional-catch-binding` (#62) 12 | * [Deps] Update all to latest versions. 13 | 14 | ## [4.4.0] - 2019.11.20 15 | * [New] Add `transformRuntime` option (#60) 16 | 17 | ## [4.3.0] - 2019.11.15 18 | * [New] Add `runtimeHelpersUseESModules` option (#59) 19 | 20 | ## [4.2.0] - 2019.11.14 21 | * [New] Add `@babel/plugin-proposal-nullish-coalescing-operator` and `@babel/plugin-proposal-optional-chaining` (#58) 22 | 23 | ## [4.1.0] - 2019.10.3 24 | * [New] Allow specifying the Babel runtime version 25 | 26 | ## [4.0.1] - 2019.06.26 27 | * update license to MIT 28 | 29 | ## [4.0.0] - 2019.06.18 30 | * restore breaking changes from v3.3.0 and v3.3.1 31 | 32 | ## [3.3.2] - 2019.06.18 33 | * Revert breaking changes from v3.3.0 and v3.3.1 34 | 35 | ## [3.3.1] - 2019.06.18 36 | * [Fix] Use esm runtime helpers only when `modules === false` (#52) 37 | 38 | ## [3.3.0] - 2019.06.18 39 | * [New] Use @babel/plugin-transform-runtime for helpers (#51) 40 | 41 | ## [3.2.1] - 2019-03-19 42 | * [Fix] Correct default targets (explorer -> ie, and remove ucandroid) (#50) 43 | 44 | ## [3.2.0] - 2018-12-14 45 | * [New] add `looseClasses` option to compile classes in loose mode (#46) 46 | * [New] infer default value of `jscript` option from explorer target version (#47) 47 | 48 | ## [3.1.0] - 2018-12-13 49 | * [New] add `jscript` option to disable JScript transformation (#45) 50 | 51 | ## [3.0.1] - 2018-10-08 52 | * [Fix] the env preset only accepts `false` or a string, not explicit options 53 | 54 | ## [3.0.0] - 2018-10-08 55 | * [Breaking] update to babel 7 (#37) 56 | * [New] add support to supply the react preset's "development" option 57 | 58 | ## [2.6.0] - 2018-08-29 59 | * [New] Add `removePropTypes` option (#36) 60 | 61 | ## [2.5.3] - 2018-07-26 62 | * [Fix] [Deps] add missing `babel-plugin-transform-strict-mode` (#35) 63 | 64 | ## [2.5.2] - 2018-07-15 65 | * [Fix] add strict mode for real 66 | * [Docs] Update for ES2018 67 | 68 | ## [2.5.1] - 2018-06-15 69 | * [Fix] partial revert of #31; set strictMode to true 70 | 71 | ## [2.5.0] - 2018-06-15 72 | * [New] transform ES5 property mutators 73 | * [New/Fix] set "strict" to true (#31) 74 | * [Deps] update `babel-preset-env`, `babel-plugin-transform-object-rest-spread`, `babel-plugin-transform-es2015-modules-commonjs`, `object.assign` 75 | 76 | ## [2.4.0] - 2017-06-28 77 | * [New] Added an option to toggle debug mode (#18) 78 | 79 | ## [2.3.3] - 2017-06-20 80 | 81 | * Switches from `babel-preset-es2015` to `babel-preset-env`. 82 | Allows targeting of specific environments. 83 | -------------------------------------------------------------------------------- /index.js: -------------------------------------------------------------------------------- 1 | 'use strict'; 2 | 3 | const { declare } = require('@babel/helper-plugin-utils'); 4 | 5 | const defaultTargets = { 6 | android: 35, 7 | chrome: 40, 8 | edge: 18, 9 | ie: 11, 10 | firefox: 72, 11 | safari: 12, 12 | }; 13 | 14 | function buildTargets({ additionalTargets }) { 15 | return Object.assign({}, defaultTargets, additionalTargets); 16 | } 17 | 18 | module.exports = declare((api, options) => { 19 | // see docs about api at https://babeljs.io/docs/en/config-files#apicache 20 | api.assertVersion('^7.0.0'); 21 | 22 | const { 23 | modules = 'auto', 24 | targets = buildTargets(options), 25 | removePropTypes, 26 | looseClasses = false, 27 | runtimeVersion, 28 | runtimeHelpersUseESModules = !modules, 29 | transformRuntime = true, 30 | } = options; 31 | 32 | if (typeof modules !== 'boolean' && modules !== 'auto') { 33 | throw new TypeError('babel-preset-airbnb only accepts `true`, `false`, or `"auto"` as the value of the "modules" option'); 34 | } 35 | 36 | const debug = typeof options.debug === 'boolean' ? options.debug : false; 37 | const development = typeof options.development === 'boolean' 38 | ? options.development 39 | : api.cache.using(() => process.env.NODE_ENV === 'development'); 40 | 41 | return { 42 | presets: [ 43 | [require('@babel/preset-env'), { 44 | debug, 45 | exclude: [ 46 | 'transform-async-to-generator', 47 | 'transform-template-literals', 48 | 'transform-regenerator', 49 | ], 50 | modules: modules === false ? false : 'auto', 51 | targets, 52 | }], 53 | [require('@babel/preset-react'), { development }], 54 | ], 55 | plugins: [ 56 | looseClasses ? [require('@babel/plugin-transform-classes'), { 57 | loose: true, 58 | }] : null, 59 | 60 | removePropTypes ? [require('babel-plugin-transform-react-remove-prop-types'), Object.assign({ 61 | mode: 'wrap', 62 | additionalLibraries: ['airbnb-prop-types'], 63 | ignoreFilenames: ['node_modules'], 64 | }, removePropTypes)] : null, 65 | 66 | [require('@babel/plugin-transform-template-literals'), { 67 | spec: true, 68 | }], 69 | require('@babel/plugin-transform-property-mutators'), 70 | require('@babel/plugin-transform-member-expression-literals'), 71 | require('@babel/plugin-transform-property-literals'), 72 | require('@babel/plugin-proposal-nullish-coalescing-operator'), 73 | require('@babel/plugin-proposal-numeric-separator'), 74 | require('@babel/plugin-proposal-optional-catch-binding'), 75 | require('@babel/plugin-proposal-optional-chaining'), 76 | [require('@babel/plugin-proposal-object-rest-spread'), { 77 | useBuiltIns: true, 78 | }], 79 | transformRuntime ? [require('@babel/plugin-transform-runtime'), { 80 | absoluteRuntime: false, 81 | corejs: false, 82 | helpers: true, 83 | regenerator: false, 84 | useESModules: runtimeHelpersUseESModules, 85 | version: runtimeVersion, 86 | }] : null, 87 | ].filter(Boolean), 88 | }; 89 | }); 90 | -------------------------------------------------------------------------------- /README.md: -------------------------------------------------------------------------------- 1 | # babel-preset-airbnb 2 | 3 | > A babel preset for transforming your JavaScript for Airbnb. 4 | 5 | Currently contains transforms for all [stage 4](https://tc39.github.io/ecma262/) (ES2018) and [stage 3](https://github.com/tc39/proposals#active-proposals) syntax that is permitted in the [Airbnb Style Guide](https://github.com/airbnb/javascript). Please note that if usage of a stage 3 proposal is not explicitly mentioned in the Airbnb Style Guide, then it will not be enabled here. Additionally, stage 4 syntax that is excluded is as follows: 6 | - generators: `regenerator-runtime` is too heavyweight for our use. 7 | - `async/await`: `regenerator-runtime` is too heavyweight for our use, and [async-to-promises](https://www.npmjs.com/package/babel-plugin-async-to-promises) is not yet complete enough to be safely used. 8 | - async iterators: depends on both generators and `async function`s 9 | - lifted template literal restrictions: we do not use tagged template literals, nor implement custom DSLs, otherwise we would enable this. 10 | 11 | ## Install 12 | 13 | ```sh 14 | $ npm install --save-dev babel-preset-airbnb 15 | ``` 16 | 17 | ## Usage 18 | 19 | ### Via `.babelrc` (Recommended) 20 | 21 | **.babelrc** 22 | 23 | ```json 24 | { 25 | "presets": ["airbnb"] 26 | } 27 | ``` 28 | 29 | ### Via CLI 30 | 31 | ```sh 32 | $ babel script.js --presets airbnb 33 | ``` 34 | 35 | ### Via Node API 36 | 37 | ```javascript 38 | require('@babel/core').transform('code', { 39 | presets: ['airbnb'] 40 | }); 41 | ``` 42 | 43 | ### Targeting Environments 44 | 45 | This module uses @babel/preset-env to target specific environments. 46 | 47 | Please refer to [@babel/preset-env#targets](https://babeljs.io/docs/en/babel-preset-env#targets) for a list of available options. 48 | 49 | For a list of browsers please see [browserlist](https://github.com/ai/browserslist). 50 | 51 | You may override our default list of targets by providing your own `targets` key. 52 | 53 | ```json 54 | { 55 | "presets": [["airbnb", { 56 | "targets": { 57 | "chrome": 50, 58 | "ie": 11, 59 | "firefox": 45 60 | } 61 | }]] 62 | } 63 | ``` 64 | 65 | The following transpiles only for Node v6. 66 | 67 | ```json 68 | { 69 | "presets": [["airbnb", { 70 | "targets": { 71 | "node": 6 72 | } 73 | }]] 74 | } 75 | ``` 76 | 77 | If you wish, you can also inherit our default list of browsers and extend them using `additionalTargets`. 78 | 79 | ```json 80 | { 81 | "presets": [["airbnb", { 82 | "additionalTargets": { 83 | "chrome": 42, 84 | "ie": 8 85 | } 86 | }]] 87 | } 88 | ``` 89 | 90 | You may override our default debug option by providing your own `debug` key. 91 | 92 | ```json 93 | { 94 | "presets": [["airbnb", { 95 | "debug": true 96 | }]] 97 | } 98 | ``` 99 | 100 | ## React Development Mode 101 | 102 | When `process.env.NODE_ENV` is `'development'`, [the `development` mode will be set for `@babel/preset-react`](https://babeljs.io/docs/en/babel-preset-react#development). 103 | 104 | You may override our default development option by providing your own boolean `development` key. 105 | 106 | ```json 107 | { 108 | "presets": [["airbnb", { 109 | "development": false 110 | }]] 111 | } 112 | ``` 113 | 114 | ## React PropTypes removal 115 | 116 | This preset can be configured to remove propTypes using [babel-plugin-transform-react-remove-prop-types](https://github.com/oliviertassinari/babel-plugin-transform-react-remove-prop-types) with the following default options: 117 | 118 | 119 | To enable this transformation with the default options, set the `removePropTypes` option to `true`: 120 | 121 | ```json 122 | { 123 | "presets": [["airbnb", { 124 | "removePropTypes": true 125 | }]] 126 | } 127 | ``` 128 | 129 | The default options that will be used are: 130 | 131 | ```js 132 | { 133 | mode: 'wrap', 134 | additionalLibraries: ['airbnb-prop-types'], 135 | ignoreFilenames: ['node_modules'], 136 | } 137 | ``` 138 | 139 | Default options can be overridden using the `removePropTypes` option. These options will be shallow-merged with the defaults: 140 | 141 | ```json 142 | { 143 | "presets": [["airbnb", { 144 | "removePropTypes": { 145 | "mode": "remove" 146 | } 147 | }]] 148 | } 149 | ``` 150 | 151 | For example, if you are using this plugin in a deployable app, you might want to use the remove mode for your production build (and disable this transform entirely in development for optimal build speeds). 152 | 153 | ## Classes loose mode 154 | 155 | By default, this preset will compile classes in normal mode. This is safer, but comes with a bundle size and runtime overhead. To [compile classes in loose mode](https://babeljs.io/docs/en/babel-plugin-transform-classes#loose), set the `looseClasses` option to `true`: 156 | 157 | ```json 158 | { 159 | "presets": [["airbnb", { 160 | "looseClasses": true, 161 | }]] 162 | } 163 | ``` 164 | 165 | The [risks of enabling loose classes are outlined in the Babel docs](https://babeljs.io/docs/en/babel-plugin-transform-classes#loose). 166 | 167 | ## Specifying a babel runtime version 168 | 169 | By default @babel/plugin-transform-runtime will [assume the oldest version of the runtime](https://github.com/babel/babel/blob/e6264a09921c60b8f18870d0a75678e4fa04f0f8/packages/babel-plugin-transform-runtime/src/index.js#L42) to avoid importing helpers that don't exist which would fail at runtime. This can result in newer helpers being inlined into modules (ex. objectSpread2) which increases bundle size. 170 | 171 | To avoid this you can configure the preset to use the same version of the runtime that's installed in your package.json. 172 | 173 | ex. If package.json has `"@babel/runtime": "^7.5.5"` then you can use: 174 | 175 | ```json 176 | { 177 | "presets": [["airbnb", { 178 | "runtimeVersion": "7.5.5", 179 | }]] 180 | } 181 | ``` 182 | 183 | Note that this will result in a runtime breakage if the version passed into the airbnb preset is newer than the version of the babel runtime actually being used at build time. 184 | 185 | ## Disabling `plugin-transform-runtime` 186 | 187 | You can use the `transformRuntime` option to disable [`@babel/plugin-transform-runtime`](https://babeljs.io/docs/en/babel-plugin-transform-runtime). Specifying `false` will disable the plugin. This option defaults to `true`. 188 | 189 | ## Specifying module transforms 190 | 191 | You can use the `modules` option to enable transformation of modules given to this preset: 192 | 193 | ```json 194 | { 195 | "presets": [["airbnb", { 196 | "modules": "auto" 197 | }]] 198 | } 199 | ``` 200 | 201 | Both `true` and the option default `auto` will not transform modules if ES6 module syntax is already supported by the environment, or `"commonjs"` otherwise. `false` will not transform modules. 202 | 203 | You can use the `runtimeHelpersUseESModules` option to prevent transformation of runtime helpers to CommonJS modules. 204 | 205 | ```json 206 | { 207 | "presets": [["airbnb", { 208 | "runtimeHelpersUseESModules": true 209 | }]] 210 | } 211 | ``` 212 | 213 | `true` will not transform runtime helpers to CommonJS modules. `false` will transform runtime helpers to CommonJS modules. The option defaults to `true` if `modules` is set to `false`, and `false` otherwise. 214 | --------------------------------------------------------------------------------