CODEWITHSUNDEEP
javascripthtml
prabhatojha
prabhatojha

Reputation: 2085

Import external html containing script tag - doesn't work

I have an index.html

<!doctype html>
<html lang="en">
<head>
  <meta charset="utf-8">
  <title>MyApp</title>
  <link rel="import" href="./common.html">
</head>
<body>
  <app-root></app-root>
</body>
</html>

and an external HTML file common.html which contains a script tag

<script>
  window.MY_APP = {
    MY_SETTINGS: {}
  }
</script>

As you can see I am importing common.html in index.html. The problem is that MY_APP becoming undefined after a successful render of index.html. I could see success call to common.html file in the network tab(Testing in Chrome browser - V 80.**).

This used to work seamlessly earlier but now broken.

Did anyone face this problem? or does anyone know what is happening? Thanks in Advance.

Upvotes: 0

Views: 55

Answers (1)

Sydney Y
Sydney Y

Reputation: 3152

HTML imports were recently depreciated by Chrome, which would explain why this used to work for you and doesn't any longer.

https://www.chromestatus.com/feature/5144752345317376

In the decision thread they mention polyfills and something called Shadow DOM V0, so those might be alternatives for you.

This feature was Chrome-specific so it was removed.

Upvotes: 2

Related Questions