如何在parcel(bundler)中使用jQuery和jQuery-ui?

okr*_*ram 17 jquery jquery-ui parcel

我通过npm安装了jquery(3.2.1)和jquery-ui-dist(1.12.1).(它们不包含在html中的脚本标记中)

在客户端脚本中我使用:

window.$ = require('jquery');// plain jQuery stuff works fine
import 'jquery-ui-dist';     // breaks whole jQuery, with Error (missing module 8)
Run Code Online (Sandbox Code Playgroud)

Mar*_*ane 30

今天我遇到了类似问题的angularjs应用程序和parcel-bundler.看来parcel不能很好地处理外部模块中引入的全局变量(现在?).还有其他问题.

一种方法; 您可以使用普通需求而不是像这样的导入:

var jquery = require("jquery");
window.$ = window.jQuery = jquery; // notice the definition of global variables here
require("jquery-ui-dist/jquery-ui.js");

$(function() {
  $("#datepicker").datepicker();
});
Run Code Online (Sandbox Code Playgroud)

如果您坚持使用导入,则应创建一个单独的文件,例如import-jquery.js使用以下内容调用它:

import jquery from "jquery";

export default (window.$ = window.jQuery = jquery);
Run Code Online (Sandbox Code Playgroud)

并将其导入主文件中:

import "./import-jquery";
import "jquery-ui-dist/jquery-ui.js";

$(function() {
  $("#datepicker").datepicker();
});
Run Code Online (Sandbox Code Playgroud)

我希望我们能在不久的将来得到更好的支持.

  • 我可以说,直到今天,Parcel 仍然不完全支持这些模块引发的全局变量。 (3认同)