CODEWITHSUNDEEP
javascriptreactjs
Os Snehith Ab
Os Snehith Ab

Reputation: 87

importing one java script file to another file error

I have 3 files one HTML, 2 javascript files named app.js and customer .js

I have an HTML page on which I have written this

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>
<body>
    hello
    <script src="app.js" type="module"></script>
</body>
</html>

I just loaded app.js into this page

app.js contains this

import {person} from "./customer";
console.log("helllo");

and in customer.js i have this

const person={
    name:"hello"
}

export default person;

I am getting an import error the error shows

GET http://127.0.0.1:5500/customer net::ERR_ABORTED 404 (Not Found)

I am new to web development, please help me.

Upvotes: 2

Views: 1219

Answers (2)

Alexandra
Alexandra

Reputation: 1

if you got a:

1) index.html:1 Access to script at 'file://$PATH'  from origin 'null' has been blocked by CORS policy:  Cross origin requests are only supported for protocol schemes:  http, data, isolated-app, chrome-extension, chrome, https, chrome-untrusted.

2) GET file://$PATH net::ERR_FAILED

You need to use local-web-server, for example Live Server in VS Code.

Upvotes: -1

Code Fingers
Code Fingers

Reputation: 301

Here, the way you are importing it is wrong.

Let me explain. First of all, I can see that you are default exporting the module or whatever. In that case, you don't need those curly brackets.

import person from "./customer.js";

Second, just make sure that in your package.json you have "type" set to "module" just like this

"type": "module",

Third, if you are using VSCode, then you can right-click on your customer.js file and click on copy relative path to get its relative path from your project.

Summary:

  1. Correct your import statement
  2. Check if package.json is correct
  3. Copy relative path using VSCode

Hope this helps to solve your query!

Upvotes: 1

Related Questions