---
number: 1465
title: 'WIP: Fix #1385: Upgrade to webpack 5'
author: h1b9b
state: MERGED
createdAt: '2020-11-28T19:02:50Z'
updatedAt: '2020-11-30T10:24:18Z'
closedAt: '2020-11-30T09:35:57Z'
mergedAt: '2020-11-30T09:35:57Z'
head: upgrade-webpack
base: dev
url: 'https://github.com/neomjs/neo/pull/1465'
---
Simple PR that upgrades webpack to version 5.
There is only one change is in the `server-start` script. 
Instead of using `webpack-dev-server --open`, we use the webpack cli directly `webpack serve --open`.

All tests pass and I didn't see any regression while browsing the example apps

<!-- PULL REQUEST TEMPLATE -->
<!-- (Update "[ ]" to "[x]" to check a box) -->

**What kind of change does this PR introduce?** (check at least one)

- [ ] Bugfix
- [ ] Feature
- [ ] Code style update
- [ ] Refactor
- [x] Build-related changes
- [ ] Other, please describe:

**Does this PR introduce a breaking change?** (check one)

- [ ] Yes
- [x] No

If yes, please describe the impact and migration path for existing applications:

**The PR fulfills these requirements:**

- [x] It's submitted to the `dev` branch, _not_ the `master` branch
- [x] When resolving a specific issue, it's referenced in the PR's title (e.g. `fix #xxx[,#xxx]`, where "xxx" is the issue number)


## Comments

### `@tobiu` commented on 2020-11-28T20:04:57Z

Hi @h1b9b! Thx for the PR, appreciated.

I do have time tomorrow to take a deeper look into it.

Did you check if the WebpackShellPlugin still works? (buildThreads => App)
The last time I tested it, it broke (quite a while ago though).

It would not be a big deal in case the plugin does not support webpack v5. We don't really need the onBuildExit hook => we could move the docs resources copy logic "one level up" => into the buildThreads program.

I read somewhere, that chunk names inside magic comments get handled differently in v5.

e.g.:
```
        Neo.config.mainThreadAddons.forEach(addon => {
            if (addon !== 'AnalyticsByGoogle') {
                imports.push(import(/* webpackChunkName: 'src/main/addon/[request]' */ `./main/addon/${addon}.mjs`));
            }
        });
```

In v4 this only affected the (dist) dev env, in v5 i think it was for prod as well.
Will double-check if the chunk paths are still reasonable.

Did you check if the dist versions of some examples or apps still work with the changes?

There is one override for the main thread in place:

https://github.com/neomjs/neo/blob/dev/src/Main.mjs#L195
```
        if (window.webpackJsonp) {
            __webpack_require__.p = Neo.config.basePath.substring(6);
        }
```

We need to verify that this one still works (not nice, but mandatory, since the main thread can get picked up from different levels inside the folder hierarchy).

Will ping you tomorrow!

Best regards,
Tobias

---

### `@h1b9b` commented on 2020-11-29T11:18:32Z

Thanks for the tips, I went too fast for the upgrade yesterday. Sorry 🙏 

> Did you check if the WebpackShellPlugin still works? (buildThreads => App)
> The last time I tested it, it broke (quite a while ago though).
>
> It would not be a big deal in case the plugin does not support webpack v5. We don't really need the onBuildExit hook => we could move the docs resources copy logic "one level up" => into the buildThreads program.

I went for a simple replacement solution. So I replaced [WebpackShellPlugin](https://github.com/1337programming/webpack-shell-plugin) with [WebpackHookPlugin](https://github.com/tienne/webpack-hook-plugin). Cause `WebpackShellPlugin` didn't get an update since 2017 and `WebpackHookPlugin` uses the new webpack hook API

I also upgraded css/post-css loaders and their usage to have full webpack 5 support

There is warning on `html-webpack-plugin` that is fixed in the alpha version so I pushed a commit updating it but it can be removed until the next release is available cause the build is still ok with the warning. It should be release soon (cf [webpack 5 support issue](https://github.com/jantimon/html-webpack-plugin/issues/1527))


There a problem with the chunk names. The apps are still working.
But the chunks aren't split as before in the dev build and the indexes on the production build are different.
So I put the PR in WIP until I figure out what's going on and fix it 😅 




---

### `@tobiu` commented on 2020-11-30T09:35:50Z

got time now to dive into your changes. will merge them first to get you into the contributors list.

---



## Reviews

### `@h1b9b` (COMMENTED) reviewed on 2020-11-28T19:14:17Z

*No review body provided.*

---

### `@tobiu` (COMMENTED) reviewed on 2020-11-30T10:24:17Z

*No review body provided.*

---

