[笔记] Sass 实战全攻略 – 3 – import 切分档案和维护

章节连结

Sass 随着专案大小的越发增加,是可以透过引入 import 这个动作,来做到结构化的维护管理的。换言之,你可以在一个作为索引的 index 的 scss 档中,引入其他的 scss 档。如此一来,你要进行细微的改动也会更加方便。
sass logo


课程对应章节

Course 17 ~ Course 23 (全部一共有 72 Courses)

请注意:本系列文章为个人对应课程的消化吸收后,所整理出来的内容。换言之,并不一定会包含全部的课程内容,也有可能会添加其他资源来说明。课程连结网址:http://tinyurl.com/ueo7bm2

内容

1. 使用者可以新建一个索引的 scss 档(如 all.scss),在里头 import 其他的 scss 档案,这样可以方便管理。
2. 将常用的变量、手机版本程式码……等依照个人需求,独立抽出成独立档案。这些独立档案要以 “_”作为开头,这样在索引档案就可以用 @import “yourFileName” 来引入。
3. 读取顺序依旧是由上而下。因此,作为变量管理的 scss 档建议于一开始就引入,以免意外的错误发生。

范例

 


Sass 实战全攻略系列文章

  • [笔记] Sass 实战全攻略 – 11 – 自制格线系统
  • [笔记] Sass 实战全攻略 – 10 – 设计模式和规范
  • [笔记] Sass 实战全攻略 – 9 – 错误的 CSS 设计方式
  • [笔记] Sass 实战全攻略 – 8 – 关于命名的那些事儿
  • [笔记] Sass 实战全攻略 – 7 – Sass/CSS 设计模式 (OOCSS)
  • [笔记] Sass 实战全攻略 – 6 – Sass/CSS 设计模式 (Smacss)
  • [笔记] Sass 实战全攻略 – 5 – mixin 解决响应式网页的断点问题
  • [笔记] Sass 实战全攻略 – 4 – mixin 统整你常用的 CSS 方法
  • [笔记] Sass 实战全攻略 – 2 – 变量的运用
  • [笔记] Sass 实战全攻略 – 1 – 简介

  • 按赞加入粉丝团

    延伸阅读