Giter VIP home page Giter VIP logo

core-app-monorepo's Introduction

CoreApp

This project was generated with Angular CLI version 7.3.1.

Main project structure

  • You have one CoreApp

    • made with ng new CoreApp.
  • You have 2 sub-applications (app1 and app2)

    • ng generate application app1
    • ng g application app2)
  • You have library admin-lib

    • ng g lib admin-lib
  • App1 and App2 can be started and developed independently:

    • npm run start:app1 and npm run start:app2
    • npm run test:app1 and npm run test:app2
    • npm run lint:app1 and npm run lint:app2
    • npm run build:app1 and npm run build:app2
  • Each of App1 and App2 has its own ngRx instance, so you can use Redux-Dev-Tools to observe their Stores.

  • admin-lib is a components lib and can be build and used in any of apps (CoreApp, app1 and app2)

  • CoreApp includes App1 and App2 as lazy-loaded routing modules.

    • ngRx feature modules of both app1 and app2 are attached to CoreApp Store.
    • You can send actions from CoreApp to change App1 and App2 feature branches values.

Implementation details

Each of sub-application (app1 and app2) has:

  • app.module.ts - for independent development
  • app.module-export.ts - to be used when included in Core-App

Mostly they should be identical except app.module-export.ts has such specifics:

  • RouterModule.forRoot is changed to RouterModule.forChild
  • StoreModule.forRoot is removed (but feature modules should stay)
  • StoreDevtoolsModule is removed as well (CoreApp has its own StoreDevtools module)

Actually these two files has be easily merged to one (todo for the future), used modules can be attached and detached just by using some CoreApp environment.ts variable

Installation notes:

  • Clone github repo
  • npm install OR npm i
  • npm run build:admin-lib
  • npm run start:Core (or any other command from package.json 'scripts' section)

Animated demo

  1. Project structure

  2. Starting App1, App2 and CoreApp

core-app-monorepo's People

Stargazers

 avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar

Watchers

 avatar  avatar  avatar

core-app-monorepo's Issues

build single app AOT fails

Hi,
First of all this is a great sample.

Currently single application could be build only in JIT.
The following command fails due to double definitions on app.module and app.module-export
"ng build app1 - prod - build-optimizer - vendor-chunk - named-chunks"

My goal is to create individual (docker) applications that would dynamically be imported on core-app.
Imagine a Portal that would have all the common files (angular, polyfills ect... ) and would be able to load any application dynamically.
(still trying to find the proper way)
I read your comment about
https://github.com/lmeijdam/angular-umd-dynamic-example
but I haven't make it to work

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. 📊📈🎉

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google ❤️ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.