Javascript 在React中无法访问jQuery插件_Javascript_Jquery_Reactjs

Javascript 在React中无法访问jQuery插件

javascript jquery reactjs

Javascript 在React中无法访问jQuery插件,javascript,jquery,reactjs,Javascript,Jquery,Reactjs,我尚未成功将以下jQuery插件导入我的React应用程序： index.html <!DOCTYPE html> <html lang="en"> <head> <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.4.1/jquery.min.js"></script> <script src="http://bililite.com/inc/

我尚未成功将以下jQuery插件导入我的React应用程序：

index.html

<!DOCTYPE html>
<html lang="en">

<head>
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.4.1/jquery.min.js"></script>
    <script src="http://bililite.com/inc/jquery.parsecss.js"></script>
</head>

<body>
<div id="root"></div>
</body>

</html>

jQuery函数parsecss未定义。

使用脚本标记将其添加到my index.html中无效。只有将其作为节点模块添加并导入时，它才起作用。当然，许多jquery插件在使用npm时是不可用的，所以我必须创建自己的包。这其实很简单。在node_modules文件夹中，我创建了一个名为parsecss的文件夹和一个名为dist的子文件夹。在dist中，我放置了jquery插件。在parsecss文件夹中，我添加了一个package.json文件，该文件包含以下内容：

{
  "main": "dist/jquery.parsecss.js",
  "name": "parsecss",
  "title": "parsecss"
}

您需要添加jQuery，正如我在index.html文件的上面示例代码中所示：

<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.4.1/jquery.min.js"></script>

注意：注释/*global$*/修复了一个控制台错误，该错误指示未定义$。

您是否在mounted function下尝试过相同的代码？我相信您可以在此处找到答案：不，您所指的文档无法解决问题。导入整个stackoveflow中发布的jquery插件有很多问题。我发现的所有解决方案都不起作用。

<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.4.1/jquery.min.js"></script>

/* global $ */

import React, { Component } from "react";
import parsecss from 'parsecss'

class Main extends Component {

  constructor() {
    $.parsecss(".mybutton { color: #ff0000; }", function(css) {
        var x = 0;
        x++;
    });
  }
}