将羊驼导入 React.js

我正在尝试在 React 应用程序中使用羊驼形式：

import React, { useEffect, useRef } from "react";
import $ from "jquery";
import * as popper from "popper.js";
import * as bootstrap from "bootstrap";
import * as handlebars from "handlebars";
import alpaca from "alpaca";

var jp = require('jsonpath');

export default function Form() {
    useEffect(() => {
        $("#form").alpaca({
        });
    }, []);

    return <>
        <h2>Alpaca Form</h2>
        <div id="form"/>
    </>;
}

webpack 编译了这个，但在浏览器中我看到了这条消息：

jquery__WEBPACK_IMPORTED_MODULE_1___default(...)(...).alpaca is not a function

运行“npm start”时，浏览器错误显示：ReferenceError：jQuery 未定义。

Alpaca 需要handlebars.js，因此您需要在导入alpaca.js 之前导入它。您可以尝试一下并判断这是否适合您吗？