App-shell devkit builder doesn't support ES6 imports

Bug Report or Feature Request (mark with an x)

- [x] bug report -> please search issues before submitting
- [ ] feature request

Command (mark with an x)

- [ ] new
- [ ] build
- [ ] serve
- [ ] test
- [ ] e2e
- [ ] generate
- [ ] add
- [ ] update
- [ ] lint
- [ ] xi18n
- [x] run
- [ ] config
- [ ] help
- [ ] version
- [ ] doc

Versions

node v10.11.0 npm 6.4.1 ng 7.1.2 macOS Mojave / High Sierra

Repro steps

1. create a new project with CLI
2. generate an app-shell with cli schematics ng generate app-shell --client-project shell-error --universal-project shell-error
3. install an es6 lib npm install --save lodash-es
4. add an import to an es6 lib (something from lodash-es in this case)
5. run the app shell builder ng run shell-error:app-shell

The log given by the failure

Unexpected token export
/Users/camsden/shell-error/node_modules/lodash-es/lodash.js:10
export { default as add } from './add.js';
^^^^^^

SyntaxError: Unexpected token export
    at new Script (vm.js:79:7)
    at createScript (vm.js:251:10)
    at Object.runInThisContext (vm.js:303:10)
    at Module._compile (internal/modules/cjs/loader.js:657:28)
    at Object.Module._extensions..js (internal/modules/cjs/loader.js:700:10)
    at Module.load (internal/modules/cjs/loader.js:599:32)
    at tryModuleLoad (internal/modules/cjs/loader.js:538:12)
    at Function.Module._load (internal/modules/cjs/loader.js:530:3)
    at Module.require (internal/modules/cjs/loader.js:637:17)
    at require (internal/modules/cjs/helpers.js:20:18)
    at Object.lodash-es (/Users/camsden/shell-error/dist/shell-error-server/main.js:625:18)
    at __webpack_require__ (/Users/camsden/shell-error/dist/shell-error-server/main.js:20:30)
    at Module../src/app/app-shell/app-shell.component.ts (/Users/camsden/shell-error/dist/shell-error-server/main.js:223:67)
    at __webpack_require__ (/Users/camsden/shell-error/dist/shell-error-server/main.js:20:30)
    at Module../src/app/app.server.module.ts (/Users/camsden/shell-error/dist/shell-error-server/main.js:423:88)
    at __webpack_require__ (/Users/camsden/shell-error/dist/shell-error-server/main.js:20:30)

Desired functionality

Should be able to build the app shell with es6 imports.

Mention any other details that might be useful

It looks like there might be a webpack loader or a build step missing for the app-shell builder. https://github.com/ca136/cli-shell-error

[alexeagle]

We should bundle the third-party dependencies with webpack so that it transpiles the ESModule syntax

[alan-agius4]

@phetw, in this case it doesn’t matter which component to render, as it will fail during parsing not execution.

Can someone please verify it this issue is still present in version 9? Thanks.