Next.js doesn't load jsx - javascript

I have been searching about Next.js, the javascript framework of the moment, and I want to begin to practice. The problem is: it doesn't run in my computer by any means.
The natural form on creating a next project is with the command line:
npx create-next-app
or
yarn create next-app
The result is a template project with a file structure and a few scripts to run the server. The most basic script runs the server in development mode:
npm run dev
or
yarn dev
The result in terminal is the warning:
$ yarn dev
yarn run v1.22.5
$ next dev
(node:5348) [DEP0148] DeprecationWarning: Use of deprecated folder mapping "./" in the "exports" field module resolution
of the package at C:\Users\maths\Documents\codigos\node\my-app\node_modules\next\node_modules\postcss\package.json.
Update this package.json to use a subpath pattern like "./*".
(Use `node --trace-deprecation ...` to show where the warning was created)
ready - started server on http://localhost:3000
error - C:/Users/maths/Documents/codigos/node/my-app/pages/_app.js 4:9
Module parse failed: Unexpected token (4:9)
You may need an appropriate loader to handle this file type, currently no loaders are configured to process this file. S
ee https://webpack.js.org/concepts#loaders
|
| function MyApp({ Component, pageProps }) {
> return <Component {...pageProps} />
| }
|
And when I enter the website in localhost:3000, the page on browser shows:
Internal Server Error
After making the http requisition from the browser, the terminal shows the following message:
event - build page: /next/dist/pages/_error
wait - compiling...
error - C:/Users/maths/Documents/codigos/node/my-app/pages/_app.js 4:9
Module parse failed: Unexpected token (4:9)
You may need an appropriate loader to handle this file type, currently no loaders are configured to process this file. S
ee https://webpack.js.org/concepts#loaders
|
| function MyApp({ Component, pageProps }) {
> return <Component {...pageProps} />
| }
|
Error: Cannot find module 'C:\Users\maths\Meus Documentos\codigos\node\my-app\.next\server\pages-manifest.json'
Require stack:
- C:\Users\maths\Documents\codigos\node\my-app\node_modules\next\dist\next-server\server\require.js
- C:\Users\maths\Documents\codigos\node\my-app\node_modules\next\dist\next-server\server\load-components.js
- C:\Users\maths\Documents\codigos\node\my-app\node_modules\next\dist\next-server\server\api-utils.js
- C:\Users\maths\Documents\codigos\node\my-app\node_modules\next\dist\next-server\server\next-server.js
- C:\Users\maths\Documents\codigos\node\my-app\node_modules\next\dist\server\next.js
- C:\Users\maths\Documents\codigos\node\my-app\node_modules\next\dist\server\lib\start-server.js
- C:\Users\maths\Documents\codigos\node\my-app\node_modules\next\dist\cli\next-dev.js
- C:\Users\maths\Documents\codigos\node\my-app\node_modules\next\dist\bin\next
at Function.Module._resolveFilename (node:internal/modules/cjs/loader:925:15)
at Function.Module._load (node:internal/modules/cjs/loader:769:27)
at Module.require (node:internal/modules/cjs/loader:997:19)
at require (node:internal/modules/cjs/helpers:92:18)
at getPagePath (C:\Users\maths\Documents\codigos\node\my-app\node_modules\next\dist\next-server\server\require.js:1:
657)
at requirePage (C:\Users\maths\Documents\codigos\node\my-app\node_modules\next\dist\next-server\server\require.js:1:
1062)
at loadComponents (C:\Users\maths\Documents\codigos\node\my-app\node_modules\next\dist\next-server\server\load-compo
nents.js:1:807)
at DevServer.findPageComponents (C:\Users\maths\Documents\codigos\node\my-app\node_modules\next\dist\next-server\ser
ver\next-server.js:74:296)
at DevServer.renderErrorToHTML (C:\Users\maths\Documents\codigos\node\my-app\node_modules\next\dist\next-server\serv
er\next-server.js:126:120)
at DevServer.renderErrorToHTML (C:\Users\maths\Documents\codigos\node\my-app\node_modules\next\dist\server\next-dev-
server.js:34:974)
at processTicksAndRejections (node:internal/process/task_queues:93:5)
at async DevServer.render (C:\Users\maths\Documents\codigos\node\my-app\node_modules\next\dist\next-server\server\ne
xt-server.js:72:236)
at async Object.fn (C:\Users\maths\Documents\codigos\node\my-app\node_modules\next\dist\next-server\server\next-serv
er.js:56:618)
at async Router.execute (C:\Users\maths\Documents\codigos\node\my-app\node_modules\next\dist\next-server\server\rout
er.js:23:67)
at async DevServer.run (C:\Users\maths\Documents\codigos\node\my-app\node_modules\next\dist\next-server\server\next-
server.js:66:1042)
at async DevServer.handleRequest (C:\Users\maths\Documents\codigos\node\my-app\node_modules\next\dist\next-server\se
rver\next-server.js:34:1081) {
code: 'MODULE_NOT_FOUND',
requireStack: [
'C:\\Users\\maths\\Documents\\codigos\\node\\my-app\\node_modules\\next\\dist\\next-server\\server\\require.js',
'C:\\Users\\maths\\Documents\\codigos\\node\\my-app\\node_modules\\next\\dist\\next-server\\server\\load-components.
js',
'C:\\Users\\maths\\Documents\\codigos\\node\\my-app\\node_modules\\next\\dist\\next-server\\server\\api-utils.js',
'C:\\Users\\maths\\Documents\\codigos\\node\\my-app\\node_modules\\next\\dist\\next-server\\server\\next-server.js',
'C:\\Users\\maths\\Documents\\codigos\\node\\my-app\\node_modules\\next\\dist\\server\\next.js',
'C:\\Users\\maths\\Documents\\codigos\\node\\my-app\\node_modules\\next\\dist\\server\\lib\\start-server.js',
'C:\\Users\\maths\\Documents\\codigos\\node\\my-app\\node_modules\\next\\dist\\cli\\next-dev.js',
'C:\\Users\\maths\\Documents\\codigos\\node\\my-app\\node_modules\\next\\dist\\bin\\next'
]
}
I have tried several things to fix it, create the next project without the script from npx and yarn (by manually installing the dependencies), update versions of node and npm, etc. It seems that the program can't load the jsx, the first error points to the moment when the first jsx component appear in the code. The message says that webpack isn't configured with a valid loader to this code.
Environment:
Win 10
npm v7.3.0
node v15.5.0
next v10.0.4
react v17.0.1
react-dom v17.0.1

Downgrade your version of Nodejs to 14 or 12 Node version 15 will break your environment. If you want to still want to use 15 get node version switcher and switch the version based on the projects your working on.

Related

Exception in thread "main" javax.net.ssl.SSLException: Tag mismatch [React-native]

Version
react native:0.68.2
react native cli: 2.0.1
node:v18.13.0
jdk:jdk-8.0.342.07-hotspot
when I run this cmd to run my project in react native it's give me error
npx react-native run-android or react-native run-android
it's give me this type error
info Running jetifier to migrate libraries to AndroidX. You can disable it using "--no-jetifier" flag.
(node:6120) Warning: Accessing non-existent property 'padLevels' of module exports inside circular dependency
(Use `node --trace-warnings ...` to show where the warning was created)
Jetifier found 936 file(s) to forward-jetify. Using 4 workers...
info JS server already running.
info Installing the app...
Downloading https://services.gradle.org/distributions/gradle-7.3.3-all.zip
Exception in thread "main" javax.net.ssl.SSLException: Tag mismatch!
at sun.security.ssl.Alert.createSSLException(Alert.java:133)
at sun.security.ssl.TransportContext.fatal(TransportContext.java:324)
at sun.security.ssl.TransportContext.fatal(TransportContext.java:267)
at sun.security.ssl.TransportContext.fatal(TransportContext.java:262)
at sun.security.ssl.SSLTransport.decode(SSLTransport.java:119)
at sun.security.ssl.SSLSocketImpl.decode(SSLSocketImpl.java:1400)
at sun.security.ssl.SSLSocketImpl.readApplicationRecord(SSLSocketImpl.java:1368)
at sun.security.ssl.SSLSocketImpl.access$300(SSLSocketImpl.java:73)
at sun.security.ssl.SSLSocketImpl$AppInputStream.read(SSLSocketImpl.java:962)
at java.io.BufferedInputStream.read1(BufferedInputStream.java:284)
at java.io.BufferedInputStream.read(BufferedInputStream.java:345)
at sun.net.www.MeteredStream.read(MeteredStream.java:134)
at java.io.FilterInputStream.read(FilterInputStream.java:133)
at sun.net.www.protocol.http.HttpURLConnection$HttpInputStream.read(HttpURLConnection.java:3456)
at sun.net.www.protocol.http.HttpURLConnection$HttpInputStream.read(HttpURLConnection.java:3449)
at org.gradle.wrapper.Download.downloadInternal(Download.java:106)
at org.gradle.wrapper.Download.download(Download.java:80)
at org.gradle.wrapper.Install$1.call(Install.java:68)
at org.gradle.wrapper.Install$1.call(Install.java:48)
at org.gradle.wrapper.ExclusiveFileAccessManager.access(ExclusiveFileAccessManager.java:69)
at org.gradle.wrapper.Install.createDist(Install.java:48)
at org.gradle.wrapper.WrapperExecutor.execute(WrapperExecutor.java:107)
at org.gradle.wrapper.GradleWrapperMain.main(GradleWrapperMain.java:63)
Caused by: javax.crypto.AEADBadTagException: Tag mismatch!
at com.sun.crypto.provider.GaloisCounterMode.decryptFinal(GaloisCounterMode.java:620)
at com.sun.crypto.provider.CipherCore.finalNoPadding(CipherCore.java:1116)
at com.sun.crypto.provider.CipherCore.fillOutputBuffer(CipherCore.java:1053)
at com.sun.crypto.provider.CipherCore.doFinal(CipherCore.java:941)
at com.sun.crypto.provider.AESCipher.engineDoFinal(AESCipher.java:491)
at javax.crypto.CipherSpi.bufferCrypt(CipherSpi.java:779)
at javax.crypto.CipherSpi.engineDoFinal(CipherSpi.java:730)
at javax.crypto.Cipher.doFinal(Cipher.java:2463)
at sun.security.ssl.SSLCipher$T12GcmReadCipherGenerator$GcmReadCipher.decrypt(SSLCipher.java:1606)
at sun.security.ssl.SSLSocketInputRecord.decodeInputRecord(SSLSocketInputRecord.java:262)
at sun.security.ssl.SSLSocketInputRecord.decode(SSLSocketInputRecord.java:190)
at sun.security.ssl.SSLTransport.decode(SSLTransport.java:109)
... 18 more
error Failed to install the app. Make sure you have the Android development environment set up: https://reactnative.dev/docs/environment-setup.
Error: Command failed: gradlew.bat app:installDebug -PreactNativeDevServerPort=8081
Exception in thread "main" javax.net.ssl.SSLException: Tag mismatch!
at sun.security.ssl.Alert.createSSLException(Alert.java:133)
at sun.security.ssl.TransportContext.fatal(TransportContext.java:324)
at sun.security.ssl.TransportContext.fatal(TransportContext.java:267)
at sun.security.ssl.TransportContext.fatal(TransportContext.java:262)
at sun.security.ssl.SSLTransport.decode(SSLTransport.java:119)
at sun.security.ssl.SSLSocketImpl.decode(SSLSocketImpl.java:1400)
at sun.security.ssl.SSLSocketImpl.readApplicationRecord(SSLSocketImpl.java:1368)
at sun.security.ssl.SSLSocketImpl.access$300(SSLSocketImpl.java:73)
at sun.security.ssl.SSLSocketImpl$AppInputStream.read(SSLSocketImpl.java:962)
at java.io.BufferedInputStream.read1(BufferedInputStream.java:284)
at java.io.BufferedInputStream.read(BufferedInputStream.java:345)
at sun.net.www.MeteredStream.read(MeteredStream.java:134)
at java.io.FilterInputStream.read(FilterInputStream.java:133)
at sun.net.www.protocol.http.HttpURLConnection$HttpInputStream.read(HttpURLConnection.java:3456)
at sun.net.www.protocol.http.HttpURLConnection$HttpInputStream.read(HttpURLConnection.java:3449)
at org.gradle.wrapper.Download.downloadInternal(Download.java:106)
at org.gradle.wrapper.Download.download(Download.java:80)
at org.gradle.wrapper.Install$1.call(Install.java:68)
at org.gradle.wrapper.Install$1.call(Install.java:48)
at org.gradle.wrapper.ExclusiveFileAccessManager.access(ExclusiveFileAccessManager.java:69)
at org.gradle.wrapper.Install.createDist(Install.java:48)
at org.gradle.wrapper.WrapperExecutor.execute(WrapperExecutor.java:107)
at org.gradle.wrapper.GradleWrapperMain.main(GradleWrapperMain.java:63)
Caused by: javax.crypto.AEADBadTagException: Tag mismatch!
at com.sun.crypto.provider.GaloisCounterMode.decryptFinal(GaloisCounterMode.java:620)
at com.sun.crypto.provider.CipherCore.finalNoPadding(CipherCore.java:1116)
at com.sun.crypto.provider.CipherCore.fillOutputBuffer(CipherCore.java:1053)
at com.sun.crypto.provider.CipherCore.doFinal(CipherCore.java:941)
at com.sun.crypto.provider.AESCipher.engineDoFinal(AESCipher.java:491)
at javax.crypto.CipherSpi.bufferCrypt(CipherSpi.java:779)
at javax.crypto.CipherSpi.engineDoFinal(CipherSpi.java:730)
at javax.crypto.Cipher.doFinal(Cipher.java:2463)
at sun.security.ssl.SSLCipher$T12GcmReadCipherGenerator$GcmReadCipher.decrypt(SSLCipher.java:1606)
at sun.security.ssl.SSLSocketInputRecord.decodeInputRecord(SSLSocketInputRecord.java:262)
at sun.security.ssl.SSLSocketInputRecord.decode(SSLSocketInputRecord.java:190)
at sun.security.ssl.SSLTransport.decode(SSLTransport.java:109)
... 18 more
at makeError (C:\Users\dp312\OneDrive\Desktop\Project\LoanApp\node_modules\execa\index.js:174:9)
at C:\Users\dp312\OneDrive\Desktop\Project\LoanApp\node_modules\execa\index.js:278:16
at process.processTicksAndRejections (node:internal/process/task_queues:95:5)
at async runOnAllDevices (C:\Users\dp312\OneDrive\Desktop\Project\LoanApp\node_modules\#react-native-community\cli-platform-android\build\commands\runAndroid\runOnAllDevices.js:109:5)
at async Command.handleAction (C:\Users\dp312\OneDrive\Desktop\Project\LoanApp\node_modules\#react-native-community\cli\build\index.js:192:9)
info Run CLI with --verbose flag for more details.
android\gradle\wrapper\gradle-wrapper.properties
in this file I can change like this but it also not work
distributionBase=GRADLE_USER_HOME
distributionPath=wrapper/dists
distributionUrl=http\://services.gradle.org/distributions/gradle-7.3.3-all.zip <---here https to http
or
distributionUrl=https\://services.gradle.org/distributions/gradle-7.3.3-all.zip
zipStoreBase=GRADLE_USER_HOME
zipStorePath=wrapper/dists
I know where is problem
first one I install Android studio it's give me same error when I install Android studio and SDK then
I find a video which one do react native project without Android studio so I can follow the video and try to run my project but still my project give me error
I don't know why this error is come
my network connectivity is stable no issue in a network connectivity then why this error is come and my project is new in my project no have any dependency and any code simple code of hello word in my project
but still it's give me a error
any one can give me solution??

Expo app thowing file missing error though files are actually present there

I am using pnpm to create expo app. Just created pnpm create expo-app, installed dependencies and then run yarn android === expo start --android.
Tried shamefully-hoisting as well as moving project to location with no spaces in path but each time I get the same error.
I manually checked, all the files that are shown missing in error are actually present there.
How do I fix this?
Error: Unable to resolve module ./node_modules\expo\AppEntry from C:\Users\HariC\AndroidStudioProjects\chat/.:
None of these files exist:
* node_modules\expo\AppEntry(.native|.android.ts|.native.ts|.ts|.android.tsx|.native.tsx|.tsx|.android.js|.native.js|.js|.android.jsx|.native.jsx|.jsx|.android.json|.native.json|.json)
* node_modules\expo\AppEntry\index(.native|.android.ts|.native.ts|.ts|.android.tsx|.native.tsx|.tsx|.android.js|.native.js|.js|.android.jsx|.native.jsx|.jsx|.android.json|.native.json|.json)
at ModuleResolver.resolveDependency (C:\Users\HariC\AndroidStudioProjects\chat\node_modules\.pnpm\metro#0.72.3\node_modules\metro\src\node-haste\DependencyGraph\ModuleResolution.js:152:15)
at DependencyGraph.resolveDependency (C:\Users\HariC\AndroidStudioProjects\chat\node_modules\.pnpm\metro#0.72.3\node_modules\metro\src\node-haste\DependencyGraph.js:264:43)
at C:\Users\HariC\AndroidStudioProjects\chat\node_modules\.pnpm\metro#0.72.3\node_modules\metro\src\lib\transformHelpers.js:170:21
at Server._resolveRelativePath (C:\Users\HariC\AndroidStudioProjects\chat\node_modules\.pnpm\metro#0.72.3\node_modules\metro\src\Server.js:1196:12)
at async Server.requestProcessor [as _processBundleRequest] (C:\Users\HariC\AndroidStudioProjects\chat\node_modules\.pnpm\metro#0.72.3\node_modules\metro\src\Server.js:484:37)
at async Server._processRequest (C:\Users\HariC\AndroidStudioProjects\chat\node_modules\.pnpm\metro#0.72.3\node_modules\metro\src\Server.js:435:9)
Since android didn't work. I tried running web and I was prompted to install #expo/webpack-config. I installed it using expo install #expo/webpack-config#^0.17.2 and wow… It worked!

react-native cocoapods Error message : Looks like your iOS environment is not properly set

-When I configure the environment and run the following command
npx react-native init AwesomeProject
Error message
An error occurred while installing json (2.6.3), and Bundler cannot continue.
Make sure that `gem install json -v '2.6.3' --source 'https://rubygems.org/'`
succeeds before bundling.
In Gemfile:
cocoapods was resolved to 1.11.3, which depends on
cocoapods-core was resolved to 1.11.3, which depends on
algoliasearch was resolved to 1.27.5, which depends on
json
✖ Installing Bundler
error Error: Looks like your iOS environment is not properly set. Please go to https://reactnative.dev/docs/next/environment-setup and follow the React Native CLI QuickStart guide for macOS and iOS.
Error: Error: Looks like your iOS environment is not properly set. Please go to https://reactnative.dev/docs/next/environment-setup and follow the React Native CLI QuickStart guide for macOS and iOS.
at createFromTemplate (/opt/homebrew/lib/node_modules/react-native/node_modules/#react-native-community/cli/build/commands/init/init.js:129:11)
at runMicrotasks (<anonymous>)
at processTicksAndRejections (internal/process/task_queues.js:95:5)
at async Object.initialize [as func] (/opt/homebrew/lib/node_modules/react-native/node_modules/#react-native-community/cli/build/commands/init/init.js:181:3)
at async Command.handleAction (/opt/homebrew/lib/node_modules/react-native/node_modules/#react-native-community/cli/build/index.js:106:9)
info Run CLI with --verbose flag for more details.
I hope that no error will be reported when downloading the project
-Additional information
my Ruby version is :2.7.6
my Mac is :macOs Monterey 12.5.1
my Xcodeis :14.2(14C18)
my pod is : 1.11.3

Importing tensorflow in vite

Apologies in advance as I'm sure these are rather trivial matters - I am in the "hello world" phase of learning front-end development.
I have a hello-world vite app, which I created and ran simply via:
npm init #vitejs/app
cd hello-vite
npm install npm run dev
I'm able to view the outputted localhost url in my browser.
I also have a simple script that imports tensorflow and does something with it:
$ cat test.mjs
import * as tf from '#tensorflow/tfjs-node'
const a = tf.tensor([[1, 2], [3, 4]]);
a.print();
$ node test.mjs
2022-06-27 22:04:16.968270: I tensorflow/core/platform/cpu_feature_guard.cc:151] This TensorFlow binary is optimized with oneAPI Deep Neural Network Library (oneDNN) to use the following CPU instructions in performance-critical operations: AVX2 AVX512F FMA
To enable them in other operations, rebuild TensorFlow with the appropriate compiler flags.
Tensor
[[1, 2],
[3, 4]]
Now I want to get this test.mjs behavior within my hello-vite app. So I tried something like:
$ cat main.ts
import './style.css'
import * as tf from '#tensorflow/tfjs-node'
const a = tf.tensor([[1, 2], [3, 4]]);
a.print();
document.querySelector('#app').innerHTML = `
<h1>Hello Vite!!!</h1>
Documentation
`
But when I run npm run dev, it doesn't seem happy, and spouts seemingly unrelated complaints about aws stuff:
$ npm run dev
> hello-vite#0.0.0 dev
> vite
vite v2.9.12 dev server running at:
> Local: http://localhost:3000/
> Network: use `--host` to expose
ready in 112ms.
✘ [ERROR] Could not resolve "mock-aws-s3"
node_modules/#mapbox/node-pre-gyp/lib/util/s3_setup.js:43:28:
43 │ const AWSMock = require('mock-aws-s3');
╵ ~~~~~~~~~~~~~
You can mark the path "mock-aws-s3" as external to exclude it from the bundle, which will remove
this error. You can also surround this "require" call with a try/catch block to handle this
failure at run-time instead of bundle-time.
✘ [ERROR] Could not resolve "aws-sdk"
node_modules/#mapbox/node-pre-gyp/lib/util/s3_setup.js:76:22:
76 │ const AWS = require('aws-sdk');
╵ ~~~~~~~~~
You can mark the path "aws-sdk" as external to exclude it from the bundle, which will remove this
error. You can also surround this "require" call with a try/catch block to handle this failure at
run-time instead of bundle-time.
✘ [ERROR] Could not resolve "nock"
node_modules/#mapbox/node-pre-gyp/lib/util/s3_setup.js:112:23:
112 │ const nock = require('nock');
╵ ~~~~~~
You can mark the path "nock" as external to exclude it from the bundle, which will remove this
error. You can also surround this "require" call with a try/catch block to handle this failure at
run-time instead of bundle-time.
10:06:42 PM [vite] error while updating dependencies:
Error: Build failed with 3 errors:
node_modules/#mapbox/node-pre-gyp/lib/util/s3_setup.js:43:28: ERROR: Could not resolve "mock-aws-s3"
node_modules/#mapbox/node-pre-gyp/lib/util/s3_setup.js:76:22: ERROR: Could not resolve "aws-sdk"
node_modules/#mapbox/node-pre-gyp/lib/util/s3_setup.js:112:23: ERROR: Could not resolve "nock"
at failureErrorWithLog (/home/dshin/vite_scratch/hello-vite/node_modules/esbuild/lib/main.js:1605:15)
at /home/dshin/vite_scratch/hello-vite/node_modules/esbuild/lib/main.js:1251:28
at runOnEndCallbacks (/home/dshin/vite_scratch/hello-vite/node_modules/esbuild/lib/main.js:1034:63)
at buildResponseToResult (/home/dshin/vite_scratch/hello-vite/node_modules/esbuild/lib/main.js:1249:7)
at /home/dshin/vite_scratch/hello-vite/node_modules/esbuild/lib/main.js:1358:14
at /home/dshin/vite_scratch/hello-vite/node_modules/esbuild/lib/main.js:666:9
at handleIncomingPacket (/home/dshin/vite_scratch/hello-vite/node_modules/esbuild/lib/main.js:763:9)
at Socket.readFromStdout (/home/dshin/vite_scratch/hello-vite/node_modules/esbuild/lib/main.js:632:7)
at Socket.emit (events.js:314:20)
at addChunk (_stream_readable.js:297:12)
Vite Error, /node_modules/.vite/deps/#tensorflow_tfjs-node.js?v=0ea0383e optimized info should be defined
If I comment out the print() call and the line before it, the errors disappear.
What am I doing wrong? How do I make sense of these errors?
I don't know too much, but #tensorflow/tfjs-node appears to just be a Node project, and won't work in the browser.
For example, node-pre-gyp is a C++ binding library for Node, that is definitely not going to work in the browser.
You can try doing npm install mock-aws-s3 and the other libraries that errored, see how far that gets you, but likely won't help.

How do I get 'onoff' working on a Raspberry Pi 4B?

I am trying to make a 'Coocking-aid'. I am using a Raspberry Pi 4B with the official 7" touchscreen and an active piezo buzzer. The 'program' should run in Chromium (the RPi's webbrowser) and I write it in HTML, CSS and Javascript. I can do some tricks in Javascript but lack a lot of knowledge there. I try to sound the buzzer with Javascript, but so far without success.
The buzzer is connected between GPIO-pin 17 and Ground (connector-pins 11 and 9). When GPIO 17 is made high (+3V) the buzzer will sound.
I have tested this 'circuit' with a small Python program, which successfully turned the buzzer on:
1. from gpiozero import Buzzer
2. buzzer = Buzzer(17)
3. buzzer.on()
To do the same with Javascript I learned that I needed to install Node.js and its module 'onoff'.
From this web-post 1 I learned how to install node.js, by typing the following commands in the terminal:
curl -sL https://deb.nodesource.com/setup_15.x | sudo -E bash -
sudo apt install -y nodejs
I checked the installation by typing: "node -v". The response was: "v15.12.0"
I also checked the version of Node's package manager by typing: "npm -v". The response was: "7.7.5"
From this web-post 2 I learned how to install "onoff" by typing the following command in the terminal:
npm install onoff
I checked the installation by typing: "node -v". The response was "v15.12.0"
In the RPi directory "/home/pi/node_modules/onoff/examples" is a file called: "blink-led.js"
which I used as an example to create (in the same directory) a file called: "test.js" with the following code:
'use strict';
const Gpio = require('../onoff').Gpio; // Gpio class
const buzzer = new Gpio(17, 'out'); // Export GPIO17 as an output
buzzer.writeSync(17); // Make GPIO-pin 17 high
In the terminaI I moved to the same directory by typing:
cd /home/pi/node_modules/onoff/examples
and then executed "test.js" file by typing:
node test.js
Unfortunately the buzzer was not activated and a comprehensive error message was shown (see under).
I get the impression that the numbers are program line numbers and I had a look here and there, but I can't figure out what is wrong.
Any help would be much appreciated!.
The error message was:
/home/pi/node_modules/bindings/bindings.js:121
throw e;
^
Error: libnode.so.64: cannot open shared object file: No such file or directory
at Object.Module._extensions..node (node:internal/modules/cjs/loader:1151:18)
at Module.load (node:internal/modules/cjs/loader:972:32)
at Function.Module._load (node:internal/modules/cjs/loader:813:14)
at Module.require (node:internal/modules/cjs/loader:996:19)
at require (node:internal/modules/cjs/helpers:92:18)
at bindings (/home/pi/node_modules/bindings/bindings.js:112:48)
at /home/pi/node_modules/epoll/epoll.js:7:31
at Object.<anonymous> (/home/pi/node_modules/epoll/epoll.js:15:3)
at Module._compile (node:internal/modules/cjs/loader:1092:14)
at Object.Module._extensions..js (node:internal/modules/cjs/loader:1121:10) {
code: 'ERR_DLOPEN_FAILED'
}

Categories