Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

How do I use cheerio in react native? #1058

Closed
Lizhooh opened this issue Jul 17, 2017 · 14 comments
Closed

How do I use cheerio in react native? #1058

Lizhooh opened this issue Jul 17, 2017 · 14 comments

Comments

@Lizhooh
Copy link

Lizhooh commented Jul 17, 2017

I like the cheerio library. I want to use cheerio in react native, but it didn't work

import cio from 'cheerio';
Loading dependency graph, done.
error: bundling: UnableToResolveError: Unable to resolve module `events` from `G:\React-Native\test\node_modules\htmlparser2\lib\Parser.js`: Module dop or in these directories:
@niocncn
Copy link

niocncn commented Jul 24, 2017

Same issue

@vvo
Copy link

vvo commented Jul 25, 2017

Can you try to:

npm install events

I know this seems counter intuitive, in Node.js this is available by default, maybe not in react native?

@niocncn
Copy link

niocncn commented Jul 25, 2017

Not work for me, next error appear: Unable to resolve module 'stream' =((

@vvo
Copy link

vvo commented Jul 25, 2017

Seems like a recurrent issue in the react-native repository, ask the question here and provide a reproduction repository. This is not specific to cheerio.

@Lizhooh
Copy link
Author

Lizhooh commented Jul 25, 2017

I found the problem.
htmlparser2 useing nodejs API.
cause to be unable to work on react native.

fb55/htmlparser2#199
https://github.com/oyyd/htmlparser2-without-node-native

@niocncn
Copy link

niocncn commented Jul 27, 2017

after installing 'react-native-fence-html' problem disappear, it seems to me it includes all required dependencies )

@Lizhooh
Copy link
Author

Lizhooh commented Jul 27, 2017

@niocncn One of the libraries helped me, look https://github.com/oyyd/cheerio-without-node-native

No errors, can correctly parse.

import React, { Component } from 'react';
import { StyleSheet, View, Text } from 'react-native';
import cio from 'cheerio-without-node-native';

export default class App extends Component {
    constructor(props) {
        super(props);
        this.$ = cio.load('<p class="hello" style="color: red">Hello world</p>');
    }
    render() {
        return (
            <View style={styles.container}>
                <Text style={styles.text}>{this.$('.hello').text()}</Text>
                <Text style={styles.text}>{this.$('.hello').attr('style')}</Text>
            </View>
        );
    }
}
const styles = StyleSheet.create({
    container: {
        flex: 1,
        backgroundColor: '#fff',
    },
    text: {
        fontSize: 30
    }
});

@fb55
Copy link
Member

fb55 commented Jul 28, 2017

You can install the missing packages from npm (events, stream and utils afaict) and they will be automatically picked up.

I would not recommend the usage of a fork as it will make it difficult to track down issues and will delay, if not prevent, patches for bugs.

@fb55 fb55 closed this as completed Jul 28, 2017
@ghost
Copy link

ghost commented Jul 29, 2017

What about net and url that are required by tough-cookie?

@dantman
Copy link

dantman commented Sep 9, 2017

@fb55 The hack of requiring stream (a 2 year old abandoned hack) doesn't work with the new parse5 dependency in 1.0.0-rc.2.

@Noitidart
Copy link

Thanks very much for this topic. I had the same issue it was great to see solution right away on search.

Noitidart added a commit to Noitidart/Enter-The-Gunbook that referenced this issue Sep 2, 2018
* Reduced cmn by moving to lodash, and stripTags to top level utils dir (pick as functions dependency not yet removed)
* Removing my extract html functions and moving to cheerio
  * cheerio depends on htmlparser2 which depends on native node environment, so I had to resort to the 3rd party non node native
    * cheeriojs/cheerio#1058
@czy0729
Copy link

czy0729 commented Jun 30, 2019

@Lizhooh 世界上最远的距离就是我不知道轮子的存在

@vnadai
Copy link

vnadai commented Apr 11, 2020

try:
npm install react-native-cheerio

@LeoAso
Copy link

LeoAso commented Jul 6, 2020

You can install react-native-cheerio but pretend that it's cheerio.

yarn add cheerio@npm:react-native-cheerio && yarn add --dev @types/cheerio

If you are using NPM instead of Yarn, I think newer versions of NPM also support this.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

9 participants