Aurelia UX showcase app fails to load - aurelia

Question

I'm having trouble getting the Aurelia UX Showcase app to run on my local PC. It doesn't currently seem to work on the hosted demo site either, but I'm not sure if that's related. How can I get this running successfully? Is this a bug in the app, or something I'm doing wrong?
I followed the instructions to build the aurelia-ux demo app (located at https://github.com/aurelia/app-ux-showcase), and the app appeared to build succcessfully. However, upon running it, several errors are produced in the server output.
I can browse to the app (at http://localhost:8080) and the browser seems to connect to the server. However, there is no response.
Below is the server output, which is visible in the console after running the au run --env dev command:
C:\src\aurelia-ux-showcase>au run --env dev
Starting 'configureEnvironment'...
Finished 'configureEnvironment'
Starting 'runWebpack'...
(node:14072) DeprecationWarning: Tapable.plugin is deprecated. Use new API on `.hooks` instead
Project is running at http://localhost:8080
webpack output is served from /
Content not from webpack is served from C:\src\aurelia-ux-showcase\dist
404s will fallback to /index.html
Finished 'runWebpack'
Hash: 8541226efa5bac91e63a
Version: webpack 4.8.3
Time: 5594ms
Built at: 2018-05-22 13:15:17
Asset Size Chunks Chunk Names
2cdebc25fc6d3d42442e69826e81a2c9.png 10.5 KiB [emitted]
main.js 701 KiB main [emitted] [big] main
vendors.js 3.88 MiB vendors [emitted] [big] vendors
index.html 743 bytes [emitted]
Entrypoint main [big] = vendors.js main.js
[./node_modules/aurelia-bootstrapper/dist/native-modules/aurelia-bootstrapper.js] 5.17 KiB {vendors} [built]
[./node_modules/aurelia-loader-webpack/dist/native-modules/aurelia-loader-webpack.js] 14.4 KiB {vendors} [built]
[./node_modules/aurelia-loader/dist/native-modules/aurelia-loader.js] 4.19 KiB {vendors} [built]
[./node_modules/aurelia-logging/dist/native-modules/aurelia-logging.js] 3.4 KiB {vendors} [built]
[./node_modules/aurelia-pal/dist/native-modules/aurelia-pal.js] 2.18 KiB {vendors} [built]
[./node_modules/aurelia-polyfills/dist/native-modules/aurelia-polyfills.js] 24.4 KiB {vendors} [built]
[./node_modules/aurelia-templating/dist/native-modules/aurelia-templating.js] 145 KiB {vendors} [built]
[./node_modules/aurelia-webpack-plugin/runtime/empty-entry.js] 585 bytes {vendors} [built]
[./node_modules/aurelia-webpack-plugin/runtime/pal-loader-entry.js] 1.56 KiB {vendors} [built]
[./node_modules/bluebird/js/browser/bluebird.js] 175 KiB {vendors} [built]
[0] multi aurelia-webpack-plugin/runtime/empty-entry aurelia-webpack-plugin/runtime/pal-loader-entry aurelia-bootstrapper 52 bytes {main} [built]
[./node_modules/process/browser.js] 5.29 KiB {vendors} [built]
[aurelia-framework] ./node_modules/aurelia-framework/dist/native-modules/aurelia-framework.js 13.8 KiB {vendors} [built]
[aurelia-pal-browser] ./node_modules/aurelia-pal-browser/dist/native-modules/aurelia-pal-browser.js 14.2 KiB {vendors} [built]
[main] ./src/main.ts 966 bytes {main} [built]
+ 172 hidden modules
ERROR in ./node_modules/#aurelia-ux/components/dist/native-modules/index.js
Module not found: Error: Can't resolve '#aurelia-ux/button' in 'C:\src\aurelia-ux-showcase\node_modules\#aurelia-ux\components\dist\native-modules'
# ./node_modules/#aurelia-ux/components/dist/native-modules/index.js 2:0-51 2:0-51 15:0-75 30:4-28
# ./src/main.ts
# ./node_modules/aurelia-webpack-plugin/runtime/empty-entry.js
# multi aurelia-webpack-plugin/runtime/empty-entry aurelia-webpack-plugin/runtime/pal-loader-entry aurelia-bootstrapper
ERROR in ./node_modules/#aurelia-ux/components/dist/native-modules/index.js
Module not found: Error: Can't resolve '#aurelia-ux/checkbox' in 'C:\src\aurelia-ux-showcase\node_modules\#aurelia-ux\components\dist\native-modules'
# ./node_modules/#aurelia-ux/components/dist/native-modules/index.js 3:0-67 3:0-67 3:0-67 17:0-79 32:4-30
# ./src/main.ts
# ./node_modules/aurelia-webpack-plugin/runtime/empty-entry.js
# multi aurelia-webpack-plugin/runtime/empty-entry aurelia-webpack-plugin/runtime/pal-loader-entry aurelia-bootstrapper
ERROR in ./node_modules/#aurelia-ux/components/dist/native-modules/index.js
Module not found: Error: Can't resolve '#aurelia-ux/chip-input' in 'C:\src\aurelia-ux-showcase\node_modules\#aurelia-ux\components\dist\native-modules'
# ./node_modules/#aurelia-ux/components/dist/native-modules/index.js 4:0-83 4:0-83 4:0-83 4:0-83 18:0-77 33:4-26
# ./src/main.ts
# ./node_modules/aurelia-webpack-plugin/runtime/empty-entry.js
# multi aurelia-webpack-plugin/runtime/empty-entry aurelia-webpack-plugin/runtime/pal-loader-entry aurelia-bootstrapper
ERROR in ./node_modules/#aurelia-ux/components/dist/native-modules/index.js
Module not found: Error: Can't resolve '#aurelia-ux/datepicker' in 'C:\src\aurelia-ux-showcase\node_modules\#aurelia-ux\components\dist\native-modules'
# ./node_modules/#aurelia-ux/components/dist/native-modules/index.js 6:0-59 6:0-59 19:0-83 34:4-32
# ./src/main.ts
# ./node_modules/aurelia-webpack-plugin/runtime/empty-entry.js
# multi aurelia-webpack-plugin/runtime/empty-entry aurelia-webpack-plugin/runtime/pal-loader-entry aurelia-bootstrapper
ERROR in ./node_modules/#aurelia-ux/components/dist/native-modules/index.js
Module not found: Error: Can't resolve '#aurelia-ux/form' in 'C:\src\aurelia-ux-showcase\node_modules\#aurelia-ux\components\dist\native-modules'
# ./node_modules/#aurelia-ux/components/dist/native-modules/index.js 7:0-47 7:0-47 21:0-71 36:4-26
# ./src/main.ts
# ./node_modules/aurelia-webpack-plugin/runtime/empty-entry.js
# multi aurelia-webpack-plugin/runtime/empty-entry aurelia-webpack-plugin/runtime/pal-loader-entry aurelia-bootstrapper
ERROR in ./node_modules/#aurelia-ux/components/dist/native-modules/index.js
Module not found: Error: Can't resolve '#aurelia-ux/input' in 'C:\src\aurelia-ux-showcase\node_modules\#aurelia-ux\components\dist\native-modules'
# ./node_modules/#aurelia-ux/components/dist/native-modules/index.js 8:0-58 8:0-58 8:0-58 22:0-73 37:4-27
# ./src/main.ts
# ./node_modules/aurelia-webpack-plugin/runtime/empty-entry.js
# multi aurelia-webpack-plugin/runtime/empty-entry aurelia-webpack-plugin/runtime/pal-loader-entry aurelia-bootstrapper
ERROR in ./node_modules/#aurelia-ux/components/dist/native-modules/index.js
Module not found: Error: Can't resolve '#aurelia-ux/input-info' in 'C:\src\aurelia-ux-showcase\node_modules\#aurelia-ux\components\dist\native-modules'
# ./node_modules/#aurelia-ux/components/dist/native-modules/index.js 9:0-58 9:0-58 23:0-82 38:4-31
# ./src/main.ts
# ./node_modules/aurelia-webpack-plugin/runtime/empty-entry.js
# multi aurelia-webpack-plugin/runtime/empty-entry aurelia-webpack-plugin/runtime/pal-loader-entry aurelia-bootstrapper
ERROR in ./node_modules/#aurelia-ux/components/dist/native-modules/index.js
Module not found: Error: Can't resolve '#aurelia-ux/list' in 'C:\src\aurelia-ux-showcase\node_modules\#aurelia-ux\components\dist\native-modules'
# ./node_modules/#aurelia-ux/components/dist/native-modules/index.js 10:0-47 10:0-47 24:0-71 39:4-26
# ./src/main.ts
# ./node_modules/aurelia-webpack-plugin/runtime/empty-entry.js
# multi aurelia-webpack-plugin/runtime/empty-entry aurelia-webpack-plugin/runtime/pal-loader-entry aurelia-bootstrapper
ERROR in ./node_modules/#aurelia-ux/components/dist/native-modules/index.js
Module not found: Error: Can't resolve '#aurelia-ux/radio' in 'C:\src\aurelia-ux-showcase\node_modules\#aurelia-ux\components\dist\native-modules'
# ./node_modules/#aurelia-ux/components/dist/native-modules/index.js 11:0-58 11:0-58 11:0-58 25:0-73 40:4-27
# ./src/main.ts
# ./node_modules/aurelia-webpack-plugin/runtime/empty-entry.js
# multi aurelia-webpack-plugin/runtime/empty-entry aurelia-webpack-plugin/runtime/pal-loader-entry aurelia-bootstrapper
ERROR in ./node_modules/#aurelia-ux/components/dist/native-modules/index.js
Module not found: Error: Can't resolve '#aurelia-ux/switch' in 'C:\src\aurelia-ux-showcase\node_modules\#aurelia-ux\components\dist\native-modules'
# ./node_modules/#aurelia-ux/components/dist/native-modules/index.js 13:0-61 13:0-61 13:0-61 27:0-75 42:4-28
# ./src/main.ts
# ./node_modules/aurelia-webpack-plugin/runtime/empty-entry.js
# multi aurelia-webpack-plugin/runtime/empty-entry aurelia-webpack-plugin/runtime/pal-loader-entry aurelia-bootstrapper
ERROR in ./node_modules/#aurelia-ux/components/dist/native-modules/index.js
Module not found: Error: Can't resolve '#aurelia-ux/textarea' in 'C:\src\aurelia-ux-showcase\node_modules\#aurelia-ux\components\dist\native-modules'
# ./node_modules/#aurelia-ux/components/dist/native-modules/index.js 12:0-67 12:0-67 12:0-67 26:0-79 41:4-30
# ./src/main.ts
# ./node_modules/aurelia-webpack-plugin/runtime/empty-entry.js
# multi aurelia-webpack-plugin/runtime/empty-entry aurelia-webpack-plugin/runtime/pal-loader-entry aurelia-bootstrapper
Child html-webpack-plugin for "index.html":
Asset Size Chunks Chunk Names
index.html 1.36 MiB 0
Entrypoint undefined = index.html
[./node_modules/html-webpack-plugin/lib/loader.js!./index.ejs] 1.1 KiB {0} [built]
[./node_modules/lodash/lodash.js] 527 KiB {0} [built]
[./node_modules/webpack/buildin/global.js] (webpack)/buildin/global.js 509 bytes {0} [built]
[./node_modules/webpack/buildin/module.js] (webpack)/buildin/module.js 519 bytes {0} [built]
i ｢wdm｣: wait until bundle finished: /vendors.js
i ｢wdm｣: wait until bundle finished: /main.js
i ｢wdm｣: wait until bundle finished: /
× ｢wdm｣: ConcurrentCompilationError: You ran Webpack twice. Each instance only supports a single concurrent compilation at a time.
at Compiler.run (C:\src\aurelia-ux-showcase\node_modules\webpack\lib\Compiler.js:151:37)
at rebuild (C:\src\aurelia-ux-showcase\node_modules\webpack-dev-server\node_modules\webpack-dev-middleware\lib\context.js:81:24)
at done (C:\src\aurelia-ux-showcase\node_modules\webpack-dev-server\node_modules\webpack-dev-middleware\lib\context.js:59:7)
at AsyncSeriesHook.eval [as callAsync] (eval at create (C:\src\aurelia-ux-showcase\node_modules\webpack\node_modules\tapable\lib\HookCodeFactory.js:24:12), <anonymous>:18:1)
at AsyncSeriesHook.lazyCompileHook [as _callAsync] (C:\src\aurelia-ux-showcase\node_modules\webpack\node_modules\tapable\lib\Hook.js:35:21)
at emitRecords.err (C:\src\aurelia-ux-showcase\node_modules\webpack\lib\Compiler.js:203:22)
at Compiler.emitRecords (C:\src\aurelia-ux-showcase\node_modules\webpack\lib\Compiler.js:315:39)
at emitAssets.err (C:\src\aurelia-ux-showcase\node_modules\webpack\lib\Compiler.js:197:10)
at hooks.afterEmit.callAsync.err (C:\src\aurelia-ux-showcase\node_modules\webpack\lib\Compiler.js:301:14)
at AsyncSeriesHook.eval [as callAsync] (eval at create (C:\src\aurelia-ux-showcase\node_modules\webpack\node_modules\tapable\lib\HookCodeFactory.js:24:12), <anonymous>:15:1)
at AsyncSeriesHook.lazyCompileHook [as _callAsync] (C:\src\aurelia-ux-showcase\node_modules\webpack\node_modules\tapable\lib\Hook.js:35:21)
at asyncLib.forEach.err (C:\src\aurelia-ux-showcase\node_modules\webpack\lib\Compiler.js:298:27)
at done (C:\src\aurelia-ux-showcase\node_modules\neo-async\async.js:2854:11)
at C:\src\aurelia-ux-showcase\node_modules\neo-async\async.js:2805:7
at MemoryFileSystem.writeFile (C:\src\aurelia-ux-showcase\node_modules\memory-fs\lib\MemoryFileSystem.js:328:9)
at writeOut (C:\src\aurelia-ux-showcase\node_modules\webpack\lib\Compiler.js:284:29)

Answer 1

Change the command to au run --watch.
It should run using the dev environment by default, and there is a known issue with Webpack and the Aurelia CLI at the moment after one of the recent Webpack updates when running the application without the --watch flag.
Edit
Also, try installing dependencies with Yarn, npm install does not seem to be installing the packages correctly at the moment, however yarn install seems to work fine.
npm install yarn
yarn install