UNPKG

4.55 kBMarkdownView Raw
1# webpack-stream [![Build Status](http://img.shields.io/travis/shama/webpack-stream.svg)](https://travis-ci.org/shama/webpack-stream)
2
3Run [webpack](https://github.com/webpack/webpack) as a stream to conveniently integrate with gulp.
4
5[![NPM](https://nodei.co/npm/webpack-stream.png?downloads=true)](https://nodei.co/npm/webpack-stream/)
6
7## Usage
8
9```js
10var gulp = require('gulp');
11var webpack = require('webpack-stream');
12gulp.task('default', function() {
13 return gulp.src('src/entry.js')
14 .pipe(webpack())
15 .pipe(gulp.dest('dist/'));
16});
17```
18
19The above will compile `src/entry.js` into assets with webpack into `dist/` with the output filename of `[hash].js` (webpack generated hash of the build).
20
21You can pass webpack options in with the first argument, including `watch` which will greatly decrease compilation times:
22
23```js
24return gulp.src('src/entry.js')
25 .pipe(webpack({
26 watch: true,
27 module: {
28 loaders: [
29 { test: /\.css$/, loader: 'style!css' },
30 ],
31 },
32 }))
33 .pipe(gulp.dest('dist/'));
34```
35
36Or just pass in your `webpack.config.js`:
37
38```js
39return gulp.src('src/entry.js')
40 .pipe(webpack( require('./webpack.config.js') ))
41 .pipe(gulp.dest('dist/'));
42```
43
44If you would like to use a different version of webpack than the one this plugin uses, pass in an optional 2nd argument:
45
46```js
47var gulp = require('gulp');
48var webpack = require('webpack');
49var gulpWebpack = require('webpack-stream');
50gulp.task('default', function() {
51 return gulp.src('src/entry.js')
52 .pipe(gulpWebpack({}, webpack))
53 .pipe(gulp.dest('dist/'));
54});
55```
56
57Pass in 3rd argument if you want to access the stats outputted from webpack when the compilation is done:
58
59
60```js
61var gulp = require('gulp');
62var webpack = require('webpack-stream');
63gulp.task('default', function() {
64 return gulp.src('src/entry.js')
65 .pipe(webpack({
66 /* config */
67 }, null, function(err, stats) {
68 /* Use stats to do more things if needed */
69 }))
70 .pipe(gulp.dest('dist/'));
71});
72```
73
74#### Multiple Entry Points
75
76A common request is how to handle multiple entry points. You can continue to pass in an `entry` option in your typical webpack config like so:
77
78```js
79var gulp = require('gulp');
80var webpack = require('webpack-stream');
81gulp.task('default', function() {
82 return gulp.src('src/entry.js')
83 .pipe(webpack({
84 entry: {
85 app: 'src/app.js',
86 test: 'test/test.js',
87 },
88 output: {
89 filename: '[name].js',
90 },
91 }))
92 .pipe(gulp.dest('dist/'));
93});
94```
95
96Or pipe files through a stream that names the chunks. A convenient library for this is [vinyl-named](https://github.com/shama/vinyl-named):
97
98```js
99var gulp = require('gulp');
100var webpack = require('webpack-stream');
101var named = require('vinyl-named');
102gulp.task('default', function() {
103 return gulp.src(['src/app.js', 'test/test.js'])
104 .pipe(named())
105 .pipe(webpack())
106 .pipe(gulp.dest('dist/'));
107});
108```
109
110The above `named()` stream will add a `.named` property to the vinyl files passing through. The `webpack()` stream will read those as entry points and even group entry points with common names together.
111
112## Release History
113* 2.1.0 - Avoid modifying options by reference (@shinuza). Replace log with correct package name (@vinnymac).
114* 2.0.0 - Rename to webpack-stream and now it's totally not a gulp plugin.
115* 1.5.0 - Update webpack to 1.9.x (@nmccready). Update other dependencies.
116* 1.4.0 - Update webpack to 1.8.x (@Zolmeister).
117* 1.3.2 - Fix another place with ? in name (@raphaelluchini).
118* 1.3.1 - Fix for paths with ? in their name (@raphaelluchini).
119* 1.3.0 - Updating to webpack >= 1.7.
120* 1.2.0 - Updating to webpack >= 1.5, vinyl >= 0.4, memory-fs >= 0.2.
121* 1.1.2 - Fixes to default stats for logging (@mdreizin).
122* 1.1.1 - Add additional stats to default logging (@mdreizin).
123* 1.1.0 - Exposes internal webpack if asked via `require('webpack-stream').webpack`
124* 1.0.0 - Support named chunks pipe'd in for multiple entry points.
125* 0.4.1 - Fixed regression for multiple entry point support.
126* 0.4.0 - Display an error message if there are no input files (@3onyc). Add message on why task is not finishing, Add ability to track compilation progress, Add ability to configure stats output via options (@kompot). Bump webpack version (@koistya).
127* 0.3.0 - Update deps (@kompot). Fixes to determining entry (@btipling and @abergs).
128* 0.2.0 - Support for `watch` mode (@ampedandwired).
129* 0.1.0 - Initial release
130
131## License
132Copyright (c) 2015 Kyle Robinson Young
133Licensed under the MIT license.