kwent/syno

Use with React

Closed this issue · 6 comments

Hi there,

Thanks for providing this package, it's really handy and will save me quite a lot of time... if I can get it to work :)

I'm trying to use the package in a React app. I've installed it using npm, no problem.
I loaded it import Syno from 'syno';, just like I do for every other package.
But when I build the Syno object const syno = new Syno({...}), it's throwing a TypeError: fs.readFileSync is not a function. I believe that's because the package doesn't know it's currently loaded in a browser and so doesn't have access to the file system, correct ?

I also tried const syno = new Syno.Syno({...}) but I get a TypeError: _syno2.default.Syno is not a constructor

When I use var Syno = require('syno.Syno');, I get a compilation fail Module not found: 'syno.Syno'.

I'm a bit stumped right now. Am I just missing something simple ?

kwent commented

Hi @LouWii, you need to import the minimize version compiled for the browser: syno-6.x.min.js.

Something like :

require('syno-6.x.min.js');
var Syno = require('syno.Syno');

Regards,

Thanks @kwent

I tried your code but it throws an error:

ERROR in ./app/utils/syno-api.js
Module not found: Error: Cannot resolve module 'syno.Syno' in ...

The code I used

require('syno/dist/syno-6.x.min.js');
var Syno = require('syno.Syno');

I can confirm the path is correct since I had to figure it out, otherwise I had errors because the package wasn't found.

kwent commented

Hi @LouWii,

Sorry for the late answer. Did you figure out ?

I would have to spin up a simple react app to try this out. Do you use webpack ?

Regards,

Hi @kwent

I didn't manage to make it work.
If you need details about my setup, I used https://github.com/chentsulin/electron-react-boilerplate to generate a boilerplate for my app, which configures everything and creates files to quickly start a project.

kwent commented

Closing for no activity.

EkkoG commented

same problem here