{"action":"created","issue":{"url":"https://api.github.com/repos/react-cosmos/react-cosmos/issues/753","repository_url":"https://api.github.com/repos/react-cosmos/react-cosmos","labels_url":"https://api.github.com/repos/react-cosmos/react-cosmos/issues/753/labels{/name}","comments_url":"https://api.github.com/repos/react-cosmos/react-cosmos/issues/753/comments","events_url":"https://api.github.com/repos/react-cosmos/react-cosmos/issues/753/events","html_url":"https://github.com/react-cosmos/react-cosmos/issues/753","id":340644317,"node_id":"MDU6SXNzdWUzNDA2NDQzMTc=","number":753,"title":"Add to readme a more precise info about using custom webpack","user":{"login":"ktunkiewicz","id":5413271,"node_id":"MDQ6VXNlcjU0MTMyNzE=","avatar_url":"https://avatars2.githubusercontent.com/u/5413271?v=4","gravatar_id":"","url":"https://api.github.com/users/ktunkiewicz","html_url":"https://github.com/ktunkiewicz","followers_url":"https://api.github.com/users/ktunkiewicz/followers","following_url":"https://api.github.com/users/ktunkiewicz/following{/other_user}","gists_url":"https://api.github.com/users/ktunkiewicz/gists{/gist_id}","starred_url":"https://api.github.com/users/ktunkiewicz/starred{/owner}{/repo}","subscriptions_url":"https://api.github.com/users/ktunkiewicz/subscriptions","organizations_url":"https://api.github.com/users/ktunkiewicz/orgs","repos_url":"https://api.github.com/users/ktunkiewicz/repos","events_url":"https://api.github.com/users/ktunkiewicz/events{/privacy}","received_events_url":"https://api.github.com/users/ktunkiewicz/received_events","type":"User","site_admin":false},"labels":[],"state":"closed","locked":false,"assignee":null,"assignees":[],"milestone":null,"comments":2,"created_at":"2018-07-12T13:44:21Z","updated_at":"2018-07-13T13:37:31Z","closed_at":"2018-07-13T12:13:54Z","author_association":"NONE","body":"**What's up?**\r\nIn situation where react-cosmos is to be used with existing webpack config it is really not straightforward how to do this. Or am I doing it wrong?\r\n\r\n**Mkay, tell me more...**\r\nI have a fairly complicated webpack that loads a whole ton of module rules, plugins, aliases etc. and I simply cannot use the default Cosmos' webpack config.\r\n\r\nMy main webpack.config.js spits out multiple configurations, so I also have a `/webpack/common.config.js` file with everything *except* `entry`, `output` and HtmlWebpackPlugin in there. This looks like a good candidate for providing `webpackConfigPath` to Cosmos.\r\n\r\nBut I first tried outputing only single configuration from the main webpack file to see if Cosmos can override my webpack config's HtmlWebpackPlugin.\r\n\r\nOnce I run `npm run cosmos` I get the happy `webpack built ... in ... ms` message. Great, but once I navigate to `http://localhost:8989/` I see HTTP 404 on `_loader.html`.\r\n\r\nObviously the HtmlWebpackPlugin did not output `_loader.html`.\r\n\r\nThen I tried with `webpackConfigPath: './webpack/common.config.js'`, and it's the same story. Now that's probably because if `webpackConfigPath` is provided, it is not \"enhanced\" by Cosmos anymore, to have the HtmlWebpackPlugin adde, am I right?\r\n\r\nAfter some time I figured out that the solution that works is:\r\n```\r\n// cosmos.config.js\r\nconst HtmlWebpackPlugin = require('html-webpack-plugin');\r\nmodule.exports = {\r\n  publicPath: 'dist',\r\n  publicUrl: '/widget/',\r\n  watchDirs: ['src'],\r\n  webpackConfigPath: './webpack/common.config.js',\r\n  webpack: (config) => {\r\n    // add Cosmos' HtmlWebpackPlugin\r\n    config.plugins.push(new HtmlWebpackPlugin({ title: 'React Cosmos', filename: '_loader.html' }));\r\n    return config;\r\n  },\r\n};\r\n```\r\n\r\nwhere the `./webpack/common.config.js'` holds all webpack config **except** these pieces:\r\n```\r\n  // NOT in ./webpack/common.config.js\r\n  entry: { ... },\r\n  output: { ... },\r\n  plugins: [\r\n    new HtmlWebpackPlugin({\r\n      ...\r\n    }),\r\n  ],\r\n```\r\n\r\nIt would be nice to mention in the readme that the config provided with `webpackConfigPath` option does not get HtmlWebPackPlugin injected into plugins and you have to do it yourself.\r\n"},"comment":{"url":"https://api.github.com/repos/react-cosmos/react-cosmos/issues/comments/404835859","html_url":"https://github.com/react-cosmos/react-cosmos/issues/753#issuecomment-404835859","issue_url":"https://api.github.com/repos/react-cosmos/react-cosmos/issues/753","id":404835859,"node_id":"MDEyOklzc3VlQ29tbWVudDQwNDgzNTg1OQ==","user":{"login":"skidding","id":250750,"node_id":"MDQ6VXNlcjI1MDc1MA==","avatar_url":"https://avatars0.githubusercontent.com/u/250750?v=4","gravatar_id":"","url":"https://api.github.com/users/skidding","html_url":"https://github.com/skidding","followers_url":"https://api.github.com/users/skidding/followers","following_url":"https://api.github.com/users/skidding/following{/other_user}","gists_url":"https://api.github.com/users/skidding/gists{/gist_id}","starred_url":"https://api.github.com/users/skidding/starred{/owner}{/repo}","subscriptions_url":"https://api.github.com/users/skidding/subscriptions","organizations_url":"https://api.github.com/users/skidding/orgs","repos_url":"https://api.github.com/users/skidding/repos","events_url":"https://api.github.com/users/skidding/events{/privacy}","received_events_url":"https://api.github.com/users/skidding/received_events","type":"User","site_admin":false},"created_at":"2018-07-13T13:37:31Z","updated_at":"2018-07-13T13:37:31Z","author_association":"MEMBER","body":"@ktunkiewicz can you please try `react-cosmos@4.6.0-3`?\r\n\r\n`html-webpack-plugin` should be added automatically to your custom webpack config now."}}
{"actor":{"display_login":"skidding"}}