sample reactjs jqwidgets app

[brunestoParticipant]

Hi,
I am trying to run a sample reactjs app with jqwidgets, but without success so far. I tried 2 ways:

1) I checked the page http://www.jqwidgets.com/jquery-widgets-documentation/documentation/React/React.htm
but it does not give all details, e.g. where/how jqwidget is installed
I tried to npm install –save jqwidgets which does download some react components from jqwidgets, but I get some compilation error from babel

2) I downloaded the zip file from jqwidgets main page, unzip and went to demos/react/ folder and I tried
npm install
npm start
but I get an error message:

ERROR in ./app/validator/defaultfunctionality/app.js
Module not found: Error: Cannot resolve ‘file’ or ‘directory’ ../../../jqwidgets-react/react_jqxvalidator.js in /home/bru/tmp/jqwidgets/demos/react/app/validator/defaultfunctionality
@ ./app/validator/defaultfunctionality/app.js 17:26-83

Please, how can I get any of these working?

Thanks

[Peter StoevKeymaster]

Hi brunesto,

jQWidgets is installed either through npm or by downloading it from our website. jqwidgets_react is the folder which contains all jQWidgets React UI components. Now, it’s most important all files to be referred correctly when you want to use them as we did in our demos. Actually, the download package includes all React demos, too. Within the demos/react folder, install the dependencies(node_modules) with “npm install”, copy “jqwidgets_react” within “demos/react” and build the webpack bundles with “npm start”, then run the samples. They are the same React samples uploaded on our website. React demos: http://www.jqwidgets.com/react/

Hope this helps.

Best Regards,
Peter Stoev

jQWidgets Team
http://www.jqwidgets.com/

[brunestoParticipant]

Thanks Peter, with your explanation I got it running.
I also wrote a starter application, that only requires npm install start to work, so it is easy to start playing with the code:

https://github.com/brunesto/jqwidgets-react-starter

[Peter StoevKeymaster]

Hi brunesto,

Thanks for sharing. Now, we are working on providing much more detailed getting started documentation about our React UI components.

Best Regards,
Peter Stoev

jQWidgets Team
http://www.jqwidgets.com/

[Author]

Posts