sublime text 3にview in browseを入れたが実行出来なかった記事

4297 ワード
SublimeText3 MacOSX viewinbrowse MacOSX テキストリンク

初投稿にあたって

慣れないMark down記法を用いた初めての投稿となります。プログラミングもそこまで出来ません。読みづらい、分かりづらい、配置センスがないなど多々あると思いますが、何らかしら役に立てたらと思っております。

はじめに

OS Xでsublime text 3にview in browseを入れてみたがあまりに稚拙なミスで動かなかったので、同じ現象で動かないって人に参考になったらいいなと思います。

Macにsublime text 3のview in browseを入れて実行してみた

view in browseとは、sublime textのパッケージの一つで、作成したhtmlファイルをショートカットキーなどでブラウザプレビューすることができます。

例えば下記のようなhtmlファイルを実行するとブラウザー上に反映してくれます。

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Document</title>
</head>
    <body>
    <b>hellow world</b>

    </body>
</html>

プログラムを作成しながらコマンドで実行できるって便利ですよね。導入方法についてですがいろんなところで紹介してるのでこの記事では割愛します。

sublime text 3にview in browseを入れて実行が出来なく悪戦苦闘した記録

結論から言うと、作成したhtmlファイルを入れるフォルダー名が

ファイル 名

のように半角スペース" "が入っているとうまく実行出来ないみたいです

例としてuntitled.htmlを

動か ない

と名前をつけたフォルダー内に保存してview in browserで動かしたところコンソール画面には

View In Browser plugin v2.0.0, Python 3
open -a "/Applications/Safari.app" file:////Users/UserName/Documents/.../.../動か%20ない/untitled.html

と表示されました。
htmlファイルを開く際のフォルダーのpathの「動か ない」の部分が「動か%20ない」に変わってますね。
ファイルを開く際のフォルダーのpathが違うので上手く実行出来ないのは当然ですね。
とても稚拙なミスに気づくのに2時間近く試行錯誤してしまいました。

ちなみにフォルダー名を

動　く

にしてフォルダー名に全角スペースを入れて中にあるhtmlファイルをview in browserで実行したところ上手く実行出来ました。

どうして半角スペースで実行出来なくて全角だと実行できるのかは原因不明です。

ついでに

Sublime Text > Preferences > Package Settings > View in Browser > Setting User
で使用するブラウザを増やしたり選択することができます。デフォルトではfire foxが起動するようなっていたので、Userの設定でデフォルトでsafariが起動するようにしました。下のコードをSetting Userに貼り付けるとデフォルトでsafariが起動します。

{
    "posix": {
        "linux": {
            "firefox": "firefox -new-tab",
            "chrome": "google-chrome",
            "chrome64": "google-chrome",
            "chromium": "chromium"
        },
        "linux2": {
            "firefox": "firefox -new-tab",
            "chrome": "google-chrome",
            "chrome64": "google-chrome",
            "chromium": "chromium"
        },
        "darwin": {
            "firefox": "open -a \"/Applications/Firefox.app\"",
            "safari": "open -a \"/Applications/Safari.app\"",
            "chrome": "open -a \"/Applications/Google Chrome.app\"",
            "chrome64": "open -a \"/Applications/Google Chrome.app\"",
            "yandex": "open -a \"/Applications/Yandex.app\""
        }
    },
    "nt": {
        "win32": {
            "firefox": "C:\\Program Files (x86)\\Mozilla Firefox\\firefox.exe -new-tab",
            "iexplore": "C:\\Program Files\\Internet Explorer\\iexplore.exe",
            "chrome": "C:\\Program Files (x86)\\Google\\Chrome\\Application\\chrome.exe",
            "chrome64": "C:\\Program Files (x86)\\Google\\Chrome\\Application\\chrome.exe",
            "yandex": "%Local AppData%\\Yandex\\YandexBrowser\\browser.exe"
        }
    },

    "browser": "safari"
}

対した記事ではないんですが、同じように動かない人がいたら役に立てたらと思います。