I'm trying to use React-Leaflet-Draw to add polygons to a mapping project I'm working on. Coming unstuck on the use of EditControls.
I imported Edit control as per the example
import { EditControl } from '../src';
With an index.js file in src folder with:
export EditControl from './EditControl';
I added some code to do some different things to the example but it still ran fine (in the example version).
When I tried to run this on another project, using the same code I get the error:
Syntax error: Unexpected token, expected {
From the index.js file, using the same export command. Has anyone else encountered this problem? Any thoughts on why it might be happening?
Thanks
You need to install 'leaflet-draw'
npm install 'leaflet-draw'
Related
I have a very serious issue right now trying to use Next js. No matter what version I use, any time I try to run the npm run dev, I get the following error:
error - ./node_modules/next/dist/client/dev/amp-dev.js
Module not found: Can't resolve 'C:\Usersudbasili\Documents\Programming\Acumen Developers\myportfolio\node_modules\next\dist\compiled\regenerator-runtime\runtime.js' in 'C:\Users\udbasili\Documents\Programming\Acumen Developers\myportfolio\node_modules\next\dist\client\dev'
error - Error: Cannot find module 'C:\Users\udbasili\Documents\Programming\Acumen Developers\myportfolio\.next\fallback-build-manifest.json'Require stack:
This is literally right after running the create next app command, so I don't install any additional package. One thing realized though is that this error doesn't occur when I use the public folder on my window PC but when I use the user folder called udbasili I get the above error. I have been using next.js for a long time and this is the first I am seeing this error
I had the same issue
the problem was that my project files was in a folder beginning with "ud". My folder name was "udemy".
Renaming that folder or moving the project outside that folder solved the issue
If you compare the paths, there is a missing '\' :
C:\Users**\\**udbasili\Documents\Programming\Acumen Developers\...
C:\Usersudbasili\Documents\Programming\Acumen Developers\...
A quick solution that I gave to this issue was to create the project on a different path. For example:
C:\dev\myportfolio
Please head over to https://nextjs.org/docs/messages/swc-disabled
By disabling swc in next.config.js it will resolve your issue.
You can disable swc by adding:
experimental: {
forceSwcTransforms: true,
}
It's possible your autoimport included '/dist/client/dev' in the 'next/amp' path.
Does it work if you import { useAmp } from 'next/amp'?
Im trying to store my nft metadata to ipfs using nft.storage (Reactjs)
When I import the library as explained in their docs I get this error
enter image description here
I read a similar error online for web3storage library and that it is probably a webpack version issue, but there is no solution. Any ideas?
This is how I am importing it:
import { NFTStorage, File } from 'nft.storage'
Exactly as shown in the docs.
Since there's insufficient info on how to deal with this out of the box, this is how I resolved it. It worked fine.
Go to node_modules/nft.storage directory.
Make sure you have ipfs-car/dist/esm/blockstore and ipfs-car/dist/esm/pack. If not, install ipfs-car with npm i ipfs-car. Copy ipfs-car/dist/esm to nft.storage/src.
Inside nft.storage/src, update the ipfs-car import statements in the following files like so:
Inside platform.web.js, update to this: import { MemoryBlockStore } from 'ipfs-car/dist/esm/blockstore/memory'
Inside lib.js, update to this: import { pack } from 'ipfs-car/dist/esm/pack'
Inside token.js, update to this: import { pack } from 'ipfs-car/dist/esm/pack'
This solved my problem.
Crude but works.
importing pack from built version should also work but crude as well...the package doesn't work at all without doing these, they should update it...I will send a pull request later on.
import { Web3Storage } from 'web3.storage/dist/bundle.esm.min.js'
I just upgraded Create React App to 5.0.0 (which upgrades to webpack 5) and it's working fine. Some relevant tips here.
I have a React app created using Create React App that was running fine until today. Something must have updated the last time I installed a new package. Anyhow, so whenever I try to start the app, it complains that there are .ts files (within node_modules folder) and forces me to install TypeScript.
Is there any way to stop this behaviour? Because currently, installing TypeScript just opens a bottle of worms, where I need to resolve the TypeScript errors that arises.
Also, as the screenshot suggests, removing the tsconfig.json file doesn't resolve the issue, it gets automatically created on every run..
Currently because it's preventing me to work, I've done the following modification until they fix it on the Create React App:
Current solution until they fix the create react app
On the file node_modules/react-scripts/scripts/utils/verifyTypeScriptSetup.js, find the definition of verifyNoTypeScript() (line 24). Replace the function to the following:
function verifyNoTypeScript() {
return true;
}
I've been having trouble getting react-pdf to work properly in my react app that I created using 'create-react-app'. From various github comments on the react-pdf page, it seems that there's an issue setting up the workerSrc in React applications that were created with 'create-react-app'.
One work around that seemed to solve the issue (temporarily) was to copy the pdf.worker.js file from the node-modules/build/pdfjs-dist/build folder and place it in the public folder of my react app. Then in my index.js file put the following code:
import {pdfjs} from 'react-pdf'
window.PDFJS.workerSrc = process.env.PUBLIC_URL + '/pdf.worker.js'
This worked just fine for a week, until I installed a new module into my application with npm. Now, I'm getting the same error I did in the beginning, and nothing has changed:
index.js:14 Uncaught TypeError: Cannot set property 'workerSrc' of undefined
These were the initial comments that helped me narrow down the error:
https://github.com/facebook/create-react-app/issues/1574#issuecomment-280436498
https://github.com/wojtekmaj/react-pdf/issues/291
but now that it's back I'm kind of at a loss for ideas. Has anyone else experienced this and been able to solve it? Any help would be greatly appreciated!
Based on what I have seen in the docs and in forums, it appears you should be altering the global PDFJS object.
PDFJS.workerSrc, instead of window.workerSrc.
I managed to get this working by loading the worker from CDN.
import { Document, Page, pdfjs } from 'react-pdf';
pdfjs.GlobalWorkerOptions.workerSrc=//cdnjs.cloudflare.com/ajax/libs/pdf.js/${pdfjs.version}/pdf.worker.js
In my create react app project I'm running into the following error in my production build (not in my dev build):
Uncaught TypeError: (0 , o.default) is not a function
at Object.e.f.(:4444/anonymous function)...
I've been investigating this bug for a couple of hours but struggle to find out how to debug this uglified piece of js.
What makes it tough is that the error returns o.default and not SomeLibrary.default so I don't really know where to start my search really...
What does that o.default mean in this case? Any tips for figuring out what's going wrong here?
It seems to be import statement somewhere in your file is incorrect.
Example: (from an issue)
// fails
import combineReducers from "redux"
// correct
import { combineReducers } from "redux"
What makes it tough is that the error returns o.default and not SomeLibrary.default so I don't really know where to start my search really...
There's nothing but exported in some library just as o. Example default export:
export default {
o: something
}
For those who tried the solution above and still cannot solve this problem, you might be importing the library successfully and then using the library in a function that is located in the same file.
But, if you export that file and import it to another file, that is where you might be having a problem.
Simply import your already exported file as -
import {myComponent} from "/util/http"
instead of -
import myComponent from "/util/http"
Hope that helps.
If this is happening for anyone with Auth.signIn using aws-amplify, please try the below update for aws-amplify. This worked as a permanent fix and didn't break any of my current code.
sudo npx npm-check-updates -i '/#?aws-amplify/' && npm update --force
Just in case it helps someone, in my case I was using React component inside a JS file which caused this error.