├── .gitignore ├── package.json ├── LICENSE ├── README.md └── index.js /.gitignore: -------------------------------------------------------------------------------- 1 | node_modules/ 2 | -------------------------------------------------------------------------------- /package.json: -------------------------------------------------------------------------------- 1 | { 2 | "name": "laravel-elixir-webpack", 3 | "version": "1.0.1", 4 | "description": "Laravel Elixir Webpack Extension", 5 | "main": "index.js", 6 | "scripts": { 7 | "test": "echo \"Error: no test specified\" && exit 1" 8 | }, 9 | "keywords": [ 10 | "laravel", 11 | "elixir", 12 | "webpack", 13 | "gulp" 14 | ], 15 | "author": { 16 | "name": "Joseph Cohen" 17 | }, 18 | "license": "MIT", 19 | "repository": { 20 | "type": "git", 21 | "url": "https://github.com/joecohens/laravel-elixir-webpack" 22 | }, 23 | "bugs": { 24 | "url": "https://github.com/joecohens/laravel-elixir-webpack/issues" 25 | }, 26 | "homepage": "https://github.com/joecohens/laravel-elixir-webpack", 27 | "dependencies": { 28 | "vinyl-named": "^1.1.0", 29 | "webpack-stream": "^3.1.0" 30 | } 31 | } 32 | -------------------------------------------------------------------------------- /LICENSE: -------------------------------------------------------------------------------- 1 | The MIT License (MIT) 2 | 3 | Copyright (c) 2014-2015 Joseph Cohen 4 | 5 | Permission is hereby granted, free of charge, to any person obtaining a copy 6 | of this software and associated documentation files (the "Software"), to deal 7 | in the Software without restriction, including without limitation the rights 8 | to use, copy, modify, merge, publish, distribute, sublicense, and/or sell 9 | copies of the Software, and to permit persons to whom the Software is 10 | furnished to do so, subject to the following conditions: 11 | 12 | The above copyright notice and this permission notice shall be included in 13 | all copies or substantial portions of the Software. 14 | 15 | THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR 16 | IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, 17 | FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE 18 | AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER 19 | LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, 20 | OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN 21 | THE SOFTWARE. 22 | -------------------------------------------------------------------------------- /README.md: -------------------------------------------------------------------------------- 1 | # laravel-elixir-webpack 2 | 3 | Simple extension to *laravel elixir* to build javascript bundle with *webpack*. 4 | 5 | ## Install 6 | 7 | ``` 8 | npm install --save-dev laravel-elixir-webpack 9 | ``` 10 | 11 | ## Usage 12 | 13 | ### Example *Gulpfile*: 14 | 15 | ```javascript 16 | var elixir = require('laravel-elixir'); 17 | 18 | require('laravel-elixir-webpack'); 19 | 20 | elixir(function(mix) { 21 | mix.webpack('app.js'); 22 | }); 23 | ``` 24 | 25 | You can also use multiple entry points. 26 | 27 | ```javascript 28 | var elixir = require('laravel-elixir'); 29 | 30 | require('laravel-elixir-webpack'); 31 | 32 | elixir(function(mix) { 33 | mix.webpack(['app.js', 'backend.js']); 34 | }); 35 | ``` 36 | 37 | #### Advanced example 38 | 39 | ```javascript 40 | elixir(function(mix) { 41 | mix.webpack('app.js', { 42 | module: { 43 | loaders: [ 44 | { test: /\.css$/, loader: 'style!css' }, 45 | ], 46 | }, 47 | }); 48 | }); 49 | ``` 50 | 51 | Multiple entry points. 52 | 53 | ```javascript 54 | elixir(function(mix) { 55 | mix.webpack(['app.js', 'backend.js'], { 56 | module: { 57 | loaders: [ 58 | { test: /\.css$/, loader: 'style!css' }, 59 | ], 60 | }, 61 | }); 62 | }); 63 | ``` 64 | 65 | Setting an output file. 66 | 67 | ```javascript 68 | elixir(function(mix) { 69 | mix.webpack('app.js', {}, './your-public-path/app.js'); 70 | }); 71 | ``` 72 | -------------------------------------------------------------------------------- /index.js: -------------------------------------------------------------------------------- 1 | var gulp = require('gulp'); 2 | var webpack = require('webpack-stream'); 3 | var UglifyJsPlugin = require('webpack').optimize.UglifyJsPlugin; 4 | var named = require('vinyl-named'); 5 | var _ = require('underscore'); 6 | var Elixir = require('laravel-elixir'); 7 | 8 | var $ = Elixir.Plugins; 9 | var config = Elixir.config; 10 | 11 | Elixir.extend('webpack', function (src, options, output) { 12 | var paths = prepGulpPaths(src, output); 13 | 14 | if (_.isObject(src) && !_.isArray(src)) { 15 | options = src; 16 | } else { 17 | options = _.extend({ 18 | output: { 19 | filename: paths.output.name, 20 | }, 21 | }, options); 22 | } 23 | 24 | var options = applyDefaults(options); 25 | 26 | new Elixir.Task('webpack', function () { 27 | this.log(paths.src, paths.output); 28 | 29 | return ( 30 | gulp.src(paths.src.path) 31 | .pipe($.if(!_.isArray(paths.src.path), named())) 32 | .pipe(webpack(options)) 33 | .on('error', function(e) { 34 | new Elixir.Notification('Webpack Compilation Failed!'); 35 | 36 | this.emit('end'); 37 | }) 38 | .pipe(gulp.dest(paths.output.baseDir)) 39 | .pipe(new Elixir.Notification('Webpack Compiled!')) 40 | ); 41 | }) 42 | .watch(config.assetsPath + '/**/*'); 43 | }); 44 | 45 | /** 46 | * Prep the Gulp src and output paths. 47 | * 48 | * @param {string|array} src 49 | * @param {string|null} output 50 | * @return {object} 51 | */ 52 | var prepGulpPaths = function(src, output) { 53 | return new Elixir.GulpPaths() 54 | .src(src, config.get('assets.js.folder')) 55 | .output(output || config.get('public.js.outputFolder'), 'app.js'); 56 | }; 57 | 58 | /** 59 | * Add sensitive default values to webpack options such as sourcemaps and 60 | * minification. 61 | * 62 | * @param {object} options 63 | * @return {object} 64 | */ 65 | var applyDefaults = function(options) { 66 | if (config.sourcemaps) { 67 | options = _.defaults( 68 | options, 69 | { devtool: '#source-map' } 70 | ); 71 | } 72 | 73 | if (config.production) { 74 | var currPlugins = _.isArray(options.plugins) ? options.plugins : []; 75 | options.plugins = currPlugins.concat([new UglifyJsPlugin({ sourceMap: false })]); 76 | } 77 | 78 | return options; 79 | } 80 | --------------------------------------------------------------------------------