Proces produkcyjny z SystemJS i zależności zewnętrzne hostowane za pośrednictwem CDN

Question

Próbuję znaleźć dobry przepływ pracy, który jest przyjemny w obiegu pracy nad rozwojem. Konieczne jest wyłączenie 1 MB zewnętrznych bibliotek z kompilacji, a następnie użycie CDN do hostowania ich osobno. Mamy więc to:

<script src="jspm_packages/system.js"></script> 
<script src="config.js"></script> 
<script src="build.js"></script> 
<script> 
    System.import('app/main.js'); 
</script> 

To jest miłe, wszystko w pliku main.js jest ignorowane, ponieważ było już zawarte w pliku build.js. Chociaż domyślam się, że oznacza to, że nadszedł czas, aby powrócić do rozwoju gorącego budynku, musimy usunąć wcześniej build.js?

Więc teraz chcę oddzielić zależności zewnętrzne produkcji:

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

Kiedy to zrobimy, jesteśmy zobowiązani, aby dodać linię:

<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> 

co oznacza, że ​​kiedy przełączyć z powrotem do wersji rozwojowej jQuery będzie podwójnie dołączany do main.js? Następnie jest urywek z SystemJS:

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

Nie wiem, jak korzystać z tego jak teraz nie będzie za pomocą CDN gospodarzem jQuery. Więc dla mnie to wygląda na połowę 22. JSPM jest świetny, ponieważ zapewnia zarządzanie pakietami, ale korzystanie z pakietów w produkcji, które chcesz mieć na zewnątrz. Więc jeśli musimy mimo wszystko dołączyć tagi skryptów na stronie, to czyż nie jest to w pierwszej kolejności sprzeczne z celem JSPM?

Wszelkie pomysły na to, jak stworzyć ładną i łatwą ścieżkę rozwoju/produkcji, gdzie, kiedy chcemy przełączać się między tymi dwoma, nie musimy zmieniać kodu? Chcemy coś takiego:

$ NPM serii produkcyjnej

$ NPM uruchomić rozwój

to bez konieczności zmiany jakichkolwiek HTML na stronie przed uruchomieniem dwóch. Szukałem wielu godzin nad różnymi przepływami pracy SystemJS i JSPM i nie mogę znaleźć takiego, który rozwiązałby wszystkie problemy.

Czy SystemJS jest używany w produkcji w dowolnym miejscu, czy jest to nadal uważane za eksperymentalną technologię? Widziałem, że istnieje nowy i nadchodzący standard z HTTP/2, w którym dynamicznie ładuje on moduły w locie, więc czy oznacza to, że przełącza się na SystemJS lub zostaje w pyle?

Answer 1

Nie użyłem systemJS do pakowania rzeczy wcześniej, ale mapowania CDN dla pracy jquery? To znaczy, że możesz użyć CDN dla kątowych i rxjs przez:

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

Czy coś takiego rozwiązuje problem? Rozumiem, że oznacza to, że nie będziesz w stanie używać jquery jako globalnego i będziesz musiał go zaimportować, ale przejście do takiego przepływu pracy może być pomocne?