I want to integrate survey-react (https://surveyjs.io/Examples/Builder/) in my project but I have a problem in the import of SurveyEditor.
var editor = new SurveyEditor.SurveyEditor("editorElement", editorOptions);
I get:
'SurveyEditor' is not defined no-undef
Can someone help me please in this problem?
Related
import { EncryptStorage } from 'encrypt-storage';
export const encryptStorage = EncryptStorage('secret_key');
encryptStorage.setItem('user', userObj);
error :
I am trying to encrypt the localstorage using encrypt-storage but the import is giving me error and project crashed after putting only 3 line of code.
Dynamic import of next is not working as most of the solution i found is for component not for package.
This solution is not working for dynamic module import as i am getting some assignment error in loader.
Thanks in advance. :)
I'm trying to use pdfjs-dist's example for a Typescript-React-Electron app.
import pdfjsLib from 'pdfjs-dist';
pdfjsLib.GlobalWorkerOptions.workerSrc = 'src/node_modules/pdfjs-
dist/build/pdf.worker.js';
I get GlobalWorkerOptions of undefined.
Based on what I found here
in package.json I've put:
"source": "src/app/components/pdfHandling/entry/entry.js",
where src/app/components/pdfHandling/entry/entry.js:
import * as pdfjs from 'pdfjs-dist';
pdfjs.GlobalWorkerOptions.workerSrc = 'pdf.worker.js';
export {
pdfjs,
};
I posted the same problem in Mozilla's GitHub. And this is the answer I received:
The standalone examples in our repository work, so this must be some
integration issue with React/Electron, for which we cannot provide
assistance since we're not familiar with them. I would suggest to ask
on StackOverflow or other React/Electron-specific forums instead.
Any ideas about how to make pdfjs.GlobalWorkerOptions working?
The problem was silly and subtle....
It is enough to substitute
import * as pdfjs from 'pdfjs-dist';
with
var pdfjsLib = require("pdfjs-dist");
to make the problem disappearing....
getting error : TypeError: fs.readFileSync is not a function when i tried to use get value from .env file, can anyone please help me why i am getting this error? here i have uploaded my code, can anyone please help me how to resolve this issue ? any help will be really appreciated.
const dotenv = require('dotenv').config();
const fs = require('fs');
const envConfig = dotenv.parse(fs.readFileSync('.env'))
for (const k in envConfig) {
process.env[k] = envConfig[k]
}
Firstly I want to remind that fs will not work in the browser. This is by design as to protect your filesystem from potential security threats.
Did you use create-react-app when you were creating ReactJs project?
If it is the case, the following solution will fix this issue.
In your .env file, you have to append REACT_APP_ to all env variables to make it work.
Don't forget to restart your server after changing it.
For example :
This works -
REACT_APP_MYVAR=yourSecret
This doesn't
MYVAR=yourSecret
You can read the reference link in here.
https://create-react-app.dev/docs/adding-custom-environment-variables/
Expected outcome:
I was trying to to achieve this feature using storm react diagram. (click this link to show demo)
The Desired outcome:
convert the TypeScript to JavaScript should work, but it keep having error.
Problem:
however I ran into an error when converting this typescript to JavaScript (see below code block)
import * as SRD from 'storm-react-diagrams';
// setup diagram engine
this.engine = new SRD.DiagramEngine();
this.engine.installDefaultFactories();
//
const pathfinding = this.engine.getLinkFactories().getFactory<SRD.PathFindingLinkFactory>SRD.PathFindingLinkFactory.NAME;
What I have tried,
const pathfinding = this.engine.getLinkFactories().getFactory(PathFindingLinkFactory.NAME);
but I got this error instead
Full disclosure, I have posted this on GitHub too.
Solved.
const pathfinding = this.engine.getLinkFactories()[PathFindingLinkFactory.NAME];
I've been working on a project using Meteor and React, which needs a PDF viewer with the ability to select text.
I'm currently trying to achieve this with Mozilla's PDF.js, but am having some trouble getting started. I'm a long time reader, first time asker at stackoverflow.
I've installed PDF.js with npm.
npm install pdfjs-dist --save
Now I'm trying to modify the example from pdf.js's github project here to create a React component that will render a PDF from a supplied file path and include a text layer.
imports/ui/components/PDF/PDFText.jsx
import React from 'react';
require ('pdfjs-dist/build/pdf.combined');
require ('pdfjs-dist/web/compatibility');
export default class PDFText extends React.Component {
renderPDF() {
PDFJS.workerSrc = '/node_modules/pdfjs-dist/build/pdf.worker.js';
const container = document.getElementById('pdf-container');
const scale = 1;
const pageNumber = 1;
PDFJS.getDocument(this.props.file).then(function(pdf) {
return pdf.getPage(pageNumber).then(function(page) {
var pdfPageView = new PDFJS.PDFPageView({
container: container,
id: pageNumber,
scale: scale,
defaultViewport: page.getViewport(scale),
textLayerFactory: new PDFJS.DefaultTextLayerFactory()
});
pdfPageView.setPdfPage(page);
return pdfPageView.draw();
});
});
}
render() {
this.renderPDF()
return (
<div id='pdf-container'></div>
);
}
}
If I include this component in page I get the following error:
Uncaught (in promise) TypeError: PDFJS.DefaultTextLayerFactory is not a constructor
The next thing I tried was including 'pdfjs-dist/web/pdf_viewer' in my code, as this is where DefaultTextLayerFactory is declared. I modified the code above to add the following line above the class declaration:
require ('pdfjs-dist/web/pdf_viewer');
When I run the code now, I get a different error.
Uncaught TypeError: Cannot read property 'PDFJS' of undefined
at Object.<anonymous> (modules.js?hash=9dd20a3…:114918)
at __w_pdfjs_require__ (modules.js?hash=9dd20a3…:114838)
at Object.<anonymous> (modules.js?hash=9dd20a3…:117449)
at __w_pdfjs_require__ (modules.js?hash=9dd20a3…:114838)
at Object.<anonymous> (modules.js?hash=9dd20a3…:118157)
at __w_pdfjs_require__ (modules.js?hash=9dd20a3…:114838)
at module.exports (modules.js?hash=9dd20a3…:114884)
at modules.js?hash=9dd20a3…:114887
at webpackUniversalModuleDefinition (modules.js?hash=9dd20a3…:114811)
at pdf_viewer.js (modules.js?hash=9dd20a3…:114818)
I'm really unsure what is going on here. I noticed that the function complaining refers to webpack - which I haven't been using.
I've also tried including the following check at the start of my code (this is taken from pageviewer.js in the github link above).
if (!PDFJS.PDFViewer || !PDFJS.getDocument) {
alert('Please build the pdfjs-dist library using\n' +
' `gulp dist`');
}
My code does in fact trigger that alert (PDFJS.PDFViewer is undefined) but the message doesn't seem correct as I installed the built pdfjs-dist library using npm. That message seems for people who cloned the repo. There isn't a gulp file in the pdfjs-dist directory - which makes sense.
I'm sure part of thep problem is that I'm experimenting with a lot of new tools here. This is my first time working with meteor, react, node, and pdf.js, so apologies in advance if I've made an obvious rookie mistake.
For the record I've tried a few other libraries, including:
mikecousins/react-pdf-js (worked reasonably well for simply displaying a pdf with no text layer).
peerlibrary/meteor-pdf.js (I hit some errors with this one as well, and I didn't pursue it too much further as the repo hasn't been touched in a couple of years).
Hopefully that's enough information for someone to spot the issue. My theory is that there's some other set up step I need to do to get this working for meteor or react (and that's why it hasn't been obvious from the "getting started" in the PDF.js website.
Also, I'm not locked in to PDF.js, so if the easiest solution to my problem is to use something else, I'd be happy to try that.
Thanks for your time