Handle custom webpack config

[Idered]

It add support for web/config/webpack.config.js file.

Two formats are supported:

module.exports = (config, {env}) => {
  if (env === 'development') {
    // Add dev plugin
  }
  config.module.rules.push({...})

  return config
}

⬆️ user can use this format to overwrite base config or return completely new config.

---

module.exports = {
  module: {
    rules: [{...}]
  }
}

⬆️ this format will merge with base webpack config.

TailwindCSS support can be added with:

const configDir = __dirname

module.exports = (config) => {
  config.module.rules[0].oneOf[5] = {
    test: /\.css$/,
    sideEffects: true,
    use: [
      'style-loader',
      { loader: 'css-loader', options: { importLoaders: 1 } },
      {
        loader: 'postcss-loader',
        options: {
          config: {
            path: configDir,
          },
        },
      },
    ],
  }

  return config
}

I guess that postcss should be supported by default - CRA and NextJS does support it.

closes #309

[peterp]

Thanks so much for this!

I've left some feedback on this.

I definitely prefer having a single approach for mutating the configs, and the merge approach makes the most sense.

I think if people are at the point where they need to return a completely new webpack config that they're likely better off not using yarn rw dev web, and instead runningyarn webpack --config <path/to/config> themselves.

[thedavidprice]

Hi gents. This looks fantastic! And now we definitely need some docs 😉

Opening an issue linking here for the meantime.