Is it possible to use Angular Material without using CDK? - javascript

I'm trying to use Material the old school in ES5 using UMD module definition files.
It was all working fine, until I decided to upgrade to version 5. Now it says that it can't find bidi of undefined and as I investigated the issue, I realized that it's because of the new CDK or Component Development Kit.
Now I can't find a packages CDK UMD file that contains all of its parts in one place, and I really don't want to include all of those a11y, i18n, bidi, etc. one by one.
The question is, the more I look at CDK files, the more I realize that I might not even want them at all. I would be fine without them.
Is there a way to not load them and still use Material?

Related

Can we use multiple libraries in angular(2/4/5/6) because it supports TreeShaking ? Without hitting the performance and build size

I have gone through this article : https://www.reddit.com/r/Angular2/comments/6a678s/primeng_vs_material2/
In the comment they mentioned we can use Prime Ng and Angular material
together in app. In PrimeNg components are standalone modules mostly so you can add only the ones you need and same is true for Angular material after couple of updates.
My question is... Can we use multiple number of libraries as many as we want with Angular app Like: PrimeNg, Angular material, Fuse and many more. Without affecting the performance or size of the build, because Tree shaking will take care of it.
Basically I want to use Material only for designing layout and some look and feel that.
Also, Does angular(5/6) supports 100% tree shaking or still we need to use Rollup.js ? Gone through multiple article but not sure yet.
When you build an Angular app with production flag, every component, service, directive or pipe is referenced at least once (in #NgModule annotations). At the end of the AOT compilation, the compiler removes these annotations and after that it also removes unreferenced things.
Source
That said, every Angular Material component is a module, which gives you fine grained import of the library.
I don't know PrimeNg, but from what I quickly searched and as you already know it seems to have one module per component too.
Using both libraries should not affect bundle size nor performance, but you should be aware that the "look and feel" differs from UI library to UI library

Angular2.JS files with d.ts files WITHOUT npm Visual Studio 2015

Does anyone know of a recent blog post or tutorial on which angular 2 .js files along with the appropriate d.ts files I need so I can just drop them into an existing VS solution without using NPM? I see that I can get the angular files here, but not sure which ones I need. According to the Angular docs, I need do nothing to get typings files for library packages that include d.ts files—as all Angular packages do., but again, when I look thru a sample Angular app, don't know which d.ts files I need.
I can't stand bloat and clutter. Below is a brand new asp.net core on .net 4.6 on the left, the same thing on the right after following this blog:
I can't stomache having to add over 13,000 files to get ahold of maybe 20?, 30? files.
Maybe I'm being too OCD about this, but right now I'll take any suggestions to avoid that bloat, even going with another front-end framework. I've briefly looked at Aurelia, which I like, but again, NPM. Not sure React is appropriate.
My business domain includes Category, which is a self-referencing class/table, and I'm after an intuitive UI where the user can quickly create their own Category structure without having to do a bunch of post-backs to the server. Seems with either Angular2 or Aurelia, I'd only need a couple of Components to accomplish this in the browser.
I know Angular 1.5 added Components, and I may explore that if need be. From what I understand about React, it's not for data management.
So to reiterate my questions, can I get just the Angular2 files along with their d.ts files so I can code in typescript? If not, the same question for Aurelia. And if not, any way that I can keep bloat down yet still write some elegant front-end code.
Any help will be appreciated
Ok so for Development purposes yes your Angular 2 stuff will be massive (its annoying but necissary) however as I am sure you know, once you build your angular app for production (using angular cli for example) it cuts all those 40,000 files down to about 10. for example this is my application before and after production...
and after
So I would guess you want to build your angular stuff out first and then drop it in you application

is it possible to run two different versions of ReactJS on the same page?

Hello everyone I am wondering if is possible to run two version of ReactJS on the same page , something similar to jQuery.noConflict().
With a bit of research i have found two interesting things :
Two Reacts Won’t Be Friends
While I’m happy that everybody seems to be converging on NPM in 2015 and NPM wants developers to use it for managing front-end dependencies, it still has rough edges. The biggest problem with using NPM for front-end dependencies is that if two packages specify a library like React as a dependency, they might get two separate copies of React. Even worse, they might get different versions of it. This works fine for something like Node, but not for browser libraries that want to mess with the same global mutable DOM! NPM tried to solve this with peerDependencies but all hell broke loose and they’re backing out.
https://medium.com/#dan_abramov/two-weird-tricks-that-fix-react-7cf9bbdef375#.hfx35f6hl
And an issue on github: https://github.com/facebook/react/issues/1939
However is not clear for me how we could wrap & delivery our ReactJS widgets in order they could run without conflicts on a page using other version of ReactJS .
thanks
However is not clear for me how we could wrap & delivery our ReactJS widgets in order they could run without conflicts on a page using other version of ReactJS.
You can use Browserify with reactify to load your JS and version of ReactJS without conflicting with another ReactJS version that may be loaded on the page.
More information is available here:
Embeddable JavaScript widget with React

Exposing a Node.js library via ambient TypeScript

In an attempt to simplify the use of pg-promise library for those who prefer coding for Node.js in TypeScript, I created a complete set of ambient declarations needed to fully represent the library, and included it into the distribution in a separate folder.
However, being not a proficient TypeScript developer, I'm stuck in my research for best practices in doing this sort of thing.
I want to know if simply including ambient declarations in a separate folder is sufficient for developers to start using it right away, without running into problems.
I also want to write some sort of a short guideline for how to use those TypeScript declarations, but frankly, I am myself not doing a good job at it, even though the declarations all seem correct.
So my question is then:
Is there any article or a guideline to explain it to Node.js developers how to do it with the latest version of TypeScript? (best practices for exposing a Node.js library via TypeScript)
UPDATE
One of the very first problems I'm running into, trying to use such ambient declarations directly, from a TypeScript file - the main file refuses to find the two dependent ones, no matter what change I try, it keeps on saying Cannot file module....
UPDATE
I've tried countless per-mutations for how to re-declare the library, and yet I haven't been able to get it work after all.
I've tried to move dependent declarations inside one file, using in their own namespace and as an inner namespace.
I've tried different combinations of ambient declarations with classic declarations.
I've tried changing modules into namespaces.
It only brought me to a point of desperation and dislike toward TypeScript. All I want is to make my Node.js library readily usable for TypeScript developers.
Most of the time I've running into issues where it says that my TypeScript is not a module. In other cases it couldn't find some types. Nothing but trouble. Please somebody help me with this.
UPDATE
Should I even include TypeScript with the library or should it be published on Definitely Typed instead?

Flashdevelop for webgl with haxe & stdjs

I am currently trying to get an instance of the WebGL context in HaxeJS using FlashDevelop. I would like to use the stdjs library.
I have imported the dependencies using haxelib with:
haxelib git xirsys_stdjs https://github.com/xirsys/stdjs.git haxelib
I tested its availability with:
haxelib list
I then added it to the library section in FlashDevelop - see pic
**I have included the the library in the classpaths (I really don't know if I should, but without it, compile won't even take place) - See pic **
I've then taken the WebGL specific code from the following github repo:
https://github.com/mikecann/WebGLTerrainicles/blob/master/src/Main.hx
When I try to compile the project, it opens up my browser as expected, however, in the console there is an issue as there are missing libraries:
Obviously I'm missing something here (perhaps in the import process?) - I've looked but can't find much information on getting WebGL working for Haxe with the stdjs externs etc using FlashDevelop and any help would be great.
Looks like there is a problem with xirsys_stdjs lib.
The reference project you link to is using only one file called Html5Dom.hx (originally from Jeash project) to define the HTML5/webgl API. You don't need xirsys_stdjs if you reuse this file.
While you're at it, mikecann's project seems to include a lot of basic classes to get started writing webgl in haxe.

Categories

Resources