sass官网实现

sass官网实现

项目创建

npm init

compass create --bare

or

compass create --bare --sass-dir "sass" --css-dir "css" --images-dir "img" --javascripts-dir "js"

自动化构建

在根目录下创建gulpfile.js

npm gulp gulp-compass browser-sync del run-sequence --save-dev

假如下载失败可修改:

npm config git registry

npm config set registry http://

安装compass-normalize、breakpoint、susy

gem install compass-normalize breakpoint susy

在config.rb里分别引入

require "compass-normalize"
# 响应式
require "breakpoint"
# 布局
require "susy"

main.scss

/*! Vendor */
@import 
  "compass"
, "susy"
, "breakpoint"
, "normalize-version"  
, "normalize/base"
, "normalize/links"
, "normalize/html5"
;

/*! Helpers */
@import 
  "helpers/variables"
;

/*! Base*/
@import 
  "base/font"
;

/*! Layout */
@import 
  "layout/main"
;

/*! Components */ 
@import 
  "components/alerts"
, "components/pop-stripe"
, "components/banner"
, "components/page-header"
, "components/section-bottom"
, "components/contentinfo"
;

/*! Pages*/
@import 
  "pages/page-base"
, "pages/index"
, "pages/install"
, "pages/guide"
, "pages/community"
, "pages/libsass"
;
支付宝扫码打赏 微信打赏

如果文章对你有帮助,欢迎点击上方按钮打赏作者