Cannot resolve dependency with within imported node module called "node-fetch" - node.js

Still somewhat of a beginner in Node, so apologies for what might be a newbie question. I have a small Chrome extension that I built where the only imported node module is one called node-fetch. I've never had trouble running yarn build to build a package that includes all the requisite dependencies. However, when I try to build my current package, yarn throws this error in the console:
🚨 /Users/me/Documents/GitHub/my-project/node_modules/node-fetch/src/index.js:9:17: Cannot resolve dependency 'node:http'
7 | */
8 |
> 9 | import http from 'node:http';
| ^
10 | import https from 'node:https';
11 | import zlib from 'node:zlib';
12 | import Stream, {PassThrough, pipeline as pump} from 'node:stream';
error Command failed with exit code 1.
info Visit https://yarnpkg.com/en/docs/cli/run for documentation about this command.
ERROR: "build:bg" exited with 1.
error Command failed with exit code 1.
info Visit https://yarnpkg.com/en/docs/cli/run for documentation about this command.
So, this error is coming from the node_modules file myself rather than the code I wrote. Inside the package.json, I only declare this one dependency:
"dependencies": {
"node-fetch": "^3.3.0"
}
I tried manually installing the referenced packages and referencing them in the dependencies but to no avail.
What am I missing?
Tried to yarn build a package with a dependency on the node-fetch module that I import into my code. yarn throwing an error on the node-fetch module itself when I attempt to build.

Reverting to ^2.6.1 resolves the problem. Still interested to learn a better solve.

Related

Integrating Semantic UI with a Gatsby Project - build fails due to missing closing ')'

failed Building development bundle - 14.691s
ERROR in ./src/semantic/semantic.less
Module build failed (from ./node_modules/mini-css-extract-plugin/dist/loader.js):
ModuleBuildError: Module build failed (from ./node_modules/less-loader/dist/cjs.js):
;(function ($, window, document, undefined) {
^
Missing closing ')'
1 ERROR in child compilations (Use 'stats.children: true' resp. '--stats-children' for more details)
webpack compiled with 2 errors
Following this article (https://www.artembutusov.com/webpack-semantic-ui/) and also checked out the thread here (https://github.com/Semantic-Org/Semantic-UI-LESS/issues/38). Downgrading the version for less hasn't worked.
Found a way to integrate semantic-ui without following the above linked article.
Run: npm install semantic-ui-css --save
Then import at the top level index.js page: import 'semantic-ui-css/semantic.min.css';
How to install and use semantic-ui-react

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

How to add google datastore package to electron app

My first electron app: it's an admin app intended to run only on my machine
I want to add the #google-cloud/datastore module to it, but electron won't start once I import the package.
I add the package using 'yarn add', then rebuild for electron using electron-rebuild as instructed here: https://electronjs.org/docs/tutorial/using-native-node-modules
The first error is:
Failed to compile
./node_modules/#grpc/grpc-js/build/src/channel.js
Module not found: Can't resolve 'http2' in '<...>\node_modules\#grpc\grpc-js\build\src'
So I try manually yarn add'ing http2, electron-rebuild, and 'yarn start', after which I get a few warnings:
./node_modules/http2/lib/protocol/index.js
Critical dependency: require function is used in a way in which dependencies cannot be statically extracted
./node_modules/grpc/src/grpc_extension.js
Critical dependency: the request of a dependency is an expression
./node_modules/grpc/node_modules/node-pre-gyp/lib/pre-binding.js
Critical dependency: the request of a dependency is an expression
./node_modules/grpc/node_modules/node-pre-gyp/lib/util/versioning.js
The app then starts but shows a long list of errors.
Error: Cannot find module './../process/browser.js'
... intermediate errors, below is the module trying to import
Module../node_modules/merge2/index.mjs
I'm not sure if/what I'm doing wrong, or if google datastore is somehow not compatible with electron?
Using the latest Electron & google packages (and no other changes) seems to have resolved this issue

Error with Webpack and Angular Fullstack installing 3rd party npm modules

So I have been working with angular fullstack for a while now. I am having an issue with webpack at this point. I need to install an npm module called bb-rest which can be found [here][1].
This module is an extension of Blackboard Learns public API for Developers. When install the module into the project, and add it to the app.js file as I normally do other NPM modules, Webpack throws a fit. It is not able to find module 'fs' and from there more errors come up.
Item | Version
----- | -----
generator-angular-fullstack | 4.2.2
Node | 6.11.3
npm | 5.4.1
Operating System | OS X 10
Item | Answer
----- | -----
Transpiler | Babel
Markup | HTML
CSS | SCSS
Router | ngRoute
Client Tests | Jasmine
DB | SQL
Auth | Y
NPM MODULE: bb-rest
I have looked through many of the previous issues with the error 'Cannot resolve module 'fs'' and have done changes to the config variable in the webpack.make.js file from solutions such as these.
Here
This one as wel
Tried this as well
Last Resort
When I attempt to inject the dependency in the app.js file, webpack upon compiling throws a fit. I've tried the approaches in the links provided above in order to resolve this with no luck. I even tried simply importing the required dependency into my controller, or a specific file where I need it, and webpack goes crazy. I set up a test project with just a simple node/express webapp and that works fine. I'm not too familiar with webpack and it's inner workings so I was wondering if anyone had any similar issues when trying to use third party npm modules in the stack.
Console Error Produced by Webpack upon compiling: pastebin.com/26RmwEUZ

Typescript is invalid

I upgraded angular to 4 and angular cli to 1.03.
After I run the command npm ls typescript I get:
+-- #angular/cli#1.0.3
| `-- typescript#2.2.2
`-- typescript#2.2.2 invalid
npm ERR! invalid: typescript#2.2.2 C:\development\projects-git\mydoc\static-web\node_modules\typescript
What's the difference between the first and the second typescript, why is the second one invalid/how do I fix it?
I think the error above is the reason why I get the error below so I hope there is a fix for both so I can run my application again.
ERROR in AppModule is not an NgModule
ERROR in ./src/main.ts
Module build failed: TypeError: Cannot read property 'newLine' of undefined
at Object.getNewLineCharacter (..\static-web\node_modules\typescript\lib\typescript.js:9580:20)
at Object.createCompilerHost (..\static-web\node_modules\typescript\lib\typescript.js:66674:26)
at Object.ngcLoader (..\static-web\node_modules\#ngtools\webpack\src\loader.js:202:31)
# multi webpack-dev-server/client?http://localhost:4200 ./src/main.ts
I had a similar issue where i even had two different typescript versions listed when i did npm ls typescript.
What's the difference between the first and the second typescript
The first one is listed as a dependency of #angular/cli, the second one is a dependency of your own project.
why is the second one invalid/how do I fix it?
In my case, i had typescript defined under both, dependencies and devDependencies section in my package.json.
I removed it from dependencies and the duplicate output disappeared.

Resources