NodeJS relative import using `#` - Module is not installed in WebStorm - node.js

I am working on a project created by others in Node.JS.
Noticed a pattern I've never used before.
All the inside imports are used with #.
ex: import Config from '#config/config';
Where config is a file inside /src/config/config.js.
Now, it's working flowlessly but WebStorm keeps complain about Module is not installed and suggest me to Install #config/config as dev dependency.
The real issue behind it is that WebStorm isn't able to autocomplete or help me in any other way regard those imports.
And how do I configure WebStorm to understand this?
Thanks!

Related

NodeJS require doesn't work. Cannot import downloaded npm modules

I have a slight problem with a basic Node.JS method. When I'm trying to use "require()' method to import any downloaded (with 'npm install ..) module/library, I get a Visual Studio Code message that asks 'to convert 'require'(which is a Common JS module) into ES. If I do it, it transforms 'require()' into 'import..' though I want keep using 'require()'. Why is it so ? I read somewhere that Common JS is already included in the Node.JS environment though.
Then, when trying to compile my index.js file (with 'node index.js'), I obviously get an error about 'require' not recognized method.
Error [ERR_REQUIRE_ESM]: require() of ES Module C:\Users...index.js from C:\Users...index.js not supported.
I tried then to install Webpack to fix this issue, but nothing change. I also kind of installed CommonJS (npm i common-js)..
Another common answer was to remove 'type':'module' from package.json file which normally should allow to use 'require', but I don't even have such a line in the file.
On top of that I've recently read that 'require' is not compatible with browser development tools (it's ok). But I'm trying to import a downloaded module/npm package in VSC terminal, not even in a browser.
As you understand I'm new to Node.JS, but I don't really get what's going on in this case...

Angular build - Module not found: Error: Can't resolve 'console'

I have a problem with my Angular project build, and ultimately deployment to heroku. I'm using an old(ish) npm package called binary parser, which causes the following error on when I build / deploy to heroku:
Module not found: Error: Can't resolve 'console' in '/tmp/build_e75b87f248f44978f9537d83b3172254/node_modules/binary-parser/dist'
The binary-parser.js has a line require("console"); which is used in exactly one place, so local builds succeed and the application works perfectly, if only I remove console from that line altogether. But as, heroku installs node modules when deploying, this only helps when I manually build the prod version.
I have installed typings for binary-parser and for TS, and also included "types": ["node"] in both tsconfig.json and tsconfig.app.json compilerOptions.
As angular these days doesn't really allow for webpack configuration, I've tried adding global.console = global.console || require('console-browserify');
(or)
global.console = global.console || require('console');
to my polyfills, to no avail.
Any ideas on how to solve this? Do I need to configure a custom webpack to circumvent this? I'll gladly post additional information if necessary!
Here's a possible cause, may or may not be what you or others reading this question are experiencing...
My IDE's auto importing added import * as console from "console"; when I typed console.log.
Solution was of course to remove that import statement.
After trying for multiple hours to come up with the right configuration, the only solution I could come up with was forking the repo in question and changing tsconfig target from es5 to es6, which got rid of the console import altogether upon compilation.

JetBrains WebStorm npm modules autocompletion not working

I am new to Node.js development and I have installed WebStorm from JetBrains to use it as my JavaScript IDE.
So I am following a tutorial in Udemy and I have come to notice the following problem.
I installed some modules with npm from WebStorm Console and although my JS script is working as intended, WebStorm autocompletion for the npm modules is not working.
Coding assistance for Node.js in my settings is marked! What do I do wrong?
The problems occur because of the weird way properties are defined.
For example, in chalk package they are generated dynamically using Object.defineProperty(this, styleName, {value: builder});, where the styleName is a color name you use in your code. There is no way to resolve them when analyzing file statically.
Normally installing Typescript stubs can be used as a workaround. But this doesn't work for validator due to WEB-43528.
chulk typings are included in package distribution, but not resolved because the required fields in package.json are missing. As a workaround, open node_modules/chalk/package.json and add "types": "index.d.ts", to it:
this should help:

Unable to import native nodejs module in electron project

I'm working on an open source electron project which I am building using webpack. One requirement for my project is to use the nodegit library which has to be built as a native module.
I've followed what appears to be conventional advice when working with native modules and electron. That is, I run electron-rebuild, have configured the source package to use and finally have configured node-loader to catch the import of any .node files.
Unfortunately, when I go to include the module, I end up with this error:
ERROR in ./node_modules/nodegit/dist/nodegit.js
Module not found: Error: Can't resolve '../build/Debug/nodegit.node' in
'C:\Users\atrauzzi\Development\atrauzzi\gerty\node_modules\nodegit\dist'
# ./node_modules/nodegit/dist/nodegit.js 18:11-49
# ./src/Layer/Domain/Thunktor/Git/CloneGitRepository.ts
# ./src/Layer/Gerty/Component/Repository/AddGitHubRepository.tsx
# ./src/Layer/Gerty/Component/Repository/AddRepository.tsx
# ./src/Layer/Gerty/Component/Workspace.tsx
# ./src/Layer/Gerty/Component/App.tsx
# ./src/Layer/Gerty/GertyServiceProvider.ts
# ./src/Bundle/GertyElectron.ts
The only thing I can see that's suspicious at this point is that when I rebuild the module to work with electron, I only get a Release directory, when the import seems to be looking for Debug:
This could be a red herring however as nodegit is written to try Debug as a fallback after Release has failed.
The general ask here is "How do I get this native module working in my project?".
I also have a corresponding question over at the repo, although on the off chance that my issue is unrelated to the library itself, or that there are some battle-worn veterans of native modules in electron, I figured SO would be a good place to check as well.
Try configuring your webpack by specifying the native module as an external dependancy rather than load it using the node-loader.
https://webpack.js.org/configuration/externals/

Using moment.js (or moment-timezone.js) in TypeScript project

This is what I've done so far :
Install NodeJs and play with it : the node command is available
Install TypeScript using npm : npm install typescript -g
Now I am able to create .ts files, use the TypeScript syntax and compile the files using tsc command
Okay, from now on everything works fine. What I am doing is translating a Java library to TypeScript. But I am facing an issue : The Java library is using the Calendar object and I need the same kind of object in TypeScript.
I've searched a bit and found moment.js. I wanted to import that library into my TypeScript files.
Question : How do I do that ? I've looked around on StackOverflow but in every post I found there was something that made me think this would not be my solution, like :
Install typings / tsd : I've read that now moment.js has now a definition file (? sorry, maybe it is not the good term, but it has a moment.d.ts file)
Check in random.config.json file : I do not have such a configuration file (not in NodeJs in my guess, and in TypeScript I have the tsconfig.json file, and tried to include the moment.d.ts file but I wasn't able to import it in TypeScript > "cannot find module moment")
Install moment from npm : I've done it, but I didn't find out how to include the moment.d.ts file in my project.
and so on ...
I would like to know what I am missing and how to include moment in my .ts files in order to use it. I probably lack of some knowledge about the organisation of these modules, so every explanation will be welcome.
NodeJs version : 7.1.0
TypeScript version : 2.0.10
EDIT
After digging a bit, I found that I could compile my .ts files using tsc Test.ts --traceResolution to see if the imports are resolved correctly. Result : They are ! The real problem now is that my IDE (Visual Studio) doesn't know about moment.
The thing is that I have created each .ts file manually, by creating a new file, changing the extension and opening it in Visual Studio. Maybe that is the problem ? I'm just using Visual Studio as a text editor with IntelliSense. Do I have to make something in order to make Visual Studio understand that the import comes from NodeJS ?
You do not have to install moment.js interface because it provides its own types definitions.
Import moment.js in typescript (you were right).
import * as moment from 'moment';
Use moment.js in typescript
var momentObject: moment.Moment
momentObject.something() (ex: momentObject.add(..))

Resources