Typescript import syntax problems

Question

I'm new to Typescript and I've problems when I use import/export syntax in the browser. The terminal/compiler doesn't throw any kind of error. But google's console says:

GET http://127.0.0.1:5500/public/modules/file1.mod net::ERR_ABORTED 404 (Not Found)

Simply, I want to import a module inside my main file(main.ts)

index.html

<script type="module" src="./main.js"></script>

tsconfig.json

"module": "ES2015",                          
"rootDir": "./src/",   
"target": "ES2016",                                 
"lib": ["DOM", "ES2019"],  
"esModuleInterop": true,

this is main.ts and it has to import a simple constant(pigreco)

import { pigreco } from './modules/file1.mod'; 
console.log(pigreco);

Well do you have a /modules/file1.mod module (and does your setup serve it to the browser)? — Bergi
– Bergi, Commented Feb 8, 2022 at 18:52
Well the error message says that you aren't doing it. What web server are you using? Where is that file1.mod located? What are its contents? — Bergi
– Bergi, Commented Feb 9, 2022 at 11:32
@Bergi The main problem is: Typescript alone can transpile a code that can be read by the browser? ES6 or CommonJS can be understood by Google etc.? Am I forced to use Webpack/Rollup etc.? — hyden97
– hyden97, Commented Feb 9, 2022 at 11:41

saeid Ghorbani · Accepted Answer · 2022-03-16 15:45:36Z

1

just add .ts to the end of your import.
import { pigreco } from './modules/file1.mod.ts';
it should work.

answered Mar 16, 2022 at 15:45

saeid Ghorbani

114 bronze badges

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

Collectives™ on Stack Overflow

Typescript import syntax problems

1 Answer 1

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Your Answer

Sign up or log in

Post as a guest

Related