how to prevent typescript from adding imports in compiled files

Question

I'm building an electron js app with some js libraries like prismjs.

I tried adding @types/prismjs to my node modules and many other ways

but still typescript tries to import it import {something} from "prismjs" (in generated js file which I don't want it)

I have seen similar questions in stack overflow but none of them solved my issue.

app/ts config

{
    "compilerOptions": {
        "module": "ES2020",
        "target": "ES2021",
        "noImplicitAny": true,
        "removeComments": true,
        "allowUnreachableCode": false,
        "strictNullChecks": true,
        "strict": true,
        "noImplicitUseStrict": false,
        "alwaysStrict": true,
        "allowSyntheticDefaultImports": true,
        "typeRoots": ["../node_modules/@types"],
        "sourceMap": true
    }
}

app/script.ts

import { highlightElement } from "prismjs";

window.addEventListener("keyup", ev => {
    if (ev.key === "F5") window.location.reload();
});

const el = document.querySelectorAll("code")[1];
el.onkeyup = () => {
    highlightElement(el);
};

project structure enter image description here

So you don't want tsc to add `import {highlightElement} from "prismjs";`, but you are using it yourself in your file? do you want to bundle your project into a single file? if so, ts doesn't do that for you. you'll have to use a bundler like webpack — Sri, Sep 14 '21 at 08:20
@Sri If I don't use that import statement typescript won't recognize that library. also I don't have intellisense. as I searched, they said to do this with `npm i --save-dev @types/prismjs` but, still I see typescript importing the file. *(which according to posts I visit it shouldn't)* — A Programmer, Sep 14 '21 at 13:05
All Typescript does is transpile(conver) ur code to valid javascript. so if you import something in ts, it will be imported in js too. How else do you think js code will use that library? Which posts are you visiting that says it shouldn't? — Sri, Sep 14 '21 at 15:01
@Sri https://stackoverflow.com/questions/32050645/how-to-use-jquery-with-typescript this post. — A Programmer, Sep 14 '21 at 16:39

score 0 · Answer 1 · answered Sep 14 '21 at 16:43

However... After hours of researching I finally found a way to solve this question. thanks to this answer https://stackoverflow.com/a/55377372/16906284

adding the two lines below in tsconfig.json would solve that problem...

{
    ...
    "typeRoots": [ "node_modules/types" ],
    "types": [ "prismjs" ]
}

how to prevent typescript from adding imports in compiled files

1 Answers1