Open bunterWolf opened 8 years ago
Ah yeah, so the compile step was designed such that the file at dist/psd.js
includes the browser shims that replace the NodeJS equivalents. If you require lib/psd.js
directly, you won't get these as that was intended for the NodeJS environment.
If you load dist/psd.js
in the browser instead, you should get an <img>
object back instead of the PNG object. Let me know if that doesn't make sense.
ok I tried that, but I think I need little bit more help.. :)
What I did now:
git clone psd.js
npm i
cake compile
than I get the dist/psd.js But when I require that, I get only an empty object. :(
You shouldn't need to compile it yourself, there is already a built version in the dist
folder. Are you saying that when you do var PSD = require('psd');
, the PSD object is just a plain object or something?
Oh yeah right, the github version has the dist folder already, the npm module don't. I should look closer.. :)
var PSD = require('../../../../library/psd.js/dist/psd.js'); console.log(PSD) = {} (i tried to require that with requirejs / node / es6)
Maybe I'm a little confused on how this works inside an Electron environment. As long as the psd.js script is loaded on the page, you should be able to do var PSD = require('psd');
without having to put in the actual require path, since it's a Browserify compiled library.
Well im confused too, about the different require and build possibilities in js.. :D
I'm not sure what you mean with:
As long as the psd.js script is loaded on the page
a script src tag?
npm i psd & PSD = require('psd') Works, but only in NodeJS environment mode without the < img > object i need.
to load dist/psd.js I need to clone psdjs from github because the npm package does not include the dist folder. And i have to write the full path, to be sure that file is loaded and not what is specified by the package.json
Electron is just a Chrome-Browser where you can use NodeJS in everywhere. With Node require (which works the same as browserify require I think) and ES2015 is there no need to use Browserify or something similar.
I found the browser example.. now I know what you mean.. :) Thank you very much! https://github.com/meltingice/psd.js/blob/master/examples/browser/image.html
The dist/psd.js defines require by itself: https://github.com/meltingice/psd.js/blob/master/dist/psd.js#L1 Which is overwritten by the NodeJS require
when I load dist/psd.js by a script tag and change
require=(function e(t,n,.........
to
foo=(function e(t,n,......
and than use:
var PSD = foo('psd');
everything works fine.
But I don't understand why there ist this require = and not a module.export = or something similar ;)
The require is added by Browserify, but I'm honestly not up to date enough with the latest JS module loaders to know what a good solution here would be.
Hi @bunterWolf Can you help me implement psd.js on browser, pls ? I tried Browserify but it didn't work ?
I would like to create a png preview of an psd in an Electron App.
But with toPng() I get this Object which isn't mountable to the DOM instead of a Browser Image Object :
If I unterstand it right, psd.js runs in NodeJS mode because Electron has NodeJS build in the Browser/Renderer too. Which isn't the normal use case of node. I tried to load psd.js with requirejs, but that didn't change anything.
The Usage - "NodeJS Example" works fine, the "Browser Example" don't
Can I load psd.js in Browser mode or get the Png Image Object somehow?
Thanks a lot!