1. Sens korzystania z CDN polega na tym, że jest ona szybsza, Po pierwsze, ponieważ jest to sieć rozproszona, ale po drugie, ponieważ pliki statyczne są buforowane przez przeglądarki i istnieje duże prawdopodobieństwo, że na przykład Biblioteka CDN jquery, z której korzysta Twoja witryna, została już pobrana przez przeglądarkę użytkownika, a zatem plik został buforowany, a zatem nie ma niepotrzebnego pobierania. Mimo to, nadal jest to dobry pomysł , Aby należy podać rezerwę .

   Teraz, punkt pakietu npm Bootstrapa

   Jest to, że dostarcza plik javascript jako moduł . Jak już wspomniano powyżej, umożliwia to require to za pomocą browserify, co jest najbardziej prawdopodobnym przypadkiem użycia i, jak rozumiem, głównym powodem publikacji bootstrap na npm.

2. Jak go używać

   Wyobraź sobie następującą strukturę projektu:

   project
   |-- node_modules
   |-- public
   |   |-- css
   |   |-- img
   |   |-- js
   |   |-- index.html
   |-- package.json
   
   

W twoim index.html możesz odwoływać się zarówno do css, jak i js plików w następujący sposób:

<link rel="stylesheet" href="../node_modules/bootstrap/dist/css/bootstrap.min.css">
<script src="../node_modules/bootstrap/dist/js/bootstrap.min.js"></script>

Który jest najprostszym sposobem i poprawnym dla .css plików. Ale o wiele lepiej jest umieścić plik bootstrap.js taki jak ten gdzieś w plikach public/js/*.js:

var bootstrap = require('bootstrap');

I umieszczasz ten kod tylko w tych javascript plikach, w których faktycznie potrzebujesz bootstrap.js. Browserify zajmie się dołączeniem tego pliku za Ciebie.

Wadą jest to, że teraz masz pliki front-endu jako zależności node_modules, a folder node_modules zwykle nie jest sprawdzany za pomocą git. Myślę, że jest to najbardziej kontrowersyjna część, z wieloma opiniami i rozwiązaniami.

Aktualizacja Marzec 2017

Minęły prawie dwa lata od napisania tej odpowiedzi i aktualizacja jest na miejscu.

Teraz ogólnie przyjętym sposobem jest użycie bundler Jak webpack (lub innego wybranego bundlera), aby połączyć wszystkie swoje zasoby w fazie budowania.

Po pierwsze, pozwala na używanie składni commonjs tak jak browserify, więc aby włączyć bootstrap kodu js w projekcie, robisz to samo:

const bootstrap = require('bootstrap');

Jeśli chodzi o pliki css, webpack posiada tzw. " loadery ". Pozwalają na zapisanie tego w kodzie js:

require('bootstrap/dist/css/bootstrap.css');

I pliki css będą "magicznie" zawarte w Twojej kompilacji. Po uruchomieniu aplikacji będą one dynamicznie dodawane jako znaczniki <style />, ale możesz skonfigurować webpack tak, aby eksportował je jako oddzielny plik css. Więcej na ten temat można przeczytać w dokumentacji webpacka.

Podsumowując.

W tym celu należy kliknąć przycisk "Zapisz".]}
1. nie powinieneś zatwierdzać ani node_modules, ani dynamicznie budowanych plików do Gita. Możesz dodać skrypt build do npm, który powinien być używany do wdrażania plików na serwerze. W każdym razie można to zrobić na różne sposoby, w zależności od preferowanego procesu budowania.