is it required babel configuration when I use vite in place of webpack - node.js

Recently I was create react app using vite , it is lightweight , less config and fast then compare with webpack . now my question is , is it required bable configuration in Vite project

No, vite does automatic syntax transforms but it only targets browsers that support es modules (firefox & chrome started supporting it around 2018). If you want to support new js features in older browsers you need to add polyfills though. You can read about the exact behavior and how to support even older browsers here.

I think that question need more information about that topic.
Vite.js uses the built-in JavaScript support of the browser, so you don't need to explicitly configure the JavaScript version in Vite.js itself.
When I said Vite.js uses the built-in JavaScript support of the browser, I meant that Vite.js relies on the JavaScript engine of the browser to interpret and run the JavaScript code in your application. The JavaScript engine is the component of the browser that executes JavaScript code. When you visit a web page that contains JavaScript, the browser runs the JavaScript code using its built-in JavaScript engine. This means that the version of JavaScript that is supported by your application is determined by the version of the JavaScript engine that is built into the browser. In the case of Vite.js, the JavaScript code in your application is not transpiled or otherwise modified before being run by the browser. However, if your application uses modern JavaScript syntax that is not supported by the target browsers, you will need to transpile the code to an older version of the language that is supported. In that case, you can use Babel.

No, it is already setup on the background. However if you'd like to adjust Babel's config you can do it. Read the docs here: https://github.com/vitejs/vite-plugin-react/blob/main/packages/plugin-react/README.md

Related

How to obfuscate code in Vite's library mode

I've built a project with Vite. I started from the vanilla TypeScript template. When I created a web page all of the JavaScript code was heavily minified and obfuscated. I did not have to ask for this; it was on by default. However, when I turned on Vite's library mode, my JavaScript is readable again.
Is there a way to make a library build and have it obfuscated and minified?
Minification is purposely disabled in lib mode for the es format because it breaks tree-shakability of the output. Vite only obfuscates/minifies the non-es formats (e.g., umd), and there's no config to override that.

What to use in tsconfig, commonjs, umd, or es6 module?

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

Why webpack and babel are dependent on Node.js to run?

I was learning babel and webpack and then it turns out I need to install node.js to run them both and I asked myself WHY? Then according to my research, we need node.js for webpack and babel since both of them were written in JS and to run that JS code which transpiles( for babel) and bundles up the code(for webpack). Also, another reason is that since both babel and webpack handles our JS code outside of the browser, this is the reason to use Node.js. Are these reasons true?
According to the Node.js website -
Node.jsĀ® is a JavaScript runtime built on Chrome's V8 JavaScript engine.
Webpack and babel (along with many other tools you might use for frontend development) are written in javascript and since they are command line tools, they need a way to run outside of the browser (directly on your machine).
They could have used some other language to write the tools but since they chose to write them in javascript, Node.js is the only feasible options right now.
In case you are interested, the original creator of nodejs
Ryan Dahl has built another secure runtime environment for Javascript/Typescript called Deno
Yes, at the moment the node.js project is non-portable by full open source disclosure nor extension to port node.js commonjs without a just in time transpiler with a service worker on a server.
Definitions: FHC = "from half court"
Babel and webpack
(1) transpile/move (write&read, not ln -s sym...bolic link) & (2) compost/pile onto a JIT target,
like v8 or other browser-javascript-interpreters. v8 on a service worker can compile on the edge just in time for interpretation in a browser v8 environment but still on the cloudflare edge server.
Declare (FHC) Allegedly, rust provides webassembly modules with the lipid [llvm-]wrappings
that nucleic acid exocytosis needs to be a full-blown virus, err I mean
Initiation Routine needs to be a targetable JIT extension!
A compiler/transpiler still requires it's target-scope receivable. Declare (FHC) Emit is to execute as compile is to interpret, even AST.

Execute Javascript before launching the default XUL page

Have to execute scripts using spidermonkey(jagermonkey) javascript engine availalble within XULRunner.The javascript has some dependent Javascript libraries like requriejs/commonjs etc.
RequireJS provides documentation for Rhino/NodeJS javascript runtime environment.The documentation or testcases does not suggest anything about Spidermonkey scripting environment.
Is it possible to use requirejs with Spidermonkey?Any pointers on how to go about it ?
I am using the javascript runtime packaged within XULRunner 2.0.
For XULRunner in particular, you can take a look at the Firebug code -- it embeds requirejs with an adapter for running in XUL.

JS library that provides simple utilities for browsers and the nodejs environment?

I'm looking for a javascript library that attempts to provide the same simple utilities in both the browser environment AND nodejs (iteration, mapping, maybe control-flow) so that code can more easily be re-used across server and client. I know you can hack out parts of any JS library (YUI, jQuery, ...) and get them to work in both environments, I'm just wondering if it's already been done or standardized.
The closest I've seen is this: https://github.com/kof/sharedjs
But it's incomplete and has some odd stuff. I'm wondering if there is something more polished before I fork and hack.
The underscore library was built to add more functional programming to jquery, things like mapping, and also templating.
Because it doesn't rely on the DOM (it leaves that to jquery) it functions well in node.
The RightJS link library has a server build link that has node.js in mind.
From the download page:
RightJS is also available as a server-side library. In this case it contains only the native JavaScript unit extensions and the Class, Observer, Options units along with all the non-DOM utility functions from the Util module.
Our server-side build follows the CommonJS principles and is ready for use with the node.js framework.
Node's GitHub wiki has a list of CommonJS-compatible modules which will run in Node and browsers.
Some of the other modules on that page may also run in a browser environment. For example, the excellent DateJS works fine in Node. (It is available as a NPM.)
Btw, RightJS is also available on NPM

Resources