Can babel transpiled code run in browser without polyfills - ecmascript-6

I'm very much interested to use ES6 features in my current project. I checked out and found couple of options: TypeScript and Babel. I'm planning to try Babel. My worry is, the code I write in babel after traspiling can it safely run in IE9? or do I need polyfills still?

Yes, code generated by Babel will run in IE9 (there are caveats, you need to use plugins in Babel 6).
However, Babel only transpiles ES2015/6 language features (new syntax changes, keywords, etc). If you want to use ES6 built-ins such as Promise, WeakSet/Map and so on, you will need a polyfill for non-compliant browsers.

Related

$jscomp not defined in code loaded for clojurescript and reagent

Using clojurescript 1.10.758 and reagent 1.0.0, I am running into an error in which a file index.js tries to reference $jscomp, which is not defined.
I've seen a number of Stackoverflow and Github issues related to $jscomp being undefined in the context of shadow-cljs, but I'm not using that.
The problem occurs when I use a development mode build with figwheel (using Leiningen with cljsbuild and the figwheel plugin), and also occurs if I use cljsbuild for a once-only development build. Strangely, if I use webpack to create a bundle, the problem does not occur.
Before I tried to make webpack work, I did have working code without webpack. Something I changed seems to have affected the non-bundled build. The only change I can thing of was to install react and react-dom using npm, and exclude those packages from reagent in Leiningen's dependencies. But undoing the exclusion didn't make the non-bundled code work again.
Any suggestions for how to cause $jscomp to be defined when it's first needed?
$jscomp is related to the Closure Compiler and the Polyfills it creates.
It might be enough to tweak the :language-out :es6 compiler options which is somewhat similar to the :output-feature-set option used by shadow-cljs. The best way to debug this is finding the actual code that is getting polyfilled and why. Might require digging through some compiled JS though.
shadow-cljs uses the Closure Compiler more extensively than regular CLJS or figwheel but they also use it. Solutions that apply to shadow-cljs pretty much apply to other tools as well. Just the settings may work a little differently.

Wro4j vs grunt gulp and others

Here's the deal : we have a big product with legacy, and custom code to handle minification, packing, compilation (for less files) for all our front end assets.
We think about using wro4j, but I've come across multiple articles advising to use grunt or gulp instead.
I'm here to find advices about which is the best choice.
With JS advanced beyond just minification, packaging to transpilation and tree-shaking etc there is definitely a plus to using grunt and gulp where such features are supported. In wro4j you have limited choices for processors available. https://wro4j.readthedocs.io/en/stable/AvailableProcessors/
Hence you have to write your own custom processors to support new features in your build process.
Plus, I am an advocate that front-end developers find it easy to understand/edit build processes written in their native language (grunt and gulp use JS) than having to learn Java and Maven to get familiar/working with wro4j

Public/private moethod declaration-only on ES6 classes with babel

I'm using Babel with default es2015 preset to convert ES6 JS code. Since I'm working in another project with TypeScript, I've come to appreciate the publi/private annotation on methods.
I'd like to use the same annotation in JS code. Even if it won't actually make methods on the exported object private, I find it useful to know quickly if a method is used by other classes, or not.
Is there a Babel plugin or other means to strip away all public/private declarations, so I can use it in my code? even without namespace checking that would still be very helpful.
There is a current proposal for "Private Fields" that is in the process of being implemented, but it not part of Babel yet. In the next month or two I'd expect it to be available.

Minify ceylon-sdk and ceylon-language when compiling to javascript

For an in-browser application written in ceylon-js it would be desirable to reduce the size of the ceylon.language-1.2.0.js file to only that what is actually needed.
This question was answered already.
How to use ceylon js (also with google closure compiler)
But the given solution involves manually editing javascript code resulting from compilation. This is not desirable since a compiler should produce code that hasnĀ“t to be edited manually after compilation (abstraction).
And it is not clear to me if google closure compiler can cope with the ceylon flavour of it in a reliable way.
Is it instead a solution to copy ceylon.language source in ceylon into the project and import only those parts of ceylon.language into the project that are required by it? Then compile to javascript. And then leave away ceylon.language-1.2.0.js at all from the client / in-browser application.
Now my questions:
What parts are needed in the most simple browser application? I think of something like Array(String) and the like.
Has that solution a chance to work absolutely reliable?
Will there be a better solution coming from the authors of ceylon that make this attempt obsolete?
The compilation of the language module to JS is a tricky process, because of the native stuff involved and because there are a couple of declarations that have to be in a certain order for things to work.
Minification is still pending, we are going to do it but it's not the highest priority right now, and we have to determine the best way to solve this problem; one option that has been discussed is to have a version of the language module without any metamodel info, for example.

How to use gulp-webpack with famo.us

How do I use webpack with famo.us
I found a seed https://github.com/Vertice/famous-webpack-seed and have seen it in use with grunt before. I was wondering if anyone could help me implement it with Gulp. I don't seem to be able to figure out how to get gulp-webpack to find and use the famous modules. Either through the pre compiled require version or the npm uncompressed version.
No doubt the webpack is useful to those who have lots of gulp specific stuff, and I think it's great to see the number ways of being able to get going with Famo.us is increasing, but I think the official generator-famous starter is a lot more fully featured, better documented, and has easier commands IMHO.