Using a library having typescript d.ts?

M

Makushimu2021-03-14 16:24:02

typescript

Makushimu, 2021-03-14 16:24:02

I'm learning typescript.
Faced the problem of connecting the axios library.

main.ts file:

/// <reference path="../node_modules/axios/index.d.ts" />
//import axios from 'axios';

export function ok_lets_go()
{
  axios.get('https://ya.ru')
  .then((response) => {
    console.log(response.data);
    console.log(response.status);
  });
}

If you uncomment the import line in the code, then everything compiles perfectly without errors. But then this same import line gets into the Js code and the browser (Edge based on Chromium) swears at it. If you leave the line
//import axios from 'axios';

/// <reference path="../node_modules/axios/index.d.ts" />

Then there are copy errors.

error TS2304: Cannot find name 'axios'.

error TS7006: Parameter 'response' implicitly has an 'any' type.

The file axios/index.d.ts is located, I tried to set a deliberately incorrect name - an error message appears that the file was not found.

index.html file:

<!DOCTYPE html>
<meta charset="utf-8">
<html>
  <head>
    <title>eXtodo</title>
    <meta name="google" content="notranslate">
    <meta http-equiv="Content-Type" content="text/html; Charset=utf-8">
    <script type="text/javascript" src="./build/axios.js"></script>
  </head>

  <body>
    <div id='app'></div>

    <script type="module">
      import {ok_lets_go} from './build/main.js';
      ok_lets_go();
    </script>
  </body>
</html>

tsconfig.json file

{
  "compilerOptions": {
    "target": "ES6",
    "module": "es6",
    "sourceMap": true,
    "outDir": "./build",
    "strict": true,
    "moduleResolution": "node",
    "esModuleInterop": true,
    "skipLibCheck": true,
    "forceConsistentCasingInFileNames": true,
    "types": ["node"]
  },
  "compileOnSave": true,
  "include": ["./src"],
}