CODEWITHSUNDEEP
javascriptreact-nativemobile-development
s_vojtas
s_vojtas

Reputation: 11

How to import javascript library to React Native project?

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>

Upvotes: 1

Views: 2997

Answers (2)

King Tiger
King Tiger

Reputation: 11

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

Upvotes: 1

Yannick
Yannick

Reputation: 1600

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

Upvotes: 1

Related Questions