Question

我是整个ReactJS生态系统的初学者，我正在尝试在React中构建一个应用程序。我正在使用create-react-app工具来创建我的应用程序。以下是此问题的相关代码：

App.js：

const findWord = require('../word'); //This is where I require the file

import React from 'react';
import ReactDOM from 'react-dom';

class Form extends React.Component {
  constructor(){
    super();
    this.props = {
    }
  }
  getWord(e){
    e.preventDefault();
    let word = ReactDOM.findDOMNode(this.refs.wordInput).value;
    alert(word);
    findWord();
  }
  render() {
    return (
      <div className="search">
        <form className="pure-form">
          <input ref="wordInput" type="text" placeholder="Search . . ."></input>
          <button onClick={this.getWord.bind(this)} className="pure-button pure-button-primary" type="button">Go</button>
        </form>
      </div>
    );
  }
}

export default Form;

word.js：

var scraperjs = require('scraperjs'); //This is where I require the dependency

/* If I take the function out of the module.exports, then run the file with `node src/word.js`, it will work fine, but when I use it in the context of the application, then things go awry. */

module.exports = function(){
  scraperjs.StaticScraper.create('https://news.ycombinator.com/')
      .scrape(function($) {
          return $(".title a").map(function() {
              return $(this).text();
          }).get();
      })
      .then(function(news) {
          console.log(news);
      })
};

我的麻烦是，当我尝试从组件类中要求模块（scraperjs）并使用它时，它会在某些随机依赖项中生成错误。

Error in ./~/win-spawn/index.js
Module not found: 'child_process' in /Users/marknifakos/Documents/new-react-app/word-map-shs/node_modules/win-spawn

 @ ./~/win-spawn/index.js 1:13-37

当我使用普通节点cli命令使用此模块时，它工作得很好，所以问题可能不在于依赖本身。而且我100％确定路径是正确的，所以不要提起它们。

Answer 1

这种情况正在发生，因为child-process模块是Node中的内置模块，浏览器无法访问。这也是为什么你能够使用cli访问它，但不能在浏览器中访问它，因为webpack不捆绑它。最好的办法是在webpack配置中包含以下内容：

node:
{
    "child_process": "empty"
}

并希望您的依赖项不需要使用此模块中的任何方法。

在ReactJS中需要模块的麻烦

1 个答案: