Why does the "Zone already loaded" error occur when using several angular applications on one page?

A

Al2018-05-13 04:31:29

Angular

Al, 2018-05-13 04:31:29

There are several applications on one page:

<body>
        <h1>First-app</h1>
        <dr-first-app></dr-first-app>
        <h1>Second-app</h1>
        <dr-sec-app></dr-sec-app>

<script type="text/javascript" src="/js/first-app/runtime.js"></script>
<script type="text/javascript" src="/js/first-app/polyfills.js"></script>
<script type="text/javascript" src="/js/first-app/vendor.js"></script>
<script type="text/javascript" src="/js/first-app/main.js"></script>

<script type="text/javascript" src="/js/second-app/runtime.js"></script>
<script type="text/javascript" src="/js/second-app/vendor.js"></script>
<script type="text/javascript" src="/js/second-app/main.js"></script>
</body>

I collect each of the command: ng build app-name.
As a result, they work on the same page, but I get an error:
zone.js:32 Uncaught Error: Zone already loaded
I think this error occurs due to the fact that each bundle has a zone.js . But is it possible to take zone.js out of the bundle into a single copy and include it on the page as a separate file? If I'm right, then perhaps in this way it is necessary to take something else out of the bundles and connect it separately, thereby reducing the size of the application files.

Reply

Answer the question

In order to leave comments, you need to log in

1 answer(s)

S

sasha, 2018-05-13
@madmages

delete runtime.js and vendor.js in the second block