包括boostrap從節點模塊索引

Question

我想從基礎學習一些前端。我所做的是我建立了我的節點，安裝了npm。

然後我做了npm init來創建我的package.json文件，我可以添加所有的依賴關係。

我安裝的第一件事是像這樣的推進：npm install bootstrap@3 --save。這創建了一個node_modules目錄，並在其中添加了boostrap目錄。

但我不明白的是我現在可以如何將我的boostrap包含到index.html中。實際上包括boostrap的最佳方法是什麼，有沒有一種自動化的方式來做到這一點..？

Answer 1

如果你npm安裝bootstrap（如果你不使用特定的grunt或gulp文件移動到dist文件夾），你的引導程序將位於「./node_modules/bootstrap/bootstrap.min.css」中，如果我m沒有錯。所以，你必須把它從那裏鏈接：

<link rel="stylesheet" href="./node_modules/bootstrap/bootstrap.min.css"> 

或者你可以把一個靜態文件夾中的中間件，然後在HTML文件時，它鏈接是這樣的：

app.use('/js', express.static(__dirname + '/node_modules/bootstrap/dist/js')); // redirect bootstrap JS 
app.use('/js', express.static(__dirname + '/node_modules/jquery/dist')); // redirect JS jQuery 
app.use('/css', express.static(__dirname + '/node_modules/bootstrap/dist/css')); // redirect CSS bootstrap 

然後添加喜歡的鏈接：

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