javascript - Webpacker 不适用于 jquery 库

Question

好吧，这确实是很奇怪的行为。以下是重现我的问题的步骤:

1. 运行yarn add jquery-filepond
2. 在application.js中添加导入'jquery-filepond'

就是这样!我在控制台中收到的错误是这样的:

Error: Cannot find module 'jquery-filepond'

看起来是一个非常愚蠢的错误，对吧？我不知道该怎么做。

Answer 1

解决问题的步骤(我在这里使用 npm，如果您愿意，请随意将其调整为 yarn):

1. 您需要自己安装 jQuery 和 FilePond 依赖项。

   npm i jquery filepond --save
   

2. 因为 jquery-filepond 要求 $、jQuery 和 FilePond 为全局变量命名空间(仅此一个是不行的):

   import { $, jQuery } from 'jquery';
   window.$ = $;
   window.jQuery = jQuery;
   import * as FilePond from 'filepond';
   window.FilePond = FilePond;
   

3. 最后，由于 jquery-filepond package.json 的“main”条目指向不存在的 index.js，因此您需要从该包中显式导入特定文件:

   import 'jquery-filepond/filepond.jquery';
   

我真的建议放弃这个插件，因为它的编程似乎非常糟糕(就像很多 - 特别是较旧的 - jQuery 插件一样)。

https://stackblitz.com/edit/js-ugyp8q