在前端开发工作中，我们经常需要针对 less 文件进行处理，这里介绍一款方便的 npm 包 less-with-include。
less-with-include 是什么
less-with-include 是 less 文件的编译工具，该工具主要解决 less import 时路径问题。
当我们在使用 less 时，经常会用到 @import 命令来引入其他的 less 文件。但是，当被引入的 less 文件中也有引入其他 less 文件时，路径引用就会出现问题。为了解决这个问题，就有了 less-with-include 这个 npm 包。
less-with-include 可以自动解析 less 文件中的 import 语句，并将引用路径转换为格式正确的绝对路径，避免了路径引用的错误。
less-with-include 的使用
安装 less-with-include
npm install less-with-include
使用 less-with-include 编译 less 文件
-- -------------------- ---- -------
----- --------------- - -----------------------------
----- ---- - ----------------
----- -- - --------------
----- -------- - ----------------------- -------------------
----- ----------- - -------------------------------------
---------------------------- ----------------------- -- -
------------------------
-- ------- -- -
-------------------
---以上是一个简单的 less 文件编译示例，实际项目中，我们常常会在 webpack 中使用 less-loader。
webpack.config.js 配置如下：
-- -------------------- ---- -------
-------------- - -
------- -
------ -
-
----- ----------
---- -
-
------- --------------
--
-
------- ------------
--
-
------- --------------
-------- -
----------- -
---------------- ------ -- ---- ------
--
------------------ ----
-
-
-
-
-
-
-结语
less-with-include 提供了解决 less 文件 import 引用路径问题的方案，能够在项目开发中提高代码编写效率，推荐大家加入到日常的项目工作中。
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/60055ea481e8991b448dc05d