配置Webpack将LESS文件的目录构建成相应的CSS文件

2024-02-06

我希望使用 Webpack 编译我们所有的 less 文件/less to /public/css并将它们作为常规 css 包含在我们的服务器端模板中(not将文本粘贴到使用 ExtractText 插件或重载 require 中)。

也就是说,我正在尝试使用 Webpack + LESS 加载器或插件来 glob 来编译所有 .less 文件:

/less/foo.less /更少/bar.less /less/unknown-new-less-file.less ...

并将它们输出到

/public/css/foo.less /public/css/bar.less /less/unknown-new-less-file.less

然后我想通过使用拉入 css 文件将它们包含在我们的应用程序中<link rel="stylesheet" href="foo.css">

我尝试使用 Bash 脚本lessc而不是 Webpack,它工作得很好,但是当源文件发生变化时,我们无法自动重新编译 LESS。


问题是我使用 Webpack 作为任务运行程序,但事实并非如此。

我一直拒绝添加 Gulp 或 Make。 Gulp 是因为它会变成一个巨大的、无法维护的混乱,而 Make 尽管它很棒,因为它对团队来说有点难以学习。

我最终在 npm 脚本中使用了类似 fswatch 的东西来重新运行 lessc。

Less 文档建议使用 grunt、Gulp 或开发模式浏览器内解析:http://lesscss.org/usage/#using-less-in-the-browser-watch-mode http://lesscss.org/usage/#using-less-in-the-browser-watch-mode.

本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)

配置Webpack将LESS文件的目录构建成相应的CSS文件 的相关文章

随机推荐

  • 如何在单独的文件中创建命名查询

    我需要将所有命名查询保存在一个单独的文件中 例如 javax persistence NamedQueries NamedQuery name Employee findAll query SELECT e FROM Employee e
  • web.config 中与 targetFramework 相关的配置错误

    我在 Visual Studio 2015 中制作了一个 MVC 网站 它可以在我的本地主机上运行 但是当我发布我的网站并放入我的主机时 它不起作用 它给了我这个错误通知 应用程序中的服务器错误 配置错误 解析器错误消息 targetFra
  • FFmpeg 使用 URL 进行文件转换

    我需要将 MP4 转换为 AVI MP4 视频上传到 Windows Azure Blob 存储中 并且存储可公开访问 当我们编写 ffmpeg 命令行时我的问题 我可以提供 Blob 存储中视频的 URL吗 ffmpeg ihttps a
  • 用于重试同一请求的 HTTP 状态码

    是否有 HTTP 状态代码来指示客户端再次执行相同的请求 我面临着服务器在处理请求时必须 等待 锁消失的情况 但当锁消失时 请求可能会接近其超时限制 因此 一旦锁定清除 我想指示客户端再次执行相同的请求 我想出的最好的办法是使用 HTTP
  • Angular 将特定数据检索到 $scope 变量中不起作用

    我这里初始化 scope statuses 然后 如果我只是将 http get 中的数据设置为 scope 变量 那么 有效 但我需要对其进行更多过滤 scope statuses result data Devices console
  • 如何在c99中使用ftruncate而不发出警告

    我想在我的代码中使用 ftruncate 函数 我必须使用选项 std c99 进行编译 我收到警告 In function test warning implicit declaration of function ftruncate W
  • 将 gtfs 实时数据流式传输为人类可读的格式

    我正在尝试使用 Java 下载可读的 gtfs 实时数据 协议缓冲区格式 以便我可以在文本文件中查看它 我尝试了几种方法 方法 1 URL url new URL uri byte buffer new byte 4096 InputStr
  • JavaScript 评估问题

    var x 5 function f y return x y 2 function g h var x 7 return h x var x 10 z g f 我正在解决课堂上教科书上的一些问题 为下一次考试做准备 但无法弄清楚上述内容如
  • Pandas 对条形图进行分组和重采样:

    我有一个数据框 以高时间频率 为了计算平均浓度 我必须对每日和每月数据应用质量控制过滤器 我的方法是首先应用过滤器并每年重新采样 然后按位置和年份进行分组 另外 在所有位置 在标题为 位置 的列中 中 我只需选择几行 因此 我对原始数据框进
  • SMIL(同步多媒体集成语言)的未来?

    SMIL 同步多媒体集成语言 最后一次更新是在2008年 有谁知道在同步多媒体文件时是否有更好的协议可以遵循 SMIL 没有天然的竞争对手 因此任何其他解决方案都将依赖于脚本 它支持 ePub 阅读器 例如Azardi http azard
  • 为什么删除不是 Subversion 的基本功能?

    几年来 我一直在等待 Subversion 提供 永久删除 消除 功能 我犹豫是否要过渡到 Subversion 来自 Visual SourceSafe p 因为我认为这是一个基本功能 否则我会期望存储库会不可阻挡地增长 然而 由于某种原
  • 阻塞读和非阻塞读有什么区别?

    在上述问题中添加等待 不等待指示器的概念作为 TCP IP 或 UDP 环境中 ReadMessage 函数的参数 第三方功能描述指出 此函数用于从先前的 registerforinput 调用定义的队列中读取消息 输入等待 不等待指示器将
  • Pandas - 计算相对于最早值的每日差异

    这可能很容易 但由于某种原因 我发现它很难完成 任何提示将非常感谢 我有一些每天 5 分钟间隔的时间序列数据 唉 Date Values 2012 12 05 09 30 00 5 2012 12 05 09 35 00 7 2012 12
  • 在同一行文本上对齐不同的字体大小以便看起来不错?

    基本上 我希望在同一行上有一个 h1 和一个 p 元素 但是对齐方式偏离了很多 意味着 H1 高于 P 并且看起来很糟糕 并且我之前从未使用 css 做过这样的事情 我已经整理了一个 jsfiddle 来配合它 这里是代码 h1 style
  • ASP.NET MVC3 Razor - 如何有条件地退出或结束或返回或中断部分视图?

    使用 Razor 如何有条件地退出或结束或返回或中断部分视图 if Model null return 不 你不return在视图中 您只需不在主视图中包含此类部分即可 if Model null Html Partial somePart
  • Python CFFI 的内存管理和析构函数/free() 约定?

    如果我包装一个 C 类 from ffi import ffi lib class MyClass object def init self self c class lib MyClass create 确保的最佳实践是什么lib MyC
  • 我可以获得 HTMLElement DOM 对象的完整 HTML 表示形式吗?

    我正在使用 jquery 来解析一些 HTML 例如 html contents each function var element this tagName 我可以使用 DOM 或更友好的 jQuery 函数访问 tagName 子项 父
  • 迭代数组的每个元素(第一个元素除外)

    编写此代码的惯用 Ruby 方式是什么 给定一个数组 我想迭代该数组的每个元素 但跳过第一个元素 我想在不分配新数组的情况下执行此操作 这是我想出的两种方法 但都不是特别优雅 这可行 但似乎太冗长了 arr each with index
  • SQL Server 连接后行数低估

    当实际行数为 2000 时 查询优化器估计联接结果只有一行 这导致数据集上的后续联接的估计结果只有一行 而其中一些联接的结果却高达 2000 30 000 计数为 1 时 QO 正在为许多连接选择循环连接 索引查找策略 这太慢了 我通过限制
  • 配置Webpack将LESS文件的目录构建成相应的CSS文件

    我希望使用 Webpack 编译我们所有的 less 文件 less to public css并将它们作为常规 css 包含在我们的服务器端模板中 not将文本粘贴到使用 ExtractText 插件或重载 require 中 也就是说