Webpack错误TS2339:类型'JQuery'上不存在属性'对话'

时间:2017-02-14 08:34:05

标签: javascript jquery typescript webpack

我的webpack.config.js是

var path = require('path');

module.exports = {
    entry: {
        'AdminPanel/AdminPanel': '../../client/scripts/AdminPanel/AdminPanel.ts',
        'Registration/Registration': '../../client/scripts/Registration/Registration.ts'
    },
    output: {
        filename: '[name].js',
        path: '../../src/client/scripts'
    },
    resolve: {
        extensions: ['.webpack.js', '.web.js', '.ts', '.js']
    },
    module: {
        loaders: [
            { test: /\.ts$/, loader: 'ts-loader' },
            { test: /\.css$/, loader: "style-loader!css-loader" },
            { test: /\.(woff|woff2|eot|ttf|svg)$/, loader: 'url-loader' },
            { test: /bootstrap\/dist\/js\/umd\//, loader: 'imports?jQuery=jquery' },
            { test: /\.(jpe?g|png|gif)$/i, loader: "file-loader" }
        ]
    }
}

package.json

的内容
{
  "name": "test",
  "version": "0.0.0",
  "description": "test",
  "main": "src/server.js",
  "author": {
    "name": "pratik"
  },
  "devDependencies": {
    "@types/body-parser": "^0.0.33",
    "@types/bootstrap": "^3.3.5",
    "@types/cookie-parser": "^1.3.30",
    "@types/express": "^4.0.35",
    "@types/express-handlebars": "0.0.29",
    "@types/jquery": "2.0.40",
    "@types/jqueryui": "^1.11.32",
    "@types/mysql": "0.0.31",
    "css-loader": "^0.26.1",
    "file-loader": "^0.10.0",
    "style-loader": "^0.13.1",
    "ts-loader": "^2.0.0",
    "url-loader": "^0.5.7",
    "webpack": "^2.2.1"
  },
  "dependencies": {
    "body-parser": "^1.16.1",
    "bootstrap": "^3.3.7",
    "cookie-parser": "^1.4.3",
    "express": "^4.14.1",
    "express-handlebars": "^3.0.0",
    "jquery": "^3.1.1",
    "jqueryui": "^1.11.1",
    "mysql": "^2.13.0"
  }
}

我的ts文件

import * as $ from 'jquery';
import 'jqueryui/jquery-ui.js';
import 'bootstrap/dist/css/bootstrap.css';
import 'jqueryui/jquery-ui.css';

$(document).ready(function () {
    alert('hi');
    let s = '<input class="date" type= "date" name= "txtFromUniversityDate" id= "txtFromUniversityDate" placeholder= "Please select joining date." > </p>';
    $('.container').dialog();
});

要生成编译版本,我在命令下运行:

tsc && webpack --config "../../webpack.config.js" --display-error-details --verbose --watch

但是我遇到了以下错误:

/client/scripts/AdminPanel/AdminPanel.ts中的错误 (9,21):错误TS2339:“JQuery”类型中不存在属性“对话框”。

有人可以帮我解决错误吗?

2 个答案:

答案 0 :(得分:1)

您需要为jQuery UI安装TypeScript定义。

答案 1 :(得分:0)

我认为它是webpack中的错误,或者它可能是一个功能。我在这里发布一个答案,以防将来有人需要它。在文件顶部添加对 d.ts 的引用与模块引用相同,解决了该问题。

/// <reference path="../../../node_modules/@types/jqueryui/index.d.ts" />

所有外部js文件也一样。