Hello,
I’m brand new at programming angular applications and I’m a bit confused about what’s happening when I route to a certain page. The page is called index.html and it looks like this:
<!DOCTYPE html>
<html>
<head>
<base href="/landing/">
<title>ACM Risk Alive - Landing Page</title>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="shortcut icon" href="/favicon.ico" type="image/x-icon">
<link rel="icon" href="/favicon.ico" type="image/x-icon">
<link href="css/themes/indigo-pink.css" rel="stylesheet">
<link href="https://fonts.googleapis.com/css?family=Roboto:200,300,400,500" rel="stylesheet">
</head>
<body>
<my-app>Loading...</my-app>
</body>
<!-- Google Analytics -->
<script>
(function(i,s,o,g,r,a,m){i['GoogleAnalyticsObject']=r;i[r]=i[r]||function(){
(i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new Date();a=s.createElement(o),
m=s.getElementsByTagName(o)[0];a.async=1;a.src=g;m.parentNode.insertBefore(a,m)
})(window,document,'script','https://www.google-analytics.com/analytics.js','ga');
ga('create', 'UA-84478854-1', 'auto');
ga('send', 'pageview');
</script>
<!-- Intercom -->
<script>
window.intercomSettings = {
app_id: "k37j0e9b"
};
</script>
<script>(function(){var w=window;var ic=w.Intercom;if(typeof ic==="function"){ic('reattach_activator');ic('update',intercomSettings);}else{var d=document;var i=function(){i.c(arguments)};i.q=[];i.c=function(args){i.q.push(args)};w.Intercom=i;function l(){var s=d.createElement('script');s.type='text/javascript';s.async=true;s.src='https://widget.intercom.io/widget/k37j0e9b';var x=d.getElementsByTagName('script')[0];x.parentNode.insertBefore(s,x);}if(w.attachEvent){w.attachEvent('onload',l);}else{w.addEventListener('load',l,false);}}})()</script>
<script src="/client/common.js"></script>
<script src="/client/landing.js"></script>
</html>
For some reason, when I go to the page, I get an error in the Chrome console:
It says: Unexpected SyntaxError: Unexpected token <
Note that it’s encountering this error in landing.js, which is an autogenerated javascript file it places in the dist folder. This is normal. It does it for every one of our other pages… except for all our other pages, it generates the javascript from the corresponding typescript file. What I’m wondering about this case is: why is it generating landing.js from index.html? Why would it just copy the contents of an html page into a javascript file and then try to run it. Of course it’s going to encounter an unexpected token!
Like I said, I’m new to angular programming and I’m sure I’m missing something here. Please enlighten me. Thanks.