The webpage seems to be having trouble reading script tags. It could be related to JavaScript or Angular. An error

Hey, I've run into some errors in my code and could use some help...

GET file:///C:/bower_components/angular/angular.min.js net::ERR_FILE_NOT_FOUND
index.html:19 GET file:///C:/bower_components/angular/angular-route.min.js net::ERR_FILE_NOT_FOUND
index.html:20 GET file:///C:/something.js net::ERR_FILE_NOT_FOUND
index.html:21 GET file:///C:/controller.js net::ERR_FILE_NOT_FOUND

I have a feeling it has something to do with the script tags....

<!DOCTYPE html>
<html ng-app="MyApp">
<head>
    <meta charset="utf-8">
    <title></title>
    <base href="/" />
</head>
<body ng-controller="MainController as main">
    <a ui-sref="Page1">Page 1</a> | <a ui-sref="Page2">Page 2</a> | <a ui-sref="Nowhere">Nowhere</a>
    <hr />
    $state.current.templateUrl = {{main.$state.current.templateUrl}}
    <hr />

    <ui-view></ui-view>



        <script src="/bower_components/angular/angular.min.js"></script>
        <script src="/bower_components/angular/angular-route.min.js"></script>
        <script src="/something.js"></script>
        <script src="/controller.js"></script>

</body>
</html>

I'm really not sure what's going on here. My teacher insists the syntax is correct, but I can't figure out the issue.

Answer №1

By using root-relative URIs like src="/controller.js", your browser will search from the root of the location where your files are hosted, instead of starting from the current directory.

For instance, if you have HTML files stored on your disk at C:\Users\You\Project\Index.html, including a leading slash in the URI would make the browser look for C:/controller.js rather than

C:\Users\You\Project\Controller.js
.

To avoid this issue, consider removing the leading slash or opt for serving your project through a webserver.

Similar questions

If you have not found the answer to your question or you are interested in this topic, then look at other similar questions below or use the search

My app.js failed to launch on Heroku, receiving a Code H10 status 503 error

Starting with some screenshots: https://i.sstatic.net/E0pyj.png https://i.sstatic.net/SkZDv.png https://i.sstatic.net/HJ3Iw.png https://i.sstatic.net/LKFv2.png The full error log is below: 2020-06-15T10:46:45.640400+00:00 heroku[web.1]: Starting pro ...

Retrieving journal web addresses using the CORE API

I am currently working on pulling journal data from the CORE API in React, specifically focusing on obtaining the title and URL of each journal. My goal is to create clickable links that direct users to the specified URLs. { "identifiers": [ ...

Utilize the event bus by calling `this.$root.$emit` command

I recently implemented a basic Event bus in my application to dynamically change styles on a page, and it's functioning correctly. The event bus is triggered using the $emit and $on methods as shown below: EventBus.$on and EventBus.$emit('call ...

Mastering regular expressions in TypeScript

My goal is to perform linting on staged files that are either .ts or .tsx and located within the src folder. I am aware that for selecting all js files one can use "*.js": [--list of commands--] inside the lint staged property. I'm curious to learn m ...

SuperTest app encounters an error: App is not recognized

I am currently delving into the world of test driven development and am taking on the challenge of using supertest to enhance my skills. I am facing an issue where I keep encountering the error message "app is not defined" when making calls to request(app) ...

Update a Div, Table, or TR element without the need for a page reload or Ajax usage

How can I refresh a div, table or <tr>? The data displayed is not coming from a database, it's just a simple error block and the value comes from Java-script. The issue arises when a user inputs a value in a textbox, the value gets stored in th ...

What are the steps to utilize vue.js for dynamically adjusting my sidebar based on a URL input?

Greetings to the amazing community of Vue.js enthusiasts, I am a novice looking to develop a single-page web application using vue.js. This application will consist of a fixed header and dynamic body content that changes based on user interactions. Here&a ...

What is the mechanism by which Redux sends state to mapStateToProps?

I'm currently delving into the inner workings of React and Redux, and recently came across FuelSavingsPage.js in this sample project. While I grasp how actions is obtained in mapDispatchToProps, I am uncertain about how state is passed to mapStateToPr ...

Unable to retrieve the content of Material UI Textfield

I'm new to React and I need help with my login page that uses Firebase authentication. I have an input field to capture the user's contact information for validation, but I'm having trouble retrieving this data. I've tried various solut ...

JavaScript: End the program upon clicking CANCEL

Scenario: In my application, there is a confirmation pop-up message that appears when I try to save an entry. Clicking the OK button proceeds with saving the entry, while clicking the CANCEL button should go back to the booking content page - this functio ...

I keep encountering a double key error - MongoError: E11000 for the duplicate key error in my database. I currently have two collections set up: one for users and another

I am currently working on a project that requires the following flow: Registration -> Login -> Profile Creation -> The secret page. I have successfully implemented the registration and login routes, but I encountered an error while saving data for ...

What is a method to pull out numerical values from a text in JavaScript without the use of regular expressions?

Consider this scenario: I have a string "asdf123d6lkj006m90" and I want to extract the values [123, 6, 0, 0, 6, 90]. My attempt so far is as follows: let str = "asdf123d6lkj006m90" let func = function(inputString){ let outputArray = [] le ...

Exploring Time Zone functionality with mongooseJS

I am facing an issue where the current date of each record is being saved in a different time zone than intended, var mongoose = require('mongoose'), Schema = mongoose.Schema; var TicketSchema = new Schema({ created:{ type: Date, ...

How can I set the background of specific text selected from a textarea to a div element?

Is it possible to apply a background color to specific selected text from a Text area and display it within a div? let elem = document.getElementById("askQuestionDescription"); let start = elem.value.substring(0, elem.selectionStart); let selection = ...

Why does the browser keep converting my single quotation marks to double, causing issues with my JSON in the data attribute?

This task should be straightforward, but I seem to be facing a roadblock. I am trying to insert some JSON data into an input's data attribute, but the quotes in the first key are causing issues by prematurely closing the attribute. Here is the code ...

Introducing the World of Wordpress Blogging

How can I create an introduction on my WordPress site similar to the one found at ? I am specifically interested in incorporating the expanding horizon line effect. It seems like it may just be a GIF that plays and then fades into the homepage. Are there ...

The HTML generated by Angular does not display as anticipated

When converting the angular-generated HTML to a PDF using jspdf, it does not take into consideration angular classes like ng-hide. This means that elements styled with the ng-hide class will still appear in the generated PDF. To see an example, visit the ...

In WordPress, the magic_quotes feature is essential for json_decode to function properly

In my current project on the client side, I am dealing with an array of JavaScript objects. Upon submission, this array needs to be sent to PHP using a form and then further manipulated on the server-side. As I work on building or modifying the array of o ...

What is causing the color to be replaced by the latest selection?

I'm having trouble drawing three lines with different colors. They all end up being the same color, which is the last color specified in my code snippet below: function initObject() { var lineLength = 10; geometry = new THREE.Geometry ...

Send a file from a form using Gatsby to getform.io using the axios library

I am facing an issue with my getform.io form where the file is not getting uploaded properly. The file appears as [] and the files tab remains empty. Upon checking the network tab, I noticed that my request payload includes {email: "[email protec ...