Ошибка компиляции машинописного текста и JQuery: не удается найти имя «$»

Я тестирую машинописный текст с помощью jquery, но когда я компилирую файл test.ts, он всегда выдает ошибку, указывающую: «Не удается найти имя '$'.

Я уже импортировал jquery и добавил ссылку на его определение. Если я использую import $ = require("jquery") в моем файле test.ts, при компиляции tsc возникнет еще одна ошибка "Cannot find module jquery". Однако папка JQuery уже существует в папке node_modules.

Кто-нибудь знает, как правильно использовать jquery в машинописном тексте?

Ниже приведены мои шаги:

  1. Установите jquery, используя npm install jquery --save
  2. Установите типизацию и определение jquery, используя typings install --global --save dt~jquery
  3. Добавьте ссылку на jquery вверху test.ts /// <reference path="../../../typings/globals/jquery/index.d.ts" />

tsconfig.json

{
    "compilerOptions": {
        "jsx": "react",
        "outDir": "./dist",
        "sourceMap": true,
        "noImplicitAny": true,
        "module": "commonjs",
        "target": "es5",
        "experimentalDecorators": true
    },
    "exclude": [
        "node_modules"
    ],
    "files": [
        "./typings/index.d.ts",
        "./src/wo/tests/test.ts",
    ]
}

test.ts

/// <reference path="../../../typings/globals/jquery/index.d.ts" />

let test:any=$("div");

typescript jquery typescript-typings
person Mark Yuan    schedule 09.07.2016    source источник
comment
Как вы компилируете проект? Также кажется, что ваше определение tsconfig.json неверно. Вы не можете использовать одновременно exclude и files (в этом случае выиграет files, так что, возможно, путь неверный). Также вам не нужно /// <reference, если используется tsconfig.json   -  person Aleksey L.    schedule 10.07.2016
comment
Вы можете сослаться на ссылку ниже для этого решения, его работа для использования $ и запроса всех функций в машинописном тексте. Ссылка: c-sharpcorner.com/article/typescript-with-jquery   -  person shital patel    schedule 25.04.2018

Ответы (5)


arrow_upward
39
arrow_downward

Если вы обнаружите эти ошибки в 90% случаев, это из-за проблем с версиями @types/jquery

Попробуйте запустить:

 npm install jquery --save

Затем в app.module.ts:

import * as $ from 'jquery';

Затем запустите:

  npm install @types/[email protected]

И вы должны быть готовы к работе.

person Ignatius Andrew    schedule 07.08.2017
comment
Это сработало для меня, хотя мне пришлось поместить jquery в строку типа import * as $ from "jquery";. IntelliJ выделяет его серым цветом как неиспользуемый импорт, но приложение будет компилироваться только с этой строкой. - person hughjdavey; 31.10.2017
comment
Последний шаг был тем, что мне нужно для [email protected] - person StingyJack; 18.03.2018
comment
Привет, @Ignatius Andrew, это сработало, но я получаю предупреждение вроде app/app.module.ts[14, 13]: Unused import: '$' - person praveen kumar; 26.04.2018
comment
Правин Кумар.. Добавьте пользовательские типы в «$» как тип «любой», он должен исчезнуть. - person Ignatius Andrew; 26.04.2018

arrow_upward
14
arrow_downward

Я не знаю, поможет ли это, но я решил ту же проблему для своего средства выбора даты.

Сначала я установил jQuery с помощью этой команды: npm install --save-dev @types/jquery

Затем добавьте зависимости в файл angular-cli.json:

"styles": [
            "../node_modules/bootstrap/dist/css/bootstrap.css",
            "../node_modules/font-awesome/css/font-awesome.css",
            "../node_modules/ng2-datetime/src/vendor/bootstrap-datepicker/bootstrap-datepicker3.min.css",
            "styles.css"
        ]

"scripts": [
            "../node_modules/jquery/dist/jquery.js",
            "../node_modules/ng2-datetime/src/vendor/bootstrap-datepicker/bootstrap-datepicker.min.js"
        ]

Я думаю, что добавление части jQuery может сработать для вас. Пожалуйста, дайте мне знать, если это работает.

person Nahid Shaiket    schedule 12.12.2016
comment
npm install --save-dev @types/jquery решает проблему. Спасибо. - person Shikhar; 21.12.2016
comment
Только это в сочетании с import * as $ from 'jquery'; решило мою проблему. - person fjch1997; 16.03.2018
comment
В angular 6 angular-cli.json становится angular.json, но мне не нужно было изменять раздел скриптов. Просто npm install --save-dev @types/jquery и import * as $ from 'jquery'; было достаточно для сборки ng - person Yuri Gridin; 24.07.2018

arrow_upward
1
arrow_downward

Установите и импортируйте следующий пакет. это будет решено для ошибки ("Не удается найти имя '$'"). Угловая версия 7

импортировать «datatables.net»;

person Ezhil Arasan    schedule 19.03.2019

arrow_upward
1
arrow_downward 

import * as $ from "jquery";

не работал для меня. Достаточно интересно,

import { ajax, css } from "jquery";

на самом деле решил мою проблему.

person ChillyWilly    schedule 26.02.2020

arrow_upward
-3
arrow_downward

Возможно, у вас есть какие-то уязвимости, которые нужно исправить.

Запустите npm audit fix, чтобы исправить их, или npm audit, чтобы узнать подробности.

person T.Dossev    schedule 24.07.2019