javascript - React中Chessboardjs NPM包，referenceError $ is not Defined

Question

我正在尝试使用https://www.npmjs.com/package/chessboardjs包裹。我编写了简单的 react 组件来渲染棋盘，但它在 chessboardjs 模块中抛出错误:ReferenceError:$未定义。组件代码:

import React, { Component } from 'react';
import Chess from 'chessboardjs';

export default class ChessBoard extends Component {
    render() {
        return (
            <div>
                <div id="chessboard" style={{"width": "400px"}}></div>
            </div>
        )
    }

    componentDidMount() {
        var board = Chess('chessboard');
    }
}

我已经尝试安装 JQuery npm 包并将其导入 ChessBoard 组件，但遗憾的是它不起作用。

有办法解决这个问题吗？

Answer 1

我认为你应该将 $、jQuery、window.jQuery 变量导入到所有模块中。 如果你使用webpack1，你可以这样尝试:

providePlugin = new webpack.ProvidePlugin({
    $: "jquery",
    jQuery: "jquery",
    "window.jQuery": "jquery"
  }),