Module not found error doesn't properly exit during build

Describe the bug When building storybook using build-storybook with module resolution errors in an .mdx file, a build error occurs but the build process hangs instead of exiting with a non-zero exit code. This is observed when using @storybook/addons-docs with a story using .mdx with an improper import.

This is problematic for our teams as we run this process during CI/CD pipelines and it hangs our builds if one of our developers makes an error in their .mdx files.

> storybook-build-hang@0.0.0 build-storybook M:\scratch\storybook-build-hang
> build-storybook

info @storybook/angular v5.3.18
info
info clean outputDir..
info => Copying prebuild dll's..
info => Building manager..
info => Loading manager config..
info => Loading presets
info => Compiling manager..
info => manager built (8.11 s)
info => Building preview..
info => Loading preview config..
info => Loading presets
info => Loading config/preview file in "./.storybook".
info => Adding stories defined in ".storybook\main.js".
info => Found custom tsconfig.json
info => Using default Webpack setup.
info => Using angular project 'storybook-build-hang' for configuring Storybook.
info => Loading angular-cli config.
info => Get angular-cli webpack config.
info => Compiling preview..
Starting type checking service...
Using 1 worker with 2048MB memory limit
70% building 40/90 modules 50 active M:\scratch\storybook-build-hang\node_modules\core-js\internals\set-to-string-tag.jsERR! => Failed to build the preview
ERR! Module not found: Error: Can't resolve './app.componen' in 'M:\scratch\storybook-build-hang\src\app'
(node:39788) UnhandledPromiseRejectionWarning: ModuleNotFoundError: Module not found: Error: Can't resolve './app.componen' in 'M:\scratch\storybook-build-hang\src\app'
    at M:\scratch\storybook-build-hang\node_modules\webpack\lib\Compilation.js:925:10
    at M:\scratch\storybook-build-hang\node_modules\webpack\lib\NormalModuleFactory.js:401:22
    at M:\scratch\storybook-build-hang\node_modules\webpack\lib\NormalModuleFactory.js:130:21
    at M:\scratch\storybook-build-hang\node_modules\webpack\lib\NormalModuleFactory.js:224:22
    at M:\scratch\storybook-build-hang\node_modules\neo-async\async.js:2830:7
    at M:\scratch\storybook-build-hang\node_modules\neo-async\async.js:6877:13
    at M:\scratch\storybook-build-hang\node_modules\webpack\lib\NormalModuleFactory.js:214:25
    at M:\scratch\storybook-build-hang\node_modules\enhanced-resolve\lib\Resolver.js:213:14
    at M:\scratch\storybook-build-hang\node_modules\enhanced-resolve\lib\Resolver.js:285:5
    at eval (eval at create (M:\scratch\storybook-build-hang\node_modules\tapable\lib\HookCodeFactory.js:33:10), <anonymous>:15:1)
    at M:\scratch\storybook-build-hang\node_modules\enhanced-resolve\lib\UnsafeCachePlugin.js:44:7
    at M:\scratch\storybook-build-hang\node_modules\enhanced-resolve\lib\Resolver.js:285:5
    at eval (eval at create (M:\scratch\storybook-build-hang\node_modules\tapable\lib\HookCodeFactory.js:33:10), <anonymous>:15:1)
    at M:\scratch\storybook-build-hang\node_modules\enhanced-resolve\lib\Resolver.js:285:5
    at eval (eval at create (M:\scratch\storybook-build-hang\node_modules\tapable\lib\HookCodeFactory.js:33:10), <anonymous>:27:1)
    at M:\scratch\storybook-build-hang\node_modules\enhanced-resolve\lib\DescriptionFilePlugin.js:67:43
(node:39788) UnhandledPromiseRejectionWarning: Unhandled promise rejection. This error originated either by throwing inside of an async function without a catch block, or by rejecting a promise which was not handled with .catch(). (rejection id: 1)
(node:39788) [DEP0018] DeprecationWarning: Unhandled promise rejections are deprecated. In the future, promise rejections that are not handled will terminate the Node.js process with a non-zero exit code.
70% building 1553/1553 modules 0 active

To Reproduce Steps to reproduce the behavior:

1. Bootstrap a new Angular CLI Project
2. Run npx -p @storybook/cli sb init to bootstrap storybook for Angular
3. Install @storybook/addon-docs and create a story using MDX
4. Add a typo in a component import path
5. Build the project with build-storybook

Expected behavior An error printed to the console and the process exiting with a non-zero exit code.

Code snippets A repository has been created with this issue already reproduced: https://github.com/esingletary/storybook-build-hang

System:

Environment Info:

  System:
    OS: Windows 10 10.0.17134
    CPU: (12) x64 Intel(R) Core(TM) i7-8850H CPU @ 2.60GHz
  Binaries:
    Node: 12.14.1 - C:\Program Files\nodejs\node.EXE
    npm: 6.13.7 - C:\Program Files\nodejs\npm.CMD
  Browsers:
    Edge: 42.17134.1098.0

[cpconcertage]

@cpconcertage I seem to be having the same issue. Screenshot from AWS Codepipline The strange thing is that when I trigger the build locally, it works. Perhaps there is some more clues here to work with!

I don’t think there are any clues when the build process hangs, unfortunately. From my limited experience, and similar to the person reporting this issue originally, there probably is an actual error in one of the files. The hanging on build doesn’t tell you why it’s hanging, so it’s not much help. I can’t think of anything to help find the problem source other than the brute force way of incrementally removing changes until the problem disappears, then adding back, etc. if you’re not seeing errors with the build locally or with the storybook server.

[cpconcertage]

just because the stale bot seems a bit eager, I’ll add my 2 cents. I have just had the same problem with a CI timeout because build-storybook got hung. For me it occurred here:

info => Compiling preview..
70% building 2316/2318 modules 2 active /<local directory>/node_modules/acorn-walk/dist/walk.mjsERR! => Failed to build the preview
ERR! ./src/design-components/ContentCard/ContentCard.stories.mdx
ERR! Cannot find file '../ReduxReadExample' in './src/design-components/ContentCard'.
(node:49886) UnhandledPromiseRejectionWarning: ModuleNotFoundError: Module not found: Error: Can't resolve '../ReduxReadExample' in '/<local directory>/src/design-components/ContentCard'
    at /<local directory>/node_modules/@storybook/core/node_modules/webpack/lib/Compilation.js:925:10
    at /<local directory>/node_modules/@storybook/core/node_modules/webpack/lib/NormalModuleFactory.js:401:22
    at /<local directory>/node_modules/@storybook/core/node_modules/webpack/lib/NormalModuleFactory.js:130:21
    at /<local directory>/node_modules/@storybook/core/node_modules/webpack/lib/NormalModuleFactory.js:224:22
    at /<local directory>/node_modules/neo-async/async.js:2830:7
    at /<local directory>/node_modules/neo-async/async.js:6877:13
    at /<local directory>/node_modules/@storybook/core/node_modules/webpack/lib/NormalModuleFactory.js:214:25
    at /<local directory>/node_modules/enhanced-resolve/lib/Resolver.js:213:14
    at /<local directory>/node_modules/enhanced-resolve/lib/Resolver.js:285:5
    at eval (eval at create (/<local directory>/node_modules/tapable/lib/HookCodeFactory.js:33:10), <anonymous>:13:1)
    at /<local directory>/node_modules/enhanced-resolve/lib/UnsafeCachePlugin.js:44:7
    at /<local directory>/node_modules/enhanced-resolve/lib/Resolver.js:285:5
    at eval (eval at create (/<local directory>/node_modules/tapable/lib/HookCodeFactory.js:33:10), <anonymous>:13:1)
    at /<local directory>/node_modules/enhanced-resolve/lib/Resolver.js:285:5
    at eval (eval at create (/<local directory>/node_modules/tapable/lib/HookCodeFactory.js:33:10), <anonymous>:25:1)
    at /<local directory>/node_modules/enhanced-resolve/lib/DescriptionFilePlugin.js:67:43
(node:49886) UnhandledPromiseRejectionWarning: Unhandled promise rejection. This error originated either by throwing inside of an async function without a catch block, or by rejecting a promise which was not handled with .catch(). To terminate the node process on unhandled promise rejection, use the CLI flag `--unhandled-rejections=strict` (see https://nodejs.org/api/cli.html#cli_unhandled_rejections_mode). (rejection id: 1)
(node:49886) [DEP0018] DeprecationWarning: Unhandled promise rejections are deprecated. In the future, promise rejections that are not handled will terminate the Node.js process with a non-zero exit code.
70% building 2575/2575 modules 0 active