Skip to content

(Not currently maintained) A fast, compatible webpack plugin for Broccoli.

License

Notifications You must be signed in to change notification settings

timmfin/broccoli-webpack-cached

Repository files navigation

Note, our internal tooling has moved away from Broccoli so I'm not maintaining this anymore. If anyone wants to pick it up and run with it, please be my guest.


Yet another webpack plugin for Broccoli. This one relies on webpack's caching, but does it in a way that works well as a broccoli plugin (letting webpack write to the cache folder and then symlinking from that to the final output folder as needed).

This means it should be fast and compatible with other Broccoli plugins (unlike myfreeweb/broccoli-webpack and rafales/broccoli-webpack-fast)

Note, internally this uses the PreventResolveSymlinkPlugin to prevent Webpack's symlink resolution behavior from breaking relative paths inside of symlinked modules. But you can disable that by passing in the preventSymlinkResolution: false option (some context in this thread).

Using

Inside your Brocfile.js:

var webpack = require('webpack');
var mergeTrees = require('broccoli-merge-trees');
var WebpackFilter = require('broccoli-webpack-cached');

// ... other Broccoli plugins that buildup inputTree

// WebpackFilter
//
//   - First argument is a single inputTree (not an array)
//   - Second argument is a webpack options object. Note you _cannot_ pass the `context`,
//     `cache`, or `output` options (because this plugin will set them for you).
//
var webpackModulesTree = WebpackFilter(inputTree, {
  // Random example of webpack configuration ...
  entry: {
    one: "./entry.js",
    two: "./entry2.js",
  },

  output: {
    filename: "[name]-bundle.js",
    chunkFilename: "[id]-chunk-bundle.js"
  },

  externals: {
    jquery: 'jQuery'
  },

  // What seemed like the best option/tradeoff for faster but working source maps (at least for me)
  devtool: 'cheap-module-inline-source-map',

  plugins: [
    new webpack.optimize.CommonsChunkPlugin("extra.bundle.js"),
    new ExtractTextPlugin("[name].css", {
      allChunks: false
    })
  ],

  module: {
    preLoaders: [
      {
        // Use the source-map-loader to pass along source maps from earlier Broccoli plugins (they
        // should be inline source maps)
        test: /\.js$/,
        loaders: ["source-map-loader"]
      }
    ],
    loaders: [{
      test: /\.css$/,
      loader: ExtractTextPlugin.extract("style-loader", "css-loader?sourceMap")
    }]
  }
});

// .. other Broccoli plugins that consume webpack Tree

module.exports = mergeTrees([otherOutputTree, webpackModulesTree]);

About

(Not currently maintained) A fast, compatible webpack plugin for Broccoli.

Resources

License

Stars

Watchers

Forks

Packages

No packages published

Contributors 3

  •  
  •  
  •