Angular 4 index.html won't load any script

Question

This is frustrating, I'm trying to load a simple script inside my index.html but I get 404.

index.html

<head>
  <meta charset="utf-8">
  <title>Login</title>
  <base href="/">
  <meta name="viewport" content="width=device-width, initial-scale=1">
  <link rel="icon" type="image/x-icon" href="favicon.ico">
</head>
<body>
  <app-root></app-root>
  <script type="text/javascript" src="./app/scripts/angular-cookies.js"></script>
</body>
</html>

This is my project structure

This is the error I get - 404

The file is there and it's not empty. I tried also:

<script type="text/javascript" src="../app/scripts/angular-cookies.js">

and

<script type="text/javascript" src="app/scripts/angular-cookies.js">

and

<script type="text/javascript" src="/app/scripts/angular-cookies.js">

Any help would be appreciated, thanks!

You're missing the first folder 'src' in your path to the scripts. — Mickers
– Mickers, Commented Jul 25, 2017 at 13:03
If you are using angular 2/4 this link maybe will help you to setup an external library inside your project thepolyglotdeveloper.com/2016/01/… — Marlon Barcarol
– Marlon Barcarol, Commented Jul 25, 2017 at 13:05
you need to put the file in assets and reference like: <script src="assets/yourfile.js">. I guess you're using Angular 2 so you should change angularjs tag — sTx
– sTx, Commented Jul 25, 2017 at 13:10
remember to do this to any other external resource like: scripts, styles, images, video etc. — sTx
– sTx, Commented Jul 25, 2017 at 13:20

sTx · Accepted Answer · 2017-07-25 13:38:27Z

5

As I've mentioned in comment, any external resource should be placed in assets folder and for your case referenced like <script type="text/javascript" src="assets/scripts/angular-cookies.js"> considering assets contains a folder named scripts which contains your angular-cookies.js file. After building the code the resulted www folder will be like:

assets -> which contains the external files
build -> which contains your ts files transpiled into js files
index.html
other files

answered Jul 25, 2017 at 13:38

sTx

1,28513 silver badges36 bronze badges

Sign up to request clarification or add additional context in comments.

Comments

Swarn Singh · Accepted Answer · 2017-07-25 13:03:59Z

0

Try this and it will be fine:

<script type="text/javascript" src="/src/app/scripts/angular-cookies.js">

Or maybe

<script type="text/javascript" src="src/app/scripts/angular-cookies.js">

answered Jul 25, 2017 at 13:03

Swarn Singh

1347 bronze badges

3 Comments

esseara Over a year ago

Sorry, it's not it.

Mickers Over a year ago

There's no way you 'have' to put the scripts in an assets folder... You can put your scripts anywhere you like and as long as you reference the path correctly (which I see you're doing it wrong in a few places) it will work. Only thing I can think of is if you're using some loading library I've never heard of that requires an assets folder...

Swarn Singh Over a year ago

Sometimes that is depend on your project structure, have a try and let me know(But i think it will make no difference.)

Collectives™ on Stack Overflow

Angular 4 index.html won't load any script

2 Answers 2

Comments

3 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

Comments

3 Comments

Your Answer

Sign up or log in

Post as a guest

Related