Q

如何創建一個Bootstrap Sass項目

2016-12-15 81 views 0 likes

0

我知道這個問題可能有多個答案，但我會知道如何使用Bootstrap和Sass快速設置項目。如何創建一個Bootstrap Sass項目

我從來沒有使用的節點，NPM，咕嚕或涼亭，我已經安裝了所有已經，但我真的不能找到一個很好的教程：

建立項目結構
自動編譯sass文件保存
（也許）在Chrome中實時重新加載？

2016-12-15 koMah

A

回答

0

不使用你的第一個項目的所有樣板只要你想進入的是「膽」我會建議，一旦你熟悉基礎知識，那麼你可以嘗試模板，看看他們能爲你做些什麼。

您需要從頭開始設置項目的工具很少，包括：Node's npm,Bower,Gulp (for example)。

安裝完成後，您可以深入瞭解創建第一個項目。

1）Initialize your npm project

2）Pull the packages with Bower (Bootstrap scss for starters)

2A）Pull the Specific Bootstrap 3 SCSS port

3）Configure Basic Gulp-scss config for your SCSS needs.

背後鮑爾

的基本想法是，你有插件/第三方JS/CSS的修改的源在bower_components文件夾中，然後使用這些文件編譯生產就緒文件（js/css）。這意味着您的bower_components文件夾是一個「src」文件夾，您必須添加您的「dist」或可分發文件。 Gulp幫助這部分。

對於項目結構，further readings和改進吞嚥任務。

一旦你有基本的工作項目，你可以嘗試擴展你的gulp-config，就像你提到的Browser Sync等。

我編譯了一個「一般任務」的gulp文件，我使用從項目到項目。你可以拿look here並使用它，如果你覺得它適合。

希望它有幫助。

2016-12-16 14:00:42

+0

正是我在找什麼。謝謝！ – koMah

0

您可以嘗試使用Aldryn的樣板：

https://github.com/aldryn/aldryn-boilerplate-bootstrap3

2016-12-15 23:44:31

+0

感謝您的回答，但正如我已經在問題中已經描述的那樣，我對於bower npm等是非常新的。例如文檔說： ** npm install從package.json安裝要求** ** bower安裝通過.bowerrc ** 安裝bower.json的要求，但package.json和bower.json在哪裏？ – koMah

+0

@koMah首先你需要從https://github.com/aldryn/aldryn-boilerplate-bootstrap3下載版本庫。然後您只需按照文檔中列出的步驟操作：http://aldryn-boilerplate-bootstrap3.readthedocs.io/en/latest/general/installation.html 希望它有幫助。 –

相關問題