How to allow typescripty to do import?

Question

typescript

I want to connect Jquery, and then the problem arises, that the Internet says you need to connect it.
Here is my
main.ts code

import $ from 'jquery';

$(document).ready(function(){
    $('.modal').modal();
});

package.json configs

{
 ...
  "dependencies": {
    "@types/jquery": "^3.3.29",
    "@types/materialize-css": "^1.0.6",
    "jquery": "^3.4.1"
  }
}

tsconfig.ts

{
  "compilerOptions": {
    /* Basic Options */
    "target": "es5",                          /* Specify ECMAScript target version: 'ES3' (default), 'ES5', 'ES2015', 'ES2016', 'ES2017','ES2018' or 'ESNEXT'. */
    "module": "commonjs",                     /* Specify module code generation: 'none', 'commonjs', 'amd', 'system', 'umd', 'es2015', or 'ESNext'. */
    /* Strict Type-Checking Options */
    "strict": true,                           /* Enable all strict type-checking options. */
    "esModuleInterop": true                   /* Enables emit interoperability between CommonJS and ES Modules via creation of namespace objects for all imports. Implies 'allowSyntheticDefaultImports'. */
  }
}

And they compile normally without errors, but the error appears in the browser
Uncaught ReferenceError: exports is not defined
AND the compiled file

"use strict";
var __importDefault = (this && this.__importDefault) || function (mod) {
    return (mod && mod.__esModule) ? mod : { "default": mod };
};
Object.defineProperty(exports, "__esModule", { value: true });
var jquery_1 = __importDefault(require("jquery"));
jquery_1.default(document).ready(function () {
    jquery_1.default('.modal').modal();
});

I don't understand how to be here. It seems that I connected npm install common.js, but I have node 11.12.0 and there is already commonJS. How to solve this error?
Using typescript 3.4.1