Hi, I am not able to use Web3 and it's installed on my mac - web3js

I am not able to use Web3 and it's installed on my mac
npm install web3
up to date, audited 377 packages in 2s
57 packages are looking for funding
run npm fund for details
found 0 vulnerabilities
As you can see above, Web2 is installed but when i am trying to use the in HTML then it's throwing error:
HTML Code:
var web3 = new Web3();
Output:
Uncaught ReferenceError: Web3 is not defined
file:///Users/chetansharma/Documents/BlockChain/test.html:3
I request you to please help me

Are you importing the Web3.js library at the top of your file? You have to import the library to your javascript file before you can use it.
This changes depending on your environment, assuming you are using node.js you would want to include this:
const Web3 = require('web3');

Related

Realm and React error. Can't resolve 'react-native' in app created with create-react-app

I'm attempting to add the Realm package to a project created with create-react-app. I simply run the create script, install the project, then install realm. When I attempt to import or require 'realm' I get a Can't resolve 'react-native' error.
npx create-react-app my-app
cd my-app
npm i
npm i --save realm
npm start
At this point, if I attempt to import realm anywhere in the project, for instance by adding:
import Realm from 'realm';
or
Realm = require('realm');
to App.js or Index.js
I get the following error.
./node_modules/realm/lib/browser/index.js
Module not found: Can't resolve 'react-native' in '/Users/scolobey/Desktop/Projects/realm-blog/node_modules/realm/lib/browser'
As far as I have been able to tell, this seems to be related to webpack. Opening the console on this error page, I see:
./node_modules/realm/lib/browser/index.js
Module not found: Can't resolve 'react-native' in '/Users/scolobey/Desktop/Projects/javascript/my-app/node_modules/realm/lib/browser'
console.<computed> # index.js:1
r # backend.js:6
handleErrors # webpackHotDevClient.js:173
push../node_modules/react-dev-utils/webpackHotDevClient.js.connection.onmessage # webpackHotDevClient.js:212
Create React App is for regular React apps (not mobile/“React Native” apps). Your app is complaining because it expects to find the “react-native” package, which doesn’t come included with Create React App.
You’ll note that Realm’s Installation Guide specifically instructs you to set up react native before installing the package.
As mentioned in the React Native Docs - Getting Started (which is linked to in the above Realm installation guide), you likely want to use expo instead of Create React App.
Once the React Native app is set up, you can proceed with installing Realm.

Module parse failed with custom npm package

I'm new to React and new to npm module publishing, there is a beginning for all things!
I have created a react module.
I have created a react app (using create-react-app) and i have imported the module directly (not via a npm install).
On this case, i got no errors. The app is compiling without problems.
However, when i'm trying to use my module by importing it from npm (after it's get published), it fails.
To get this issue, i have created another react app (always by using create-react-app) then i have installed my package using npm i --save my-module-name.
I'm importing it commonly by using import { SomeComponent } from 'my-module-name' instead of importing it directly.
And i got the following error
Module parse failed: Unexpected token (59:37)
You may need an appropriate loader to handle this file type.
| }
|
| generateRecoverActionsContainers = () => {
|
After some searchs, it seems to come from the Webpack configuration. But, during my searchs, i saw that people recommand to not touch the react Webpack default configuration.
From there, i'm a bit lost on how to fix that and also, why it was compiling when the module was imported directly and not compiling when it was importing from node_modules... Should i had a webpack configuration in my npm module?
Thanks in advance for your precious help!
When you publish a module on npm, you should publish compiled code. Webpack doesn't compile node_modules

Using React Dev Tools with Preact

I have just got preact-redux-example up and running, and now I am attempting to use Preact Dev Tools in my app.
Based on this post I assumed it was a case of adding
import 'preact/devtools'
into the entry point (app.js) file.
However, this yields the following error:
./src/components/app.js
Module not found: Error: Cannot resolve module 'preact/devtools'
Is there something else I need to install, or am I on the wrong track?
preact/devtools has landed in version 6.4.0, but the example project uses version 4.8.0. So you need to upgrade the preact version to be able to import it:
npm install --save preact#latest
Or if you're using yarn you can run:
yarn upgrade preact

REACT QRCODE: Unable to import module [cirocosta/qcode-decoder]

I am working on a React Web App which requires a QR Code Scanner,
I imported the package QCodeDecoder through npm, still when I did import QCodeDecoder from 'qcode-decoder';
it throws an error that the module not found. I checked in the npm_modules and it is there.
I think qcode-decoder is not an npm package. I see it contains a package.json but the file they are using as main doesn't exist.
In the documentation they claim the package should be installed through bower so you might need to give it a try that way.

Unknown module "Firebase" in React native

I am working on some sample apps using react native. I am trying to integrate Firebase plugin followed by firebase tutorial.
I can able to add firebase plugin using
npm install firebase --save
It gets added to node_modules, when i try to require the plugin
var Firebase = require('firebase');
It throws an exceptions "Requiring unknown module 'firebase'...."
First, make sure you've installed the dependency with:
npm install firebase --save
(make sure you are in your project folder)
Then end the NPM process and restart by running react-native start. That should do the trick.

Resources