Can't import the named export 'PublicKey' from non EcmaScript module (only default export is available) - web3js

Describe the bug
Hi, I'm trying using Metaplex to upload the assets and verify the collection, I am now moving towards "Minting Website": https://docs.metaplex.com/candy-machine-v2/mint-frontend
run rpm start inside the folder ~/metaplex/js/packages/candy-machine-ui to test the mint button, it doesn't load the localhost and it shows me the following error on the terminal:
Failed to compile.
./node_modules/#solana/buffer-layout-utils/lib/esm/web3.mjs
Can't import the named export 'PublicKey' from non EcmaScript module (only default export is available)
Anyone know how to solve this? thanks
I'm using Visual Studio on Windows, node 14.15.
Update:
It seems I'm not alone:
https://github.com/solana-labs/buffer-layout-utils/issues/6
Solved it:
How to downgrade the version of Solana to 1.9.1

For some reason yarn install wasn't doing it for me like in the docs.
I deleted node_module, package-lock.json and yarn.lock then installed with npm instead
npm install && npm start
that worked for me

Related

Module not found: 'draft-js-export-html'

I'm working on a new project with draft.js and have been needing to export raw HTML from my editor. I want to be able to render in another component the HTML as the user is typing.
I did find a nice module to do it, but my app seems not to be able to import the
Error in ./src/App.js Module not found: 'draft-js-export-html' in C:\Use
It seems to be installed correctly:
$ npm draft-js-export-html -v
3.10.10
and I'm importing it to my project:
import {stateToHTML} from 'draft-js-export-html';
Is there something I'm doing wrong?
npm draft-js-export-html -v
will not print the version of the installed package but the installed version of npm itself.
draft-js-export-html has no such version as 3.10.10. The latest version is 1.4.1.
Try
npm install -s draft-js-export-html
If it is already installed this will have no effect.

Import error for react-icons. Module not found: Can't resolve 'react-icons/io' in '/usr/src/app/src/...'

In my React app, which was built using create-react-app, I'm getting the error:
Module not found: Can't resolve 'react-icons/io' in '/usr/src/app/src/components/analytics_components'.
The app has been working fine for a while but I just rebuilt it using Docker Compose and now it's not.
It seems like it's looking in the wrong directory, src instead of node_modules.
react-icons is definitely installed, npm list react-icons returns its version number.
I can see the io folder in node_modules/react-icons
The import statement:
import { IoMdList } from "react-icons/io";
When I change the import to explicitly point to the node_modules directory, it works, but I didn't need to do this before nor do I need to for any other packages, which are still all working correctly:
import { IoMdList } from "../../../node_modules/react-icons/io";
I just reinstall the command npm install react-icons and then it works.
Again you can install npm if you already installed that doesn't matter you can re-install your npm again without deleting current node module. it works for me. command: npm install
you can try delete your node module folder and run cmd:npm install or yarn install it may solve your problem

Where can i find react components installed using npm?

I would like to use the react-drag-sortable components (https://www.npmjs.com/package/react-drag-sortable) which i successfully installed as follows:
npm install react-drag-sortable
The issue is, my application doesn't recognize when i import this component. Where does this component physically reside after running the npm install command? How can I then use it in my application?
This is not about installing packages (Where does npm install packages?)
It's in node-modules/react-drag-sortable/lib/index.js
It's exported with the following line at the end of the file:
exports.default = DragSortableList;

Module not found: Can't resolve 'material-ui/AutoComplete'

I installed material-ui-search-bar and then I want to use SearchBar.
But I have next problem:
./node_modules/material-ui-search-bar/lib/components/SearchBar/SearchBar.js
Module not found: Can't resolve 'material-ui/AutoComplete' in '...node_modules/material-ui-search-bar/lib/components/SearchBar'
How can I fix it?
AutoComplete is associated with Lab package of material UI. On Adding the "lab" package AutoComplete can be used. Add using yarn
yarn add #material-ui/lab
or using npm
npm install #material-ui/lab
I cannot upvote nor comment, so I just parrot the working solution.
Thanks, #blackspacer.
This works:
npm install #material-ui/lab
One expects all Material UI elements to be present after the initial package install, but there is an exception.
https://material-ui.com/components/about-the-lab/
About the lab
This package hosts the incubator components that are not yet ready to
move to the core.
Installation Install the package in your project directory with:
// with npm
npm install #material-ui/lab
// with yarn
yarn add #material-ui/lab
Install material-ui using this command :
npm install material-ui#latest
This can happen due to multiple reasons.
1) You are using the beta version of v1.0 launch of material-ui which has breaking changes. Try switching to the stable version. Or if you want to use the latest beta version, then use
Refer below link:
https://material-ui-next.com/demos/autocomplete/material-ui AutoComplete
2) Try importing like below:
import AutoComplete from 'material-ui/AutoComplete';
or
import { AutoComplete } from 'material-ui/AutoComplete';
Due to the port going on for #next version the modules are being reorganized and hence few components are breaking.
The only solution that worked is uninstall material-ui-search-bar and install using npm install material-ui-search-bar#beta
Use npm i #autocomplete/material-ui in your terminal.
Then run npm start, issue will be resolved.
import { Autocomplete } from '#autocomplete/material-ui';
Further more information or to try the template on another file for testing - use the below reference link.
[1]:https://www.npmjs.com/package/#autocomplete/material-ui
npm -i #material-ui/core
as more packages may be needed. For me besides lab i also needed utils. Hope this helps.
yarn add material-ui-icons
Try using this in project directory
Install beta version npm install material-ui-search-bar#beta
My issue got resolved after installing beta version.
This question is 4 years old so some of the answers here are no more correct. In 2022 and on v5.5, this is no more a lab component, but another reason you might be still getting this error:
export 'AutoComplete' (imported as 'AutoComplete') was not found in '#mui/material'
is if you're still using the old name. Its name has changed from "AutoComplete" to "Autocomplete", i.e., the letter c is no more capital.
So if you have something like:
import AutoComplete from #mui/material/AutoComplete
...just change it to this:
import Autocomplete from #mui/material/Autocomplete
This is a nice example for your problem try it.
import Tab from '#material-ui/core/Tab'
I guess you are not importing Autocomplete correctly .
For more information Visit here
Import like this.
import Autocomplete from '#material-ui/lab/Autocomplete';

Jest fails with error: Cannot find module 'react/lib/ReactComponentTreeHook'

I have installed Jest v17.0.3 in my react project.
When I run jest locally it works fine, but on the build server it fails with:
Error: Cannot find module 'react/lib/ReactComponentTreeHook' from 'ReactDebugTool.js'
Both machines are running node version 6.9.1 and npm version 4.0.2.
use same version of react and react-dom. My problem fixed after using this command
npm install --save react#15.4.0 react-dom#15.4.0
this problem specially occurs on react 15.4.0 above.
Can you check which version of React you are using? Is it the same on both servers? I would try removing node_modules and reinstalling the dependencies. The reason I am suggesting this is that in React v15.4.0 you cannot import private apis and it seems that ReactDebugTools.js is trying to import from react/lib/....
From the blogpost about React v15.4.0 (Link):
However, there is a possibility that you imported private APIs from react/lib/*, or that a package you rely on might use them. We would like to remind you that this was never supported, and that your apps should not rely on internal APIs. The React internals will keep changing as we work to make React better.
Hope this helps!
In the latest versions of react we often see this error as we have loaded 2 versions of react:
To make sure you have just 1 version, run the following in your terminal:
npm ls react-dom
npm ls react
Both the react and react-dom versions need to be same.
If any one of these returns more than 1 version then that's not supported. You have to then correct it in your corresponding package.json
I had the same issue and i removed the node_modules and ran npm install and it fixed the problem.

Resources