【问题标题】:How to make Sass watch css if files are being edited on the server?如果正在服务器上编辑文件,如何让 Sass 监视 css?
【发布时间】:2015-03-26 14:02:12
【问题描述】:

我了解如何让 sass 文件通过终端监视 css 文件。 但只有当文件在我的计算机上时才会出现这种情况。

如果我直接在服务器上编辑文件,如何设置相同的进程。 创建网站时(我在 Sublime Text3 上从服务器加载文件)并且我的计算机上没有任何文件,我也不希望它们在我的计算机上。如果文件直接加载到我的文本编辑器上并将所有内容直接保存在我的服务器上(因此无需在我的计算机上保存任何内容),我不知道如何让 sass 监视我的 css 文件。

如果是通过终端或其他方式完成,是如何完成的?

【问题讨论】:

  • 你目前在你的开发机器上使用什么来“观察”sass?我可以根据您当前的实现为您的服务器设置提供建议。此外,重要的是要知道您是否在运行 sass 编译器后提供这些文件,因此我可以提供有关缓存清除的建议。最后,您使用的是什么框架(如果有的话)?
  • 我将不胜感激!我正在使用: - Sublime text 3 作为文本编辑器。 - 可爱的 FTP(付费版) - Mac OSX 我最近刚刚学会了如何设置 Sass 并使用它(仍然是初学者级别)。但这只是在文件在我的电脑上时进行设置。但是如果文件在服务器上并且我直接在服务器上编辑它们,我不知道该怎么做。谢谢
  • 好的,所以最初我认为您的目标是构建一个 Web 应用程序来处理来自用户的资产的实时编译。但听起来你才刚刚开始。首先,我建议不要直接在服务器上编辑文件,因为那样你在发布之前就没有测试空间了。这是“部署”代码的概念。因此,在您的开发环境中开发您的 sass/js/backend 代码,然后在测试/确保一切正常并且看起来符合您的预期后将其部署到您的服务器。
  • 很公平,但我正在处理关于我的网站部署的子域。这纯粹是为了测试目的,并意味着作为一个学习轨迹。因此,如果您能帮我设置它,我将非常感激,因为我不知道该怎么做。
  • 别担心,我完全理解部署您的代码会造成怎样的混乱。我只需要有关您当前设置和知识的更多信息,以便更好地帮助您。你的服务器操作系统是什么?你自己设置服务器吗?你有终端访问它吗?您是使用 Apache 还是 Nginx 来提供文件?

标签: bash shell sass watch


【解决方案1】:

经过几个小时和现在的眼睛,我设法找到了一个有解决方案的博客。 这是博客:

(1) 。 http://blog.omgmog.net/post/getting-started-with-using-sass-in-your-existing-website/

长话短说:我让它工作并做我想做的事!微笑

我完成了博客中提到的步骤。为了使它工作,我必须下载一个 php 文件,可以在这里找到: (2) 。 http://leafo.net/scssphp/

此外,我还必须创建另一个 php 文件并在其中添加一些代码(也可以在第二个链接中找到)。

之后我必须链接到我创建的 php 文件并指定要加载的 .scss 文件(通常您不会将其链接到任何 php 文件,而是将其指定到 .css 文件)。

链接一中的博客以清晰的步骤解释了所有内容。希望这对其他人有所帮助,因为我之前在 StackOverflow 上没有看到任何地方回答过这个问题!

【讨论】:

  • 不错的发现。如果您在服务器上保存 scss 后没有直观地看到更新,您可能会遇到缓存问题。为了避免这种情况,您需要实现一个缓存破坏器。有很多方法可以做到,但由于你还在学习,我会选择最简单的修改方法,通过query string。对于更高级的选项/自动化,您可能需要查看 gulp 以进行 sass/js/asset 编译和 revisioning。效果很好。
  • 谢谢!我不知道有像缓存破坏者这样的东西。谢谢! Gulp 非常有趣,但正如您所指出的,我刚刚开始使用 Sass,并且正在尝试将它与 Bootstrap 以及很快的 Wordpress 结合起来。但 Gulp 绝对在我的“阅读更多”列表中名列前茅。我想知道如果没有 PHP 文件就没有其他方法可以完成这项工作吗?
  • 是的,您绝对可以在没有 php 文件的情况下完成您目前正在做的事情。通过避免资产的运行时编译,您将执行所谓的“资产预编译”,这是 gulp 擅长的地方。您的工作流程将更改为:1)像您目前所做的那样在本地创建 scss/js。 2) 设置 gulp 以“监视”您的 scss 文件所在的本地目录。现在“保存”任何文件,您会告诉 gulp:在本地编译您的资产,然后将更新后的文件保存到您的“deploy(Cute FTP) 目录”。 3.) 然后可爱的 FTP 会处理您的上传(无论您认为合适)。
  • 所以你是说使用 Gulp,我可以创建一个自动化流程并用一段代码告诉它:首先执行第一个步骤,然后执行第二步,然后执行三个等等。它会是一样的好像我是在没有 php 文件的情况下在本地完成并且完全自动化一样?
  • 是的 :) 就是这样!但老实说,您真的不想在“保存”文件时自动部署......这是一些大胆的实时编码,我绝对不推荐它。
猜你喜欢
  • 1970-01-01
  • 2022-08-14
  • 1970-01-01
  • 1970-01-01
  • 2014-04-05
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
相关资源
最近更新 更多