In the example of react native tutorial, I find syntax which is defined in ECMAScript 2015 (ES6) standard called Destructuring assignment. But as I know, iojs and nodejs do not support this syntax. How can I use it in React Native?
You are right nodejs and iojs do not support ES6 syntax. But react native:
As of version 0.5.0, React Native ships with the Babel JavaScript compiler.
Read more here
That means that there is another transpiler (Babel) at work in the React packager. It converts from ECMAScript 2015 (ES6) to ES5. This allows you to use the ES6 features like: destructuring, computed property keys, classes, arrow functions, block-scoped variables and more.
If you want to use those features in the React (not Native) app, you will need to include Babel in your project.
Edit:
There is no another transpiler.
React and React Native have both switched their respective build systems to make use of Babel. This replaced JSTransform, the source transformation tool that we wrote at Facebook.
More in Deprecating JSTransform and react-tools
Related
I'm trying to upgrade an angularJS project and I'm stucked on one question, but let me summerize the project:
We use AngularJS, gulp and node 8.
we currently cannot use the ES6 features, like arrow functions, const/let and so on.
I achieved that by installing babels plugin. But babel transpiles the code, and the company staff doesn't want that, cause it can make it difficult to debug on production(I know we can use sourcemaps, it will be suggested).
We just want to write ES6 code and read(on the browser) the same code as we do now (but with es5)
I upgraded node to 10 and I thought that by upgrading node, the app would accept the new ES6 features. But still crashes when using es6 syntax.
Can someone tell me why? If the browsers accepts, why gulp doesnt?
What module to use in tsconfig, commonjs or es6?
How to make desicion? I need that output module will work in client/back sides.
So here we are talking about the module option that will be used by typescript to determine what is the name of the module that will compile your code to the targeted version of javascript you specified with the option target.
So the underlying question you are asking is, what is my target ? Should I target ES3, ES5, ES6, ES7, ES8 or ... ES42 ?
Answer : the compatibility.
In 2020 you propably target ES5 or ES6 (which is the default value).
(You can ignore CommonJS because it relate to ES3 which is 99% chance irrelevant to you)
some article
If your code is made to be executed on browsers, I would recommand you to look which is the latest version supported by all your targeted browser and take the one that is supported by all.
Ex: Safari ES6, Firefox ES8, Chrome ES8 : so you choose ES6 as target so your code works on every targeted browser.
The website caniuse.com is usefull to know which features are supported and which are not
If your code is made to run on backend (node.js), look at which version of node.js is running. Every version of node have different capabilities.
You can have a look here
Additionnal materials :
What version of Javascript is supported in node.js
I have a node js application.
All the codes are now in javascript.
But in some part of my app I want to use Typescript Interface or enum options.
How can I use Typescript just for those part of the app?
I don't want to refactor all the project to using Typescript.
You can try Flow https://flow.org
Flow in opposition to TypeScript isn't a superset or language. It's a static type checker for JavaScript. Because it's not a language, it can be smoothly integrated with JavaScript with a single comment annotation.
You can add a single .ts file, and use plain javascript for the rest of them.
https://www.typescriptlang.org/
TypeScript is a typed superset of JavaScript that compiles to plain
JavaScript.
[...] Use existing JavaScript code, incorporate popular JavaScript
libraries, and call TypeScript code from JavaScript.
TypeScript compiles to clean, simple JavaScript code which runs on any
browser, in Node.js, or in any JavaScript engine that supports
ECMAScript 3 (or newer).
I'm learning node.js and am wondering why it uses the require syntax rather than the import syntax which React uses.
i.e.
const Validator = require("validator");
VS
import Validator from "validator";
I believed import is es6 but I don't think that explains why it's not used in node.
the import and default are newer ES6 features, not yet used by node. Node is actually already implementing the new features as experiment though: with the --experimental-modules flag and only for files saved with .mjs extension.
Transpilers like babel make it possible to write modern, spec approved and /or experimental ECMAScript. In an ecosystem of bundlers like Webpack with transpilers like babel, it becomes easy to write maintainable, future-proof javascript, while the code remains widely suported because it's transformed to commonjs (the format you see recognizable byrequire (the old-school import) and module.exports (the old-school export).
Probably for historical reasons. node.js and chrome (v8 engine) are older than ES6 standard.
On the other hand, see:
How can I use an es6 import in node?
You may use import, too.
I believed import is es6 but I don't think that explains why it's not
used in node.
Just like the way NodeJS implements their entire library which tons of asynchronous functions which only support callback-based approach. Thinking this way and you'll realize that, sooner or later, the NodeJS framework will definitely support the import syntax and upgrade all of those asynchronous functions to support promise-based.
I just found out that async/await in TypeScript isn't supported unless you use ES6, which we cannot use. TypeScript 2.0 beta is coming out "still" without this feature.
What solution can I use, can I do an "npm install promises" and use that, or does that require ES6 too? I do not want to roll my own solution here. Does anyone know of a npm package that can do async/await syntax without ES6? We are doing pure node.js side coding.