├── .gitignore ├── package.json ├── LICENSE ├── index.js ├── config.js └── readme.md /.gitignore: -------------------------------------------------------------------------------- 1 | node_modules/ -------------------------------------------------------------------------------- /package.json: -------------------------------------------------------------------------------- 1 | { 2 | "name": "laravel-elixir-wiredep", 3 | "version": "2.1.0", 4 | "description": "Laravel Elixir Wiredep extension", 5 | "main": "index.js", 6 | "scripts": { 7 | "test": "echo \"Error: no test specified\" && exit 1" 8 | }, 9 | "repository": { 10 | "type": "git", 11 | "url": "https://github.com/FabioAntunes/laravel-elixir-wiredep" 12 | }, 13 | "keywords": [ 14 | "laravel", 15 | "elixir", 16 | "wiredep", 17 | "gulp" 18 | ], 19 | "author": "Fabio Antunes", 20 | "license": "MIT", 21 | "homepage": "https://github.com/FabioAntunes/laravel-elixir-wiredep", 22 | "bugs": { 23 | "url": "https://github.com/FabioAntunes/laravel-elixir-wiredep/issues" 24 | }, 25 | "dependencies": { 26 | "wiredep": "^2.2.2" 27 | }, 28 | "peerDependencies": { 29 | "laravel-elixir": ">=3.0" 30 | } 31 | } 32 | -------------------------------------------------------------------------------- /LICENSE: -------------------------------------------------------------------------------- 1 | The MIT License (MIT) 2 | 3 | Copyright (c) 2015 FabioAntunes 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 all 13 | 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 THE 21 | SOFTWARE. 22 | 23 | -------------------------------------------------------------------------------- /index.js: -------------------------------------------------------------------------------- 1 | var gulp = require('gulp'); 2 | var wiredep = require('wiredep').stream; 3 | var elixir = require('laravel-elixir'); 4 | var path = require('path'); 5 | var wiredepConfig = require('./config'); 6 | var task = elixir.Task; 7 | 8 | elixir.extend('wiredep', function(type, config, opts) { 9 | 10 | //for legacy reasons 11 | if(type === Object(type)){ 12 | var config = type || {}; 13 | var opts = config || {}; 14 | var type = 'php'; 15 | var typeDefaults = wiredepConfig[type]; 16 | }else{ 17 | var type = wiredepConfig.hasOwnProperty(type) ? type : 'php'; 18 | var typeDefaults = wiredepConfig[type]; 19 | var config = config || {}; 20 | var opts = opts || {}; 21 | } 22 | 23 | config.baseDir = config.baseDir || typeDefaults.config.baseDir; 24 | config.src = config.src || typeDefaults.config.src; 25 | config.searchLevel = config.searchLevel || typeDefaults.config.searchLevel; 26 | 27 | opts.ignorePath = opts.ignorePath || typeDefaults.opts.ignorePath; 28 | opts.fileTypes = opts.fileTypes || typeDefaults.opts.fileTypes; 29 | 30 | new task('wiredep', function() { 31 | var src = path.join(config.baseDir, !!config.src ? config.src : config.searchLevel); 32 | 33 | return gulp.src(src).pipe(wiredep(opts)).pipe(gulp.dest(config.baseDir)) 34 | }) 35 | .watch(opts.bowerJson || './bower.json'); 36 | 37 | }); 38 | -------------------------------------------------------------------------------- /config.js: -------------------------------------------------------------------------------- 1 | var configs = { 2 | sass: { 3 | config: { 4 | baseDir: 'resources/assets/sass', 5 | src: false, 6 | searchLevel: '**/*.sass' 7 | }, 8 | opts: { 9 | ignorePath: '' 10 | } 11 | }, 12 | scss: { 13 | config: { 14 | baseDir: 'resources/assets/sass', 15 | src: false, 16 | searchLevel: '**/*.scss' 17 | }, 18 | opts: { 19 | ignorePath: '' 20 | } 21 | }, 22 | less: { 23 | config: { 24 | baseDir: 'resources/assets/less', 25 | src: false, 26 | searchLevel: '**/*.less' 27 | }, 28 | opts: { 29 | ignorePath: '' 30 | } 31 | }, 32 | php: { 33 | config: { 34 | baseDir: 'resources/views/', 35 | src: false, 36 | searchLevel: '**/*.php' 37 | }, 38 | opts: { 39 | ignorePath: /(\..\/)*(public)?/, 40 | fileTypes: { 41 | php: { 42 | block: /(([ \t]*))(\n|\r|.)*?()/gi, 43 | detect: { 44 | js: /', 49 | css: '' 50 | } 51 | } 52 | } 53 | } 54 | } 55 | }; 56 | 57 | module.exports = configs; 58 | -------------------------------------------------------------------------------- /readme.md: -------------------------------------------------------------------------------- 1 | #Laravel-Elixir-Wiredep 2 | >This is a simple wrapper around Laravel Elixir for Wiredep. 3 | 4 | [![npm](https://img.shields.io/npm/v/laravel-elixir-wiredep.svg)](https://www.npmjs.com/package/laravel-elixir-wiredep) 5 | [![npm](https://img.shields.io/npm/dt/laravel-elixir-wiredep.svg)](https://www.npmjs.com/package/laravel-elixir-wiredep) 6 | 7 | ## Getting Started 8 | Install the module with [npm](https://npmjs.org): 9 | 10 | **laravel-elixir >v3.x** 11 | ```bash 12 | $ npm install --save-dev laravel-elixir-wiredep 13 | ``` 14 | 15 | **laravel-elixir < v2.x** 16 | ```bash 17 | $ npm install --save-dev laravel-elixir-wiredep@2.x-release 18 | ``` 19 | 20 | 21 | And add it to your Elixir-enhanced Gulpfile, like so: 22 | 23 | ```javascript 24 | var elixir = require('laravel-elixir'); 25 | 26 | require('laravel-elixir-wiredep'); 27 | 28 | elixir(function(mix) { 29 | mix.wiredep(); 30 | }); 31 | ``` 32 | 33 | Then you just have to edit your php file(s) and some extra markup, like this: 34 | 35 | ```html 36 | 37 | 38 | 39 | 40 | 41 | 42 | 43 | 44 | 45 | 46 | 47 | 48 | 49 | ``` 50 | 51 | This will scan your Bower dependencies on `bower.json` and inject them all in your `.php` files inside `resources/views/` directory. Instead, if you only want to inject dependencies on a single file, you may do: 52 | 53 | ```javascript 54 | mix.wiredep({src: 'master.blade.php'}) 55 | ``` 56 | 57 | If you run `$ gulp watch` this will also watch your `bower.json` for any changes and inject them automatically. 58 | Whenever you install a new bower package with the `-S` flag your php files will be updated. 59 | 60 | 61 | 62 | ## NOTE 63 | Since Wiredep serves bower components, these must inside the public folder. 64 | Just create a `.bowerrc` file in the root of your project folder and specify the destination folder inside the public folder, like so: 65 | ```javascript 66 | { 67 | "directory" : "public/bower_components" 68 | } 69 | ``` 70 | 71 | ## Options 72 | This wrapper accepts three optional parameters with configurations: 73 | ```javascript 74 | mix.wiredep(type, config, opts); 75 | ``` 76 | * **type** - a string with the type of file `'php','sass','scss','less'` 77 | * **config** - an object with the configs for the laravel-elixir-wiredep package 78 | * **opts** - an object with the configs for the wiredep package, you can get more info about it [here](https://github.com/taptapship/wiredep#configuration) 79 | 80 | These are the default wrapper options and the default wiredep options for each type of file: 81 | ```javascript 82 | sass: { 83 | config: { 84 | baseDir: 'resources/assets/sass', 85 | src: false, 86 | searchLevel: '**/*.sass' 87 | }, 88 | opts: { 89 | ignorePath: '' 90 | } 91 | }, 92 | scss: { 93 | config: { 94 | baseDir: 'resources/assets/sass', 95 | src: false, 96 | searchLevel: '**/*.scss' 97 | }, 98 | opts: { 99 | ignorePath: '' 100 | } 101 | }, 102 | less: { 103 | config: { 104 | baseDir: 'resources/assets/less', 105 | src: false, 106 | searchLevel: '**/*.less' 107 | }, 108 | opts: { 109 | ignorePath: '' 110 | } 111 | }, 112 | php: { 113 | config: { 114 | baseDir: 'resources/views/', 115 | src: false, 116 | searchLevel: '**/*.php' 117 | }, 118 | opts: { 119 | ignorePath: /(\..\/)*(public)?/, 120 | fileTypes: { 121 | php: { 122 | block: /(([ \t]*))(\n|\r|.)*?()/gi, 123 | detect: { 124 | js: /', 129 | css: '' 130 | } 131 | } 132 | } 133 | } 134 | } 135 | ``` 136 | 137 | You can override the default options, by just passing them as second and third options or in case of PHP files you can omit the first parameter `type` and just pass the options. 138 | ```javascript 139 | var elixir = require('laravel-elixir'); 140 | require('laravel-elixir-wiredep'); 141 | 142 | elixir(function(mix) { 143 | mix.wiredep('php',{ src: 'master.blade.php' }, { ignorePath: null } ); 144 | //if your first parameter is php you can omit it and achieve the same result 145 | mix.wiredep({ src: 'master.blade.php' }, { ignorePath: null } ); 146 | }); 147 | ``` 148 | 149 | 150 | ## Examples 151 | 152 | ### PHP 153 | 154 | #### Wiredep one PHP file 155 | This is an example of a Gulp file that Wiredeps **only** your **javascript** and **CSS** dependencies into the `resources/views/master.blade.php`: 156 | ```javascript 157 | var elixir = require('laravel-elixir'); 158 | require('laravel-elixir-wiredep'); 159 | 160 | elixir(function(mix) { 161 | mix.wiredep({src: 'master.blade.php'}); 162 | }); 163 | ``` 164 | 165 | 166 | 167 | #### Wiredep multiple PHP files 168 | This is an example of a Gulp file that Wiredeps **only** your **javascript** and **CSS** dependencies into all the PHP files, inside the `resources/views/ folder`, that have the bower tags: 169 | ```javascript 170 | var elixir = require('laravel-elixir'); 171 | require('laravel-elixir-wiredep'); 172 | 173 | elixir(function(mix) { 174 | mix.wiredep(); 175 | }); 176 | ``` 177 | 178 | ### Styles 179 | 180 | #### Scss 181 | This one is an example of a Gulp file that Wiredeps **only** your **scss** dependencies into your Scss file and compiles it into the `public/css/app.css`: 182 | ```javascript 183 | var elixir = require('laravel-elixir'); 184 | require('laravel-elixir-wiredep'); 185 | 186 | elixir(function(mix) { 187 | mix.wiredep('scss') 188 | .sass('app.scss'); 189 | }); 190 | ``` 191 | On your **app.scss** just add the bower comments. 192 | ```sass 193 | // bower:scss 194 | // endbower 195 | @import "someLocalScssFile"; 196 | 197 | $white: #ffffff; 198 | $black: #000000; 199 | ``` 200 | 201 | #### Sass 202 | This one is an example of a Gulp file that Wiredeps **only** your **sass** dependencies and compiles your Sass file into the `public/css/app.css`: 203 | ```javascript 204 | var elixir = require('laravel-elixir'); 205 | require('laravel-elixir-wiredep'); 206 | 207 | elixir(function(mix) { 208 | mix.wiredep('sass') 209 | .sass('app.sass'); 210 | }); 211 | ``` 212 | On your **app.sass** just add the bower comments. 213 | ```sass 214 | // bower:sass 215 | // endbower 216 | @import "someLocalSassFile"; 217 | 218 | $white: #ffffff; 219 | $black: #000000; 220 | ``` 221 | 222 | #### Less 223 | This one is an example of a Gulp file that Wiredeps **only** your **less** dependencies and compiles your Less file into the `public/css/app.css`: 224 | ```javascript 225 | var elixir = require('laravel-elixir'); 226 | require('laravel-elixir-wiredep'); 227 | 228 | elixir(function(mix) { 229 | mix.wiredep('less') 230 | .less('app.less'); 231 | }); 232 | ``` 233 | On your **app.less** just add the bower comments. 234 | ```less 235 | // bower:less 236 | // endbower 237 | @import "someLocalSassFile"; 238 | 239 | $white: #ffffff; 240 | $black: #000000; 241 | ``` 242 | 243 | ### Multiple Wiredeps 244 | If you want to Wiredep your sass/scss/less styles and also Wiredep Javascript and/or css into your PHP files, you just have to Wiredep twice. 245 | 246 | ```javascript 247 | var elixir = require('laravel-elixir'); 248 | require('laravel-elixir-wiredep'); 249 | 250 | elixir(function(mix) { 251 | mix.wiredep('scss') 252 | .sass('app.scss') 253 | .wiredep(); 254 | }); 255 | ``` 256 | --------------------------------------------------------------------------------