An import path cannot end with a '.ts' extension.

[timotius02]

Getting this error in my build when trying out the library. Probably due to the .ts ending in the name of the library.

Currently using the default Typescript environment setup w/ Remix.

[Moebits]

You need to set moduleResolution to node intsconfig.json, otherwise it thinks you are importing a local file named youtube.ts. Having ".ts" extension in module names is allowed and I've never had issues with it.

{
    "compilerOptions": {
      "moduleResolution": "node"
    }
}

[timotius02]

I already had module resolution to node. This is my exact tsconfig.

{
  "include": ["remix.env.d.ts", "**/*.ts", "**/*.tsx"],
  "compilerOptions": {
    "lib": ["DOM", "DOM.Iterable", "ES2019"],
    "isolatedModules": true,
    "esModuleInterop": true,
    "jsx": "react-jsx",
    "moduleResolution": "node",
    "resolveJsonModule": true,
    "target": "ES2019",
    "strict": true,
    "baseUrl": ".",
    "paths": {
      "~/*": ["./app/*"]
    },

    // Remix takes care of building everything in `remix build`.
    "noEmit": true
  }
}

[Moebits]

Then the error is being generated by your linter, not the typescript compiler. You need to find any rules that say "no import with .ts extension" in your linter config and disable it.

[timotius02]

It seem like it is not a linting issue. I've tried ignoring the line and disabling my whole linter but it is still erroring. The only way to get it to not error is to use @ts-ignore but that makes the library lose all of its typings. Update: I'm able to use Moq.ts perfectly fine, but not this library.

[Moebits]

Using @ts-ignore should not make it lose all of its typings. At least, this is not what should happen in Visual Studio Code. It might be different in other IDE's because displaying the typings is an IDE feature. I suspect that the error you're having is also an IDE error if it is not the ts compiler or linter. I would try switching over to VS Code.

[timotius02]

I am also already using VS Code, and yes they do disappear.

[Moebits]

I hate stating the obvious, but you need to reinstall because all your issues sound like you don't have it installed.

npm uninstall youtube.ts
npm install youtube.ts

Also, does this issue occur on a vanilla typescript project (no frameworks like Remix). If it doesn't, you know that it's because of some compiler/linter config set by Remix that you have to change.

[codetheweb]

I'm running into the same issue with a fairly vanilla Typescript config:

{
  "compilerOptions": {
    "lib": ["ES2019", "DOM"],
    "target": "es2018",
    "module": "ES2020",
    "moduleResolution": "node",
    "declaration": true,
    "strict": true,
    "experimentalDecorators": true,
    "esModuleInterop": true,
    "sourceMap": true,
    "resolveJsonModule": true,
    "noEmit": true
  },
  "include": ["src"],
  "exclude": ["node_modules"]
}

yarn tsc:

Error: src/services/third-party.ts(3,21): error TS2691: An import path cannot end with a '.ts' extension. Consider importing 'youtube.js' instead.
Error: src/services/youtube-api.ts(5,58): error TS2691: An import path cannot end with a '.ts' extension. Consider importing 'youtube.js' instead.

[Moebits]

Okay, I renamed the file Youtube.ts to youtube.ts which should fix an issue on case-sensitive file systems, update to v0.2.8.

[codetheweb]

Thanks!