stencil-cli: Missing "assets/dist" folder in theme's zip file created by "stencil bundle"

Ok. Ok. I found what is going on. The issue is not related to how long Webpack takes to do its work. Forget it. Wipe it.

The issue is related to how long the forked stencil.conf.js process takes to be “ready”.

I managed to workaround the issue in two distinct ways.

---

1. Increase timeout time.

At lib/build-config.js, line 76, we have a short 1 second timeout for the prodWorker function to call its callback function: https://github.com/bigcommerce/stencil-cli/blob/master/lib/build-config.js#L76

I’m not very sure what problem this “timeout” is trying to solve. I can understand the usage of Lodash’s once to avoid calling the callback twice. We can see that the callback can be called with three possible arguments: none, “noworker” or “timeout”.

Unfortunately, the callback function passed at prodWorker caller code snippet does NOTHING with this argument. We could have some output message telling us about the “timeout” or “noworker” condition. The caller code snippet is at stencil-bundle.js, line 64: https://github.com/bigcommerce/stencil-cli/blob/master/lib/stencil-bundle.js#L64-L67

Anyway, the first workaround which gave me the assets/dist folder again in the bundled theme was simply enlarging the timeout amount. I changed it to five seconds, so lib/build-config.js, line 76, became:

    const timeout = setTimeout(() => callback('timeout'), 5000);

This worked. But it required changing stencil-cli code. Thus, I’ve used the second workaround, described below.

---

2. Make theme’s stencil.conf.js be ready faster.

Once I understood what was going on, this was pretty easy to achieve, making minimal changes to the current default Cornerstone’s stencil.conf.js.

I removed these two lines from the top of the file:

var webpack = require('webpack');
var webpackConfig = require('./webpack.conf.js');

And copied them as the initial lines of development and production functions, where these variables are used.

So, this way stencil.conf.js forked process is able to quickly send the “ready” message. It does not need to spend the time requiring webpack and ./webpack.conf.js. This will only happen later in the flow.

---

These two workarounds were able to bring back assets/dist into stencil bundle zip file for me. I’m actually using the second one, because it would not be feasible to change stencil-cli my team-mates are using.

In my opinion, this “timeout” approach is flawed, because it allows the zipping to begin before Webpack has completed its work. The “production” callback is called before the bundling has finished. If the “timeout” approach is really necessary, I’d do two things:

• Increase the timeout period.
• Output a message informing about the “timeout” on the “build config process” being “ready”.

Thanks!

For everyone waiting on this bug, I apologize. We will do better in the future of watching this space for bug reports and acting more quickly on them. See #413 for the fix, which will be released in version 1.15.2.

And to @jbruni, thank you for the detailed write up, that made it easy to track down and fix this.

@jbruni I’m all for there being reasons to praise. Thanks for the reminder to look for the good in the world.

@jbruni does https://github.com/bigcommerce/cornerstone actually accept pull-requests?! maybe the community should just fork the project.

Nice work @jbruni ! Thanks for your help squashing this bug. We’ll prioritize getting your PR reviewed asap.

Not sure if I should open another ticket for this or not, but they seem related.

When trying to bundle, I constantly get the following error: Error: ENOENT: no such file or directory, open ‘C:\Development\Koan\man-made-theme\assets\dist\theme-bundle.chunk.0.js’

I have to alternate between stencil start (to generate the /dist directory) and stencil bundle at least 15-20 times before it finally builds ‘successfully’, then manually copy over the missing /dist into the zip.