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命令，並且關閉已編譯的文件。

所有這一切幾乎都是立即發生的，因此您甚至不會注意到打開了一個新選項卡。

可以改進代碼，但是可以解決問題。