javascript - 带有 Webpack 和 Typescript 的 JQuery 插件(数据表)

标签 javascript typescript webpack

我正在尝试将 datatables JQuery 插件与 webpack 和 typescript 一起使用。我已经启动并运行了 JQuery 和打字(intelliSense 工作),对于数据表我只有 intelliSense,但是在我运行应用程序时构建 webpack 之后,代码在 $('#id').dataTable() 时失败行。

app.js:43Uncaught TypeError: $(...).dataTable 不是函数

我不知道如何正确附加这个插件,谁能帮帮我?

webpack.config.js如下; https://gist.github.com/marcingolenia/2fa78ed2cd42f9294da5edd22d351245

希望这一行能解决问题;

{ test: require.resolve("dataTables.net"), loader: "imports?define=>false,$=jquery"},

正如 import loader 的文档所说;

There are many modules that check for a define function before using CommonJS. Since webpack is capable of both, they default to AMD in this case, which can be a problem if the implementation is quirky.

datatables 提供了两者,所以我想使用 define=>false 禁用 AMD,如此处所述 https://www.datatables.net/forums/discussion/32542/datatables-and-webpack

现在我卡住了:(

最佳答案

你快到了!

确保通过 NPM 安装了 datatables.netdatatables.net-dt:

npm install datatables.net datatables.net-dt --save-dev

在你的入口文件./src/main.js中写:

require( 'datatables.net' )( window, $ )
require( 'datatables.net-dt' )( window, $ )

之后,任何格式为$(...).DataTable的代码逻辑都将作为DataTables主页上显示的示例。

关于javascript - 带有 Webpack 和 Typescript 的 JQuery 插件(数据表),我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/36791472/

相关文章:

javascript - 如何在MVC中将大量数据从AJAX发送到 Controller ?

javascript - 如何在 typescript 文件中正确导入 jquery-ui

linux - xdg-打开 : no method available for opening 'http://localhost:8080'

javascript - babel-loader 不转换 webpack.config.js

javascript - 保存条目后,nodejs mongoose 不会返回控制台

javascript - 为什么这两个 javascript 函数似乎无法相处......我做错了什么?

javascript - 上传文件Ext Js 2.2

javascript - 通过配置仅一个成功监听器,使用ajax加载未定义数量的文件内容

具有多个键到一个值的 Javascript Map 对象

Webpack 删除生产构建中的 HTML 注释