Bemify 项目使用教程

Bemify 项目使用教程

bemifySass Mixins to write BEM-style SCSS source项目地址:https://gitcode.com/gh_mirrors/be/bemify

1. 项目的目录结构及介绍

Bemify 是一个用于编写 BEM 风格 SCSS 源码的 Sass 混合器集合。以下是项目的目录结构及其介绍：

bemify/
├── LICENSE
├── README.md
├── bower.json
├── eyeglass-exports.js
├── gitignore
├── package.json
├── sache.json
├── sass/
│   └── _bemify.scss
└── bemify.gemspec

• LICENSE: 项目许可证文件。
• README.md: 项目说明文档。
• bower.json: Bower 包管理配置文件。
• eyeglass-exports.js: Eyeglass 配置文件。
• gitignore: Git 忽略文件配置。
• package.json: npm 包管理配置文件。
• sache.json: Sache 配置文件。
• sass/: Sass 文件目录。
  • _bemify.scss: 主要的 Sass 混合器文件。
• bemify.gemspec: RubyGem 配置文件。

2. 项目的启动文件介绍

Bemify 项目的启动文件是 sass/_bemify.scss。这个文件包含了所有用于编写 BEM 风格 SCSS 的混合器。要使用 Bemify，你需要在你的 SCSS 文件中导入这个文件：

@import 'bemify';

导入后，你就可以使用 Bemify 提供的混合器来编写 BEM 风格的 SCSS 代码。

3. 项目的配置文件介绍

Bemify 项目有几个重要的配置文件：

• bower.json: 用于 Bower 包管理的配置文件，定义了包的名称、版本、依赖等信息。
• package.json: 用于 npm 包管理的配置文件，定义了包的名称、版本、依赖等信息。
• bemify.gemspec: 用于 RubyGem 包管理的配置文件，定义了 Gem 的名称、版本、依赖等信息。
• sass/_bemify.scss: 主要的 Sass 混合器文件，其中包含了一些可配置的变量，如 $element-separator、$modifier-separator 和 $state-prefix，你可以根据需要修改这些变量来自定义 BEM 风格的选择器。

例如，你可以在你的 SCSS 文件中覆盖这些变量：

$element-separator: '__';
$modifier-separator: '--';
$state-prefix: 'is';

@import 'bemify';

这样，你就可以根据项目需求自定义 BEM 风格的选择器格式。

bemifySass Mixins to write BEM-style SCSS source项目地址:https://gitcode.com/gh_mirrors/be/bemify