angular-cli: 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
- create a new project with CLI
- generate an app-shell with cli schematics
ng generate app-shell --client-project shell-error --universal-project shell-error
- install an es6 lib
npm install --save lodash-es
- add an import to an es6 lib (something from lodash-es in this case)
- 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
About this issue
- Original URL
- State: closed
- Created 6 years ago
- Reactions: 6
- Comments: 15 (4 by maintainers)
We should bundle the third-party dependencies with webpack so that it transpiles the ESModule syntax
@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.
@alan-agius4
Let’s meet and decide how to document this and how to setup the app-shell schematics.