Importing modules in Angular2 - node.js

As per understanding , Node js uses CommonJS module pattern , and in CommonJS
pattern we use require() to import a node module.
In Angular 2 application development we use #angular/core , #angular/common etc
node modules.
My question is:
Why do we use "import {} from '#angular/core'"[which is ES6 module syntax]
instead of commonJS require() syntax for accessing node modules
in angular2 code files.

The reason for this, is that Angular2 is written in TypeScript.
TypeScript is a superset of ES2015, and wants to be as close to ES2015 suggested syntax as possible. That's why you use the ES2015 import {} from syntax.
However, TypeScript also comes with a built-in transpiler (tsc). Meaning you write TypeScript code, but target a specific EcmaScript version in your tsconfig.json
When targetting ES5 and looking into the transpiled code, you will
clearly see that behind the scenes TypeScript will translate import {} from to require()in the transpiled files.
When targetting ES6, of course in the transpiled code, your imports will be ES2015 imports. Be aware that when targetting ES6, you will need babel to transpile your ES6 modules to ES5 or use System.js to load your ES6 modules in the browser.
Cheers

Related

CommonJS require() or ES6 import/export in nodejs production?

I have got the latest version of npm modules and developing a nodejs application. The problem is that some npm modules support the require() and the others support the import/export statements, I cannot use them both in a file.
Having the production criteria in mind, which should I opt for either only require() or only import/export or a mix of those using the dynamic import() along with the require(). Thanks
I assume we are talking about plain JavaScript without transpiling from TypeScript or Babel.
The require() function is used to load CommonJS modules whereas the import statement is used to load ESM modules. Which of them you should or can use depends on factors such as:
does your target Node.js version support ESM? I think ESM in Nodejs support got introduced in v12, but I'm not sure how stable it is.
is your package defined as ESM or CommonJS module. That depends on the type field in your package.json, with "type": "module" for ESM and "type": "commonjs" for CommonJS: https://nodejs.org/api/packages.html#type
are your package dependencies provided as ESM or CommonJS modules. That depends on each individual package.json and their type field as well as if the package is provided as both ESM and CommonJS modules with conditional exports: https://nodejs.org/api/packages.html#conditional-exports
Unfortunately, I cannot provide a definite answer for you because that depends on your environment. ESM and import statements are going to be the future of JS, but the ESM support in the Node.js ecosystem is not on par with CommonJS yet.
With this in mind, I would opt for CommonJS modules but I would use a transpiler like TypeScript so I can still use modern features of JS.

when modules: false set by babel, then how can nodejs parse the import es6 module statement?

As I know, nodejs can only understand require syntax, not the import/export statement.
So When I want to use es6 module statement in nodejs, I have to configure babel and transpile those es6 module statement into the require syntax so that nodejs can understand what to do.
https://github.com/kentcdodds/jest-cypress-react-babel-webpack/tree/tjs/jest-00
But seeing this repo, the author is using module:false with the babel configure (see .babelrc file)
As I know, module:false option prevents the es6 module statement from being transpiled.
Nodejs still cannot understand import/export statement, but how does that work without transpiling..? Any advice would be appreciated!

How to make node require es5 lib from node_modules

I am trying to convert Express.js project to binary, and I am using zeit/pkg libary. However, it gave me an error every time I try to use pkg.
Is there a way that I can force Node/Npm to use es5 instead of es6.
in your snapshot the module is being imported from ..er/node_modules/safefs/es6/lib/safefs.js
notice it is importing from es6 which has export keyword. that means its an es6 module and your node supports 'commonjs' require.
which is why this require may be failing.
you can download latest version of node where you can resolve es6 modules.

Using ES6 in Nodejs without transpiling code

I am using Nodejs v9.0.0. I have to use Babel for transpiling the code into ES5 because if not transpiled it throws error unexpected token import. So If anyone know how to use the real ES6 version in nodejs and which nodejs version. Please let me know.
Thanks
All es6 is supported by NodeJS since 8.10 version : look at the column NodeJS in the es6 compatibility array.
Unforfunately the ES6 Module syntax is not supported or only with the flag experimental.
So you need to convert your ESModule in CJSModule. You can do it with the babel-plugin-transform-es2015-modules-commonjs plugin
In your .babelrc file :
"plugins": [
"transform-es2015-modules-commonjs"
]
If you use babel-register the transformation occurs when the file is required(imported)

Compiling Typescript to NodeJs: es6 types issues

I think i'm missing something with the typescript 2 type system when used with nodejs.
Here is the situation:
Compiling a small nodejs express server written in typescript to plain es5 in order to be run under node 6.10.0 (target: es5 in tsconfig.json).
In my package.json, i installed #types/node (7.0.3) to get node's type informations.
When installing my project using npm (v3.10.10) and then compiling it with typescript (v2.1.5) i get a bunch or errors related to 'Iterable' and 'Iterator' symbol, (which are es6 symbols).
So from what i understand, #types/node use es6 types out of the box, assuming they are already availables.
In order to have the es6 types (Iterator, Iterable and so on) it seams that there is two solutions:
Add the core-js package.
Target es6 instead of es5 in tsconfig.json which will force typescript to use it's lib/lib.es2015..d.ts* definitions files.
In my opinion, the second approach is better.
Is this the official way to go when compiling ts to node ?
ie: targeting es6 in tsconfig ?
How can i be sure that the underlying node engine will effectively support those es6 features ? What if i'm using an old nodejs version without es6 support ?
I'd be glad to discuss to clearly understand the underlying mechanisms !
Thank you
Since node doesn't support completely all es6 features yet see : node green,
it's better to target es5 and install core-js types :
npm install #types/core-js

Resources