My objective is to develop an Angular web component, that I can use in my "normal" parent SPA - and a Wordpress site.

When consuming the web component on the Wordpress site, I package everything together in a single bundle with ngx-build-plus.. This works great.

However, when serving the web component for my parent Angular application, I would like to avoid having Angular part of the bundle (since it's already there). I follow the blog/guide for differential loading described in the readme - but I'm stuck with this error (root.component is the name of my web component).

root.component.ts:10 Uncaught TypeError: Cannot read property 'ɵɵdefineComponent' of undefined
    at root.component.ts:10
    at Module../src/app/root.component.ts (root.component.ts:16)
    at __webpack_require__ (bootstrap:19)
    at Module../src/app/app.module.ts (app.module.ts:1)
    at __webpack_require__ (bootstrap:19)
    at Module../src/main.ts (main.ts:1)
    at __webpack_require__ (bootstrap:19)
    at Object.0 (main.ts:22)
    at __webpack_require__ (bootstrap:19)
    at bootstrap:83
    at bootstrap:83

I get the above error when serving with:

ng s --extra-webpack-config projects/<name-of-project>/webpack.externals.js --output-hashing=none --project eddy-library --single-bundle

As described it works fine with (but it creates big bundle - containing angular).

ng s --project <name-of-project> --single-bundle

Any help is very welcome. I tried copying everything from the sample repos, but to no help

0

There are 0 answers