• Stars
    star
    1,320
  • Rank 35,625 (Top 0.8 %)
  • Language
    JavaScript
  • License
    MIT License
  • Created about 10 years ago
  • Updated almost 2 years ago

Reviews

There are no reviews yet. Be the first to send feedback to the community and the maintainers!

Repository Details

Gulp plugin for Babel

This readme is for gulp-babel v8 + Babel v7 Check the 7.x branch for docs with Babel v6 usage

gulp-babel npm Build Status

Use next generation JavaScript, today, with Babel

Issues with the output should be reported on the Babel issue tracker.

Install

Install gulp-babel if you want to get the pre-release of the next version of gulp-babel.

# Babel 7
$ npm install --save-dev gulp-babel @babel/core @babel/preset-env

# Babel 6
$ npm install --save-dev gulp-babel@7 babel-core babel-preset-env

Usage

const gulp = require('gulp');
const babel = require('gulp-babel');

gulp.task('default', () =>
	gulp.src('src/app.js')
		.pipe(babel({
			presets: ['@babel/preset-env']
		}))
		.pipe(gulp.dest('dist'))
);

API

babel([options])

options

See the Babel options, except for sourceMaps and filename which is handled for you. Also, keep in mind that options will be loaded from config files that apply to each file.

Source Maps

Use gulp-sourcemaps like this:

const gulp = require('gulp');
const sourcemaps = require('gulp-sourcemaps');
const babel = require('gulp-babel');
const concat = require('gulp-concat');

gulp.task('default', () =>
	gulp.src('src/**/*.js')
		.pipe(sourcemaps.init())
		.pipe(babel({
			presets: ['@babel/preset-env']
		}))
		.pipe(concat('all.js'))
		.pipe(sourcemaps.write('.'))
		.pipe(gulp.dest('dist'))
);

Babel Metadata

Files in the stream are annotated with a babel property, which contains the metadata from babel.transform().

Example

const gulp = require('gulp');
const babel = require('gulp-babel');
const through = require('through2');

function logBabelMetadata() {
	return through.obj((file, enc, cb) => {
		console.log(file.babel.test); // 'metadata'
		cb(null, file);
	});
}

gulp.task('default', () =>
	gulp.src('src/**/*.js')
		.pipe(babel({
			// plugin that sets some metadata
			plugins: [{
				post(file) {
					file.metadata.test = 'metadata';
				}
			}]
		}))
		.pipe(logBabelMetadata())
)

Runtime

If you're attempting to use features such as generators, you'll need to add transform-runtime as a plugin, to include the Babel runtime. Otherwise, you'll receive the error: regeneratorRuntime is not defined.

Install the runtime:

$ npm install --save-dev @babel/plugin-transform-runtime
$ npm install --save @babel/runtime

Use it as plugin:

const gulp = require('gulp');
const babel = require('gulp-babel');

gulp.task('default', () =>
	gulp.src('src/app.js')
		.pipe(babel({
			plugins: ['@babel/transform-runtime']
		}))
		.pipe(gulp.dest('dist'))
);

License

MIT Š Sindre Sorhus

More Repositories

1

babel

🐠 Babel is a compiler for writing next generation JavaScript.
TypeScript
43,141
star
2

babel-loader

đŸ“Ļ Babel loader for webpack
JavaScript
4,824
star
3

minify

✂ī¸ An ES6+ aware minifier based on the Babel toolchain (beta)
JavaScript
4,391
star
4

babel-preset-env

PSA: this repo has been moved into babel/babel -->
JavaScript
3,500
star
5

babel-sublime

Syntax definitions for ES6 JavaScript with React JSX extensions.
JavaScript
3,256
star
6

babel-eslint

đŸ—ŧ A wrapper for Babel's parser used for ESLint (renamed to @babel/eslint-parser)
JavaScript
2,963
star
7

example-node-server

Example Node Server w/ Babel
JavaScript
2,844
star
8

babylon

PSA: moved into babel/babel as @babel/parser -->
JavaScript
1,714
star
9

babelify

Browserify transform for Babel
JavaScript
1,680
star
10

babel-upgrade

âŦ†ī¸ A tool for upgrading Babel versions (to v7): `npx babel-upgrade`
JavaScript
1,309
star
11

awesome-babel

😎A list of awesome Babel plugins, presets, etc.
864
star
12

babel-standalone

🎮 Now located in the Babel repo! Standalone build of Babel for use in non-Node.js environments, including browsers.
JavaScript
819
star
13

website

🌐 The Babel documentation website
TypeScript
749
star
14

preset-modules

A Babel preset that targets modern browsers by fixing engine bugs (will be merged into preset-env eventually)
JavaScript
739
star
15

kneden

Transpile ES2017 async/await to vanilla ES6 Promise chains: a Babel plugin
JavaScript
514
star
16

grunt-babel

Grunt plugin for Babel
JavaScript
437
star
17

proposals

✍ī¸ Tracking the status of Babel's implementation of TC39 proposals (may be out of date)
432
star
18

eslint-plugin-babel

An ESlint rule plugin companion to babel-eslint
JavaScript
389
star
19

generator-babel-boilerplate

A Yeoman generator to author libraries in ES2015 (and beyond!) for Node and the browser.
JavaScript
381
star
20

babel-time-travel

Time travel through babel transformations one by one (implemented in the Babel REPL now)
JavaScript
344
star
21

babel-polyfills

A set of Babel plugins that enable injecting different polyfills with different strategies in your compiled code.
TypeScript
330
star
22

babel-sublime-snippets

Next generation JavaScript and React snippets for Sublime
263
star
23

karma-babel-preprocessor

Karma plugin for Babel
JavaScript
167
star
24

ruby-babel-transpiler

Ruby Babel is a bridge to the JS Babel transpiler.
Ruby
159
star
25

babel-jest

Jest plugin for Babel (moved) ->
138
star
26

notes

â™Ŧ Notes from the @Babel Team (discuss in PRs)
122
star
27

generator-babel-plugin

Babel Plugin generator for Yeoman
JavaScript
118
star
28

babel-bridge

A placeholder package that bridges babel-core to @babel/core.
JavaScript
94
star
29

babel-bot

🤖 A helpful bot to automate common tasks on Babel Issues/PRs
JavaScript
75
star
30

babel-brunch

Brunch plugin for Babel
JavaScript
68
star
31

broccoli-babel-transpiler

Broccoli plugin for Babel
JavaScript
57
star
32

jade-babel

Jade plugin for Babel
JavaScript
40
star
33

sandboxes

Babel repl-like codesandbox: check out link =>
JavaScript
39
star
34

jekyll-babel

A Babel converter for Jekyll.
Ruby
34
star
35

acorn-to-esprima

(unmaintained) Converts acorn tokens to esprima tokens
JavaScript
33
star
36

babel-connect

Connect plugin for Babel
JavaScript
27
star
37

podcast.babeljs.io

The Babel Podcast site!
JavaScript
25
star
38

phabricator-to-github

A tool to migrate phabricator issues to github
JavaScript
24
star
39

actions

Babel specific github actions 🤖
JavaScript
24
star
40

rfcs

RFCs for changes to Babel
21
star
41

metalsmith-babel

A Metalsmith plugin to compile JavaScript with Babel
JavaScript
20
star
42

babel-configuration-examples

WIP
JavaScript
18
star
43

logo

Babel logo
15
star
44

duo-babel

Duo plugin for Babel
JavaScript
15
star
45

parser_performance

JavaScript
13
star
46

eslint-config-babel

ESLint config for all Babel repos
JavaScript
10
star
47

gobble-babel

Gobble plugin for Babel
JavaScript
9
star
48

babel-standalone-bower

Bower build of babel-standalone. See https://github.com/Daniel15/babel-standalone
JavaScript
9
star
49

eslint-plugin-babel-plugin

A set of eslint rules to enforce best practices in the development of Babel plugins.
JavaScript
8
star
50

babel-plugin-proposal-private-property-in-object

@babel/plugin-proposal-private-property-in-object, with an added warning for when depending on this package without explicitly listing it in dependencies or devDependencies
JavaScript
8
star
51

babel-archive

🗑 Packages that are deprecated or don't need to be updated
JavaScript
7
star
52

.github

Community health files for the Babel organization
7
star
53

flavortown

what else?
6
star
54

babel-test262-runner

Run test262 tests on Node 0.10 using Babel 7 and `core-js@3`.
JavaScript
6
star
55

babel-plugin-transform-async-functions

https://github.com/MatAtBread/fast-async/issues/46
4
star
56

phabricator-redirects

↩ī¸ Redirects for old phabricator urls
HTML
2
star
57

slack-invite-link

Source of slack.babeljs.io
1
star