Unable to resolve path to module './package.json' in React native application - node.js

I am trying to get application version in my react native app.
To get app version, I have written following code.
import { version } from './package.json';
console.log(version.appVersion);
But, It's throwing error like following
[eslint] Unable to resolve path to module './package.json'. [import/no-unresolved]
Any suggestions?

I have fixed is some syntax error in package.json
Package.json data just check with https://jsonlint.com/ website wether it is valid json data or not.
I my case, There is one } symbol missed. So, Fixed. it.

Related

Flutter In_App_Purchase Error: Error [ERR_REQUIRE_ESM]: change require() of ES Module \node_modules\camelcase-keys\index.js to dynamic import()

I am trying to setup Flutter In_App_Purchase (The offical Flutter In_App_Purchase Package) and I run into a problem with the firebase-backend. Whenever I try to deploy it, I run into the following error:
Failed to load function definition from source: Failed to generate manifest from function source: Error
[ERR_REQUIRE_ESM]: require() of ES Module C:\Users\larak\Desktop\Fashionbook\FashionLookbook_FlutterIAP_Backend-IAP\firebase-backend\functions\node_modules\camelcase-keys\index.js from C:\Users\larak\Desktop\Fashionbook\FashionLookbook_FlutterIAP_Backend-IAP\firebase-backend\functions\lib\app-store.purchase-handler.js not supported.
Instead change the require of index.js in C:\Users\larak\Desktop\Fashionbook\FashionLookbook_FlutterIAP_Backend-IAP\firebase-backend\functions\lib\app-store.purchase-handler.js to a dynamic import() which is available in all CommonJS modules.
I think it's related to this line in app-store.purchase-handler.ts:
import camelCaseKeys from "firebase-backend/functions/scr/camelcase-keys";
Full example code here: https://github.com/flutter/codelabs/tree/master/in_app_purchases/complete/firebase-backend
I tried to change it as described in the error message, but I wasn't able to achieve it. I have zero experience with TypeScript. I'm a Flutter developer and I usually use Node.js with JavaScript.

errors: does not provide an export named when using vite in grpc-web project

I'm trying to use vite
I've some JavaScript-generated files for GRPC communication; alongside each file, there is a declarative file because I'm using React with TypeScript. When running Vite, I get this error:
Uncaught SyntaxError: The requested module '/src/grpc-web/offboard/dashboard/web_vantage_server/proto/display_option_pb.js' does not provide an export named 'DisplayOption'
Anybody has encountered this issue and has a solution?
Thanks

Babel Loader doesnt compile my own NPM package in react app

Ive only been learning Javascript/Typescript since the start of the year as I decided to create a group of microservices that are all linked together. I have my own API created in nestJS and found that whenever I wanted to call the API from each microservice i was repeating the same code over and over again so I moved it all into its own separate package which I can use.
Every other project I have which uses my npm package does not cause any errors and works fine however these projects are done using babel. I decided to implement my new package into my react frontend project but whenever I import the package and try to use it I get an error
SyntaxError: D:\Projects\Node\Lab Maker\redditbot-frontend\node_modules\labmaker-api-wrapper\lib\utils\BaseAPI.js: Missing class properties transform.
I managed to fix this issue by installing the babel class transform package but then was presented with another error.
Failed to compile.
./node_modules/labmaker-api-wrapper/lib/utils/BaseAPI.js 13:9
Module parse failed: Unexpected token (13:9)
File was processed with these loaders:
* ./node_modules/babel-loader/lib/index.js
You may need an additional loader to handle the result of these loaders.
|
| class API {
> APIBase;
| APIUrl = 'http://localhost:3000';
|
I'm not sure what is wrong with my package or what causes this error but if anyone is able to take a look at the source code for my npm module and explain how I would fix this issue that would be helpful. https://github.com/LabMaker/API-Wrapper
this is the npm package https://www.npmjs.com/package/labmaker-api-wrapper

Weird text before error message on node js

what causes this weird text which looks like compressed js on node js error logs. I use esm module loader.
error log on terminal
Edit: I should have clarified that I caused the error on purpose. What I ask is the text on top of it. it is in every error log.
You have a syntax error where you define your hook. You missed the '('. Try this:
app.use('/graphql', createeGraphql());
So turns out esm package is the problem. it logs some minified js every time there is an error. I checked its GitHub repo and turns out it isn't maintained anymore so don't use esm. just put this line to your package.json if you want to use es6 import, export syntax.
{
//rest of your package.json
type:"module"
}

Error importing 'vscode-languageserver' in a React app

I am trying to create a playground using monaco-editor and vscode-languageserver to show the features of my language server.
However when I try to import 'vscode-languageserver' from a page like the following example
//# src/pages/test.js
const { TextDocument } = require("vscode-languageserver");
console.log(TextDocument.create('a' , 'b' , 'c' , 'd' ));
https://github.com/zkrami/docusaurus-test/blob/master/src/pages/test.js
I get the following errors:
Module not found: Can't resolve 'child_process' in 'C:\Users\Rami\git\my-website\node_modules\vscode-languageserver\lib'./node_modules/vscode-languageserver/lib/files.js
Module not found: Can't resolve 'fs' in 'C:\Users\Rami\git\my-website\node_modules\vscode-languageserver\lib'./node_modules/vscode-jsonrpc/lib/pipeSupport.js
and please note that if I imported the module in the docusaurus.config.js file it works perfectly.
I made a quick example you can try:
https://github.com/zkrami/docusaurus-test/
Specifications:
yarn 1.22.4
node v10.15.3
OS: Windows
#docusaurus/core: "^2.0.0-alpha.54"
I ended up using vscode-languageserver-protocol package which fulfill my requirements.
fs is a Node module and requires Node runtime, you can't use it in the browser.
This is not a Docusaurus issue, you wouldn't be able to use it in any client-side React app.

Resources