Flusso di lavoro di produzione con SystemJS e dipendenze esterne ospitate tramite CDN

Question

Sto cercando di capire un buon flusso di lavoro di produzione che funzioni bene con il flusso di lavoro di sviluppo. È necessario escludere 1 MB di librerie esterne dalla build, quindi utilizzare una CDN per ospitarle separatamente. Quindi:

Questo è bello, qualsiasi cosa in main.js viene ignorata poiché era già inclusa in build.js. Anche se penso che questo significhi quando è il momento di tornare allo sviluppo di hot building, dobbiamo eliminare build.js prima?

Così ora voglio separare le dipendenze esterne per la produzione:

builder.buildStatic('app/main.js', 'build.js', { 
    externals: ['jquery'], 
    globalName: 'App', 
    globalDeps: { 
    'jquery': 'jQuery' 
    } 
}); 

Quando facciamo questo, ci viene richiesto di aggiungere la riga:

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.2.2 jquery.min.js"></script> 
<script src="jspm_packages/system.js"></script> 
<script src="config.js"></script> 
<script src="build.js"></script> 
<script> 
    System.import('app/main.js'); 
</script> 

Il che significa che quando si passa indietro alla build di sviluppo, jQuery sarà raddoppiato in main.js? Poi c'è il frammento SystemJS:

System.config({ 
    bundles: { 
     'build/core': ['jquery'] 
    } 
}); 
System.import('app/main.js'); 

Non sei sicuro di come utilizzare questo come ora non saremmo utilizzando un CDN per ospitare il jQuery. Quindi per me sembra una presa 22. Il JSPM è ottimo perché ti dà la gestione dei pacchetti, ma per usare i pacchetti in produzione li vuoi esternamente. Quindi, se dovessimo includere i tag dello script in ogni caso nella pagina, non è forse questo a sconfiggere lo scopo di JSPM?

Qualche idea su come realizzare un flusso di lavoro di sviluppo/produzione piacevole e facile, in cui quando si desidera passare da uno all'altro non è necessario modificare il codice? Vogliamo qualcosa di simile: la produzione

$ NPM corrono sviluppo

Questo

$ NPM correre, senza alcuna necessità di modificare qualsiasi tipo di HTML nella pagina prima di eseguire i due. Ho cercato ore sui diversi flussi di lavoro SystemJS e JSPM e non riesco a trovarne uno che risolva tutti i problemi.

SystemJS viene utilizzato in produzione in qualsiasi luogo o è ancora considerato una tecnologia sperimentale? Ho visto che c'è uno standard nuovo e in arrivo con HTTP/2 in cui caricherà dinamicamente i moduli al volo, quindi significa passare a SystemJS o essere lasciato in polvere?

Answer 1

Non ho usato systemJS per raggruppare le cose prima ma mappare il CDN per il lavoro con jquery? vale a dire È possibile utilizzare un CDN per angolare e rxjs via:

map: { 
    ... 
    '@angular': 'https://npmcdn.com/@angular', 
    'rxjs': 'https://npmcdn.com/rxjs@5.0.0-beta.6', 
    'jquery': 'http://jquery.cdn' 
} 

fa qualcosa del genere risolve il problema per te? Capisco significa che non sarai in grado di utilizzare jquery come globale e dovrai importarlo, ma passare a un flusso di lavoro come questo potrebbe essere utile?