Laravel Elixir Babel

0.2.0 verified Fri May 01 auth: no javascript deprecated

Laravel Elixir extension for transpiling ES6 JavaScript to ES5 using Babel. Version 0.2.0 is the latest stable release, last updated in 2015. This package allows mix.babel() calls in Laravel's Gulpfile to compile ES6 code with optional sourcemaps. It is part of the legacy Laravel Elixir ecosystem (v5/6) and is not compatible with Laravel Mix or modern build workflows. No longer maintained.

Common errors

error Error: Cannot find module 'laravel-elixir' ↓

cause Missing required peer dependency laravel-elixir.

fix

Install laravel-elixir: npm install laravel-elixir --save-dev

error mix.babel is not a function ↓

cause The package require('laravel-elixir-babel') is missing or placed incorrectly.

fix

Add require('laravel-elixir-babel') after requiring elixir.

error SyntaxError: Unexpected token import ↓

cause ES6 import syntax used inside Gulpfile or source files without Babel configuration.

fix

Ensure Babel is configured via .babelrc or use CommonJS require() in Gulpfile.

Warnings

deprecated Package is unmaintained since 2015. Babel has evolved significantly (v6, v7) and this extension does not support modern Babel configurations. ↓

fix Use Laravel Mix with Webpack (laravel-mix) instead, which includes Babel via mix.js().

gotcha Does not work with Laravel Mix or Laravel 5.4+; only compatible with the old Laravel Elixir (v5/6) and Gulp. ↓

fix Upgrade to Laravel Mix and use mix.js() for Babel transpilation.

gotcha Sourcemaps may not work correctly in all browsers or tools due to outdated gulp-babel integration. ↓

fix Set sourceMaps: true in options but verify with browser developer tools.

gotcha Cannot transpile multiple files at once; only a single entry file is supported per call. ↓

fix Use elixir.scripts() combined with Babel CLI or switch to Laravel Mix.

Install

npm install laravel-elixir-babel

yarn add laravel-elixir-babel

pnpm add laravel-elixir-babel

Imports

default

wrong

import elixir from 'laravel-elixir'; // Not supported with gulpfile

correct

var elixir = require('laravel-elixir');
require('laravel-elixir-babel');

Must require the package to register mix.babel(). No exported symbol.

mix.babel

wrong

mix.babel('app.js').scripts() // Not chainable like elixir's default mix methods

correct

mix.babel('app.js')

Only accepts a string path or options object.

mix.babel (with options)

wrong

mix.babel(['app.js', 'other.js']) // Array not supported

correct

mix.babel('app.js', { srcDir: 'resources/js', output: 'public/js', sourceMaps: true })

Single file only; use elixir's scripts() for multiple files.

Quickstart

Install the package, require it in your Gulpfile, and call mix.babel() to transpile ES6 to ES5 using Babel.

var elixir = require('laravel-elixir');
require('laravel-elixir-babel');

elixir(function(mix) {
    mix.babel('app.js');
});