backpack icon indicating copy to clipboard operation
backpack copied to clipboard

Integrate HappyPack to speed up builds

Open yenbekbay opened this issue 7 years ago • 2 comments

HappyPack significantly reduces webpack build times by using parallel execution.

I was able to make it work with babel-loader by adding the following to my backpack.config.js:

const HappyPack = require('happypack');

module.exports = {
  webpack: config => {
    let babelOptions;
    config.module.rules = config.module.rules.map(rule => {
      if (rule.loader === 'babel-loader') {
        babelOptions = rule.options;

        return {
          test: rule.test,
          exclude: rule.exclude,
          use: {
            loader: require.resolve('happypack/loader'),
            query: {id: 'babel'},
          },
        };
      }

      return rule;
    });
    config.plugins = [
      ...config.plugins,
      new HappyPack({
        id: 'babel',
        loaders: [
          {
            path: require.resolve('babel-loader'),
            query: babelOptions,
          },
        ],
        verbose: false,
      }),
    ];

    return config;
  },
};

However, it would be great to have this set up by default.

Willing to make a PR if this is something you would want to add.

yenbekbay avatar May 12 '17 04:05 yenbekbay

So HappyPack is great, but it is not fully compatible with all webpack loaders. That being said, I wonder if there should be a "blessed" method of adding it. For example, we could publish a backpack-plugin-happypack that would export the function above.

Thoughts?

jaredpalmer avatar Jun 21 '17 13:06 jaredpalmer

I would also love to see Happy Pack integration! Maybe configure through something like a .backpackrc?

aarohmankad avatar Aug 03 '17 13:08 aarohmankad