Develop Reference

Choosing framework with needed level of flexibility

I am trying to select framework, which replace our old framework
( middle-sized project )
Our previous project was written with angularJS, so our team write core of this application and distribute it to our clients, some of them has their own frontend teams and they can easily customize core components/controllers via $templateCache mechanism
like so:
var myApp = angular.module('myApp', []);
myApp.run(function($templateCache) {
$templateCache.put('templateId.html', 'This is the content of the template');
});
so these "outsource teams" can fully redefine components ( i mean not only css but layout too )
and include their "custom" components via custom.js files
I am looking for information how we can do same thing.
It looks like using React render props is not suitable for us, because we must have ability to replace any component in runtume just add *.js file
but i'm pretty new in Angular2+ and Vue did these frameworks has such mechanisms?

Vue.js has a pretty well-structured way for components. You can have the html, css and javascript all managed in one place. For basic examples, see the official documentation at vuejs.org
Once having written the components, it's kind of intuitive to use and reuse them in our main html file.
Feel free to try it out!
Also, vue is a modular framework, meaning you don't have to use it's own routing system etc. for getting started with it's template engine. It could even run along side other frameworks.

Independent VueJS components with webpack?

I made some SPA using vuejs-templates/webpack and that's ok. But now I am developing a website, almost everything is static, so there's no need to be a SPA. I already made the pure html/css layout.
Now I will make some pages with forms and dynamic content, I would like to use vue components inside these pages.
Tell me which of this ideas is the best or give me a better option:
Multiple entries in webpack: I don't know very well how to do it, but I guess I can create a webpack project by scratch and render multiple entries that I include in the pages I want.
Use browserify: I didn't want to do this, but sounds like a good option... I could use vueify to render *.vue components
Use Nuxt: I never tried, but seems a good option too, I could make a "SPA" with SSR.
Tell me if you have another idea.
Thank you

Don't rule out just referencing Vue as a script file. No bundle, no compilation step. You lose single file components, but you can get something very like them by using js template literals. If your needs are simple and you don't want to impact on the rest of the site, this could be a fine solution.

How to dynamically load & render react components?

I need to be able to dynamically include react components into my project, because I want to setup a plugin system and not every user has the same plugins/components enabled. Also they are/might get too big to submit all of them to every user. I tried to find out how to do that, but it seems that React might not support that use-case.
TLDR: How do I load React components from server when needed? Do I have to switch to Angular because react has no templateUrl equivalent?

React components are defined in JavaScript files, so you can load components in just as you’d load in any other JavaScript file. If you’re not using any sort of module mechanism like RequireJS, that might be as simple as injecting a script tag into the document. If you’re using something like RequireJS, you would just tell the loader that you want an extra module loaded.

Creating a custom Javascript Library at build-time

Background
I have a javascript library that runs on a customers website. This library is a mixture of standard components (error handling, message passing, etc), and per-customer based custom components (specific dom handling routines).
Problem
I am breaking DRY. For each customer, I have the same code duplicated. Since I violate DRY, I am stuck with all the pitfalls: e.g. if I need to make a change to a common component, I have to replicate that change across multiple files.
Desired Solution
I'd like to separate out all the functionality into components, and selectively choose (via build script) the components that get added into the library.
This would be somewhat similar to how Bootstrap allows you to mix and match javascript plugin functionality
Example: CustomerA's library, needs the Base Component, the Comment Component, and a custom handler to parse Google Analytics.
CustomerB's library, needs the Base Component, and a custom handler for their shopping cart experience.
I think I can do this with RequireJS, but is there a more industry standard way to build customized javascript libraries?

I came across Browserify, which allows you to use Nodejs module system to create reusable components, in addition to using NPM node modules.

Modularization & reuse of code written using Ext JS

I need clarity into being able to modularize my JavaScript code that leverages Ext JS. My objective is to create custom classes that extend Ext JS widgets, distribute code among several JavaScript files (.js files).
I have looked into documentation on Ext.Loader but I didn't quite follow the approach to ensure class dependency resolution. My code in a single JavaScript file is working as desired, given that the code sequentialization is as per dependency. But once I break the code in several JavaScript files and want to use in multiple pages, my dependency is in a disarray as all my pages require different classes with varied dependencies.
Considering that I easily achieve code separation and reuse quite easily in regular backend coding, this has baffled me. Please help with inputs. I'm using Ext JS 4.1.1

To enable dependency resolution when creating custom components, use the requires param of Ext.define. It looks like this:
Ext.define("My.custom.Widget", {
alias: "widget.mywidget",
requires: [
"My.custom.TextField",
"My.custom.ComboBox",
"My.custom.Store"
],
constructor: function(config){}
/* ... */
});
For more information, you should read Dynamic Loading and New Class System from the Sencha website. It goes into more detail about how dynamic loading works. It's actually really cool once you get the hang of it.
Almost forgot. You can explicitly call Ext.require to load certain files when you need them. It supports wildcards, aliases and such. There's also Ext.exclude to prevent certain files from loading.

Sencha has some really great guides to help you master the framework.
http://docs.sencha.com/ext-js/4-1/#!/guide
A good one to start with is this one: http://docs.sencha.com/ext-js/4-1/#!/guide/application_architecture Application Architecture. This guide clearly shwos you how to modularize you code and the folder structure the Loader is expecting.
Please have a look at it.