简介
enb-sass 是一个适用于 ENB 构建工具的 npm 包，用于编译 Sass 样式文件。ENB 是 Yandex 开发的一款面向大型前端项目的构建工具，它能够在开发过程中帮助我们自动化构建和管理多个模块的依赖关系，从而提高开发效率。
在使用 enb-sass 之前，我们需要先安装 ENB 和 Sass。
安装
我们可以通过 npm 安装 enb-sass：
npm install enb-sass --save-dev
配置
我们需要在 ENB 的配置文件中配置 enb-sass，切换到项目根目录，创建名为 enb-make.js 的配置文件。
-- -------------------- ---- -------
--- ------- - --------------------
-------------- - ---------------- -
-- -- --------
---------------------- -------- ------------ -
---------------------
--------- - ------- ------- --
---
---------------------------------
---
--其中，src/app 为我们项目的入口模块，enbSass 为 enb-sass 包导出的模块，target 属性为输出文件的文件名，addTechs 和 addTargets 分别表示添加使用的技术和目标。
示例
我们可以通过一个示例来了解如何使用 enb-sass。
- 创建一个名为
index.bemjson.js的文件：
({
block: 'button',
mods: { theme: 'islands', size: 'l' },
text: 'Hello World!'
})- 创建一个名为
index.scss的文件：
-- -------------------- ---- -------
------- -
----------------- --------
------- -----
------ ------
-------- -----
----------- -------
---------------- -----
-------- -------------
---------- -----
------- -
----------------- -----
-
-- 创建一个名为
index.js的文件：
require('./index.scss');- 运行 ENB 命令：
./node_modules/enb/bin/enb make --no-cache
- 在浏览器中打开
index.html文件，即可看到 Hello World! 按钮的样式已经被修改为蓝色。
总结
enb-sass 是一个非常实用的 npm 包，它能够帮助我们轻松地编译 Sass 样式文件，提高我们的开发效率。通过本文的介绍，我们已经学会了如何使用 enb-sass，并已成功创建了一个简单的示例。如果您对 ENB 和 Sass 感兴趣，也可以进行更深入的学习。
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/60066e1fa563576b7b1ecd8b