Cannot use import in javascript

I have a problem that confused me! I am creating a desktop app based on javascript and HTML/CSS in the frontend and using tauri for providing Rust as the backend. the Tauri just provides backend and some works to app be able for running on desktop, and we can use what we prefer in frontend. so I use jquery as js library. it works with some js package managers like npm or yarn. I use yarn for it.

WHAT IS THE PROBLEM:

In a piece of code, I need to import some Tauri modules into my script.js file. but, there is some problem that I try to resolve them but they made me confused.

this is my script tags in the main HTML file:

<script src="../node_modules/@fortawesome/fontawesome-free/js/all.js"></script>
<script src="./app/Jquery.js"></script>
<script src="./chart/apexcharts.js"></script>
<script src="./script.js"></script>

the script.js is my main js file.

WHICH METHODS I TRIED:

so in script.js I use import statement as below:

import { appWindow } from "../node_modules/@tauri-apps/api/window.ts";

const childwin = appWindow.open("new.html");

so the first error will show itself now:

SyntaxError: Unexpected token '{'. import call expects exactly one argument.

I don't know why this error, but I removed {s:

SyntaxError: Unexpected identifier 'appWindow'. import call expects exactly one argument.

Oh God! what is it?! I search it, somebody says use type attribute in script tag. OK:

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

result:

TypeError: 'text/html' is not a valid JavaScript MIME type.

damn! so I search it and some others say: oh, do you use type attribute?? go and remove it :(

and now I'm confused and I'm thankful if somebody help me :)

EDIT: A friend said the problem is with the .ts file I am importing because the browser (or web engine) cannot support it. but I also try importing .js file and it leads to the same error too:

SyntaxError: Unexpected identifier 'loadReport'. import call expects exactly one argument.