Sublime SFTP-保存sass文件时上传已编译的CSS

Question

我正在Sublime中开发html / css。 我正在用sass编写CSS，并使用Sublime的构建系统在文件保存时生成CSS文件。 它还配置为使用SFTP插件保存时上传。

我的问题是生成的css文件没有上传，因为那不是我直接保存的文件。 我尝试查看SFTP插件是否可以上传在本地修改的所有文件，但似乎不支持该方法。

我能做些什么来实现这一目标？

Answer 1

我将解决方案混为一谈，以防万一有人像我一样迷失于此，并希望尽可能地坚持仅基于ST的工作流。 如果您使用ST的SFTP程序包，则可以选择监视文件以进行外部保存。

不幸的是，使用ST构建系统来编译我的SASS时，SFTP不知何故。 但是，SASS CLI的watch实用程序可以触发上传。 设置后，假设目标文件保持打开状态，SFTP将在每次构建后将其上传。

回顾一下，

1. 打开目标文件，然后打开命令选项板。 输入SFTP: Monitor File (Upload on External Save)

2. 对我而言，启动任何您喜欢的CLI监视/构建实用程序： sass --watch app.scss:app.css

3. 使目标文件保持打开状态，否则SFTP监视器似乎停止。

请享用！

注意：您也可以通过在侧边栏上右键单击要监视的文件并选择...来启用文件监视。

Answer 2

SFTP为此提供了一个选项。 在程序包控件中搜索SFTP>监视文件。 选择后，“ SFTP监视”将出现在底部命令信息中。 现在，每次保存时，sass和兼容的css都将被上载到其重复的文件夹中。

Answer 3

由于Sublime SFTP似乎不支持此功能，因此您可能必须走另一条路。

我建议您使用某种东西来监视您的css文件夹，并将所有更改自动上传到您的服务器。 使用优质的WinSCP（如果您使用的是Windows）可以使用，但是任何同步文件夹的方法都可以使用。

http://winscp.net/eng/docs/task_keep_up_to_date

Answer 4

我最终报废了SFTP并使用ExpanDrive 。 非常适合我的工作流程。

Answer 5

我仍在使用Sublime SFTP上传脚本文件（js / css / php等）。 通常，我按快捷方式上传打开的文件（Ctrl Alt U + N）。 但这很烦人，尤其是在频繁使用免责声明窗口的情况下。

我在nodejs上编写了一个简单的工具，它可以监视项目文件夹并在更改后上载任何文件。 它并不完美，但是使我的工作流程更加舒适： https : //github.com/liberborn/live-uploader 。

Answer 6

还要注意，您可以通过以下方法将文件的本地副本映射到远程副本：打开Sublime中的本地文件夹，然后在侧边栏中右键单击它，然后选择SFTP / FTP->映射到远程...进行设置建立连接，请确保输入适当的remote_path以将文件夹映射到。

然后，您可以进行构建/编译，打开本地已编译文件，右键单击代码，然后在SFTP / FTP菜单中选择“监视文件”选项。

现在，当您将来再次构建时，在编译文件仍然打开的情况下，它们将在不久后上载到服务器（以及在切换选项卡以查看它们时在Sublime中刷新）。

Answer 7

如果在保存文件时对CoffeeScript / Sass / Less文件进行了编译，则有一种方法可以强制Sublime SFTP插件上传已编译的文件。

转到Sublime Menu → Tools → Developer → New Plugin... ，然后复制粘贴以下代码：

import sublime, sublime_plugin, re, os

class SftpAutoUpload(sublime_plugin.EventListener):    

    def is_remote_file(self, file_name):
        while file_name != os.path.abspath(os.sep):
            file_name = os.path.dirname(file_name)
            sftp_config = file_name + '/sftp-config.json'
            if os.path.exists(sftp_config):
                return True 
        return False

    def on_post_save_async(self, view):
        window = view.window()
        file_name = view.file_name()

        # Upload compiled files to SFTP when saving a file (Coffee, Sass, Less)
        if self.is_remote_file(file_name):
            extensions = { 'coffee': 'js', 'less': 'css', 'sass': 'css' }
            for extension, compiled in extensions.items():

                matches = re.match('^(.*)\.'+extension+'$', file_name)
                if matches is not None:
                    compiled_file = matches.group(1) + '.' + compiled
                    if os.path.exists(compiled_file):

                        new_view = window.open_file(compiled_file)
                        window.run_command("sftp_upload_file")
                        new_view.close()

将文件另存为sftp-auto-upload.py 。 重新启动Sublime。

该插件的作用如下：

• 它检查您是否正在编辑CoffeeScript，Sass或Less文件；
• 如果存在已编译文件，则在Sublime中打开已编译文件
• SFTP: Upload File执行“上SFTP: Upload File命令，并且关闭已编译的文件。

所有这一切几乎都是立即发生的，因此您甚至不会注意到打开了一个新选项卡。

可以改进代码，但是可以解决问题。