How to import javascript library to React Native project?

Question

I am trying to implement JavaScript library to my mobile app that I am creating with React Native. This app should have flashcards with Chinese characters and its stroke order, but I dont know how to add this library to the react nor how to use it afterwards.

Library: https://github.com/chanind/hanzi-writer

I already try it in the browser, everything works as described in docs, but I cant find a way to implement it in my mobile app.

In html I can do something like this to have a flashcard with one character

<html>
    <head>
        <title></title>
        <script src="https://cdn.jsdelivr.net/npm/[email protected]/dist/hanzi-writer.min.js"> </script>
    </head>
    <body>
        <div id="character-target-div"></div>
        <script type="application/javascript">
                var writer = HanziWriter.create('character-target-div', '我', {
                        width: 100,
                        height: 100,
                        padding: 5
                });
                writer.quiz();
        </script>
    </body>
</html>

Yannick · Accepted Answer · 2019-08-18 17:41:07Z

1

After running npm install ‘hanging-writer’ in your root folder, on top of your module add: import {HanziWriter} from ‘hanzi-writer'

edited Aug 18, 2019 at 17:41

answered Aug 18, 2019 at 14:23

Yannick

1,6104 gold badges20 silver badges27 bronze badges

Sign up to request clarification or add additional context in comments.

Comments

King Tiger · Accepted Answer · 2020-05-15 02:53:55Z

1

First you have to run npm install hanzi-writer-data Then run this npm install hanzi-writer It works fine for me

answered May 15, 2020 at 2:53

King Tiger

112 bronze badges

Collectives™ on Stack Overflow

How to import javascript library to React Native project?

2 Answers 2

Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related