2016年3月1日 星期二

Sublime Text 3 安裝

下載 Sublime Text 3 安裝檔
https://www.sublimetext.com/3

安裝 Node.js
去 node.js 的官網 https://nodejs.org 下載安裝檔。之後會用到。
如何在 sublime text 3 設定 node.js 可以參考這篇文章,但是它的設定值在我的 sublime text 3 上面有問題。那篇文章是2012年的,可能是 sublime text2 。設定檔改成下面這樣就可以:
{
    "cmd": ["node", "$file", "$file_base_name"],
    "working_dir": "${project_path:${folder}}",
    "selector": "*.js"
}
設定檔來源:https://www.youtube.com/watch?v=W_TzeL4OhL0

安裝 Package Control 套件管理工具
執行 Sublilme Text 3,工具列 > View > Show Console,或是按 Ctrl + ` (tab鍵上面那個),會開啟命令列。複製這裡的程式碼,貼到命令列。

安裝 Install Package 用來安裝套件
工具列 > Preferences > Package Control ,輸入 install package 後按下 Enter 鍵。

安裝 Emmet
參考 《Sublime Text》自訂Emmet常用的網頁標籤語法並快速輸出
Preferences / Package Settings / Emmet / Settings-User
設定值:
{
    "snippets":{
        "html": {
            "snippets":{
                "gh5": "<!doctype html>\n<html lang=\"zh-Hant-TW\">\n<head>\n    <title>title</title>\n    <meta charset=\"UTF-8\">\n    <meta name=\"description\" content=\"metadescription\">\n</head>\n<body>\n\n</body>\n</html>",
                "ga": "<a href=\"#\">link</a>"
            }
        }
    }
}
這樣以後只要輸入 h5g 再按 tab 鍵,就可以產生基本的 html 標籤。h5 是 html5,g 是取 generate 產生的意思。

安裝 ConvertToUTF8
可辨識 Big5 並轉成 UTF8
工具列 > Preferences > Package Control> Install Package,在跳出來的視窗輸入 ConvertToUTF8,按下 Enter 鍵

安裝 View In Browser
參考 https://github.com/adampresley/sublime-view-in-browser
自訂快速鍵 Preferences > Key Bindings - User
[
    { "keys": [ "f12" ], "command": "view_in_browser" }
]

設定網址 Project -> Edit Project
{
    "folders":
    [
        {
            "path": "D:\\wwwroot\\temp.local"
        }
    ],
    "settings": {
        "sublime-view-in-browser": {
            "basePath": "D:\\wwwroot\\temp.local",
            "baseUrl": "http://temp.local"
        }
    }
}

其它設定
叫出命令列
Ctrl + `

修改設定
工具列 > Preferences > Settings - Default

自動折行 
單次設定:工具列 > View > Word Wrap,打勾或取消打勾
專案設定:
Project > Edit project
{
"folders":
[
{
"path": "D:\\MyWork\\www\\tggt.local"
}
],
"word_wrap": true 
}



安裝 Laravel 相關套件
Blade Snippets
Laravel 5 Artisan
Laravel 5 Snippets
Laravel Blade Highlighter

安裝 Generators
註:裝了之後發現這篇stackoverflow 說 Laravel 5 內建很多 Generators 功能,或許不用另外再裝。
Generators included in laravel 5 are very useful now so maybe you shouldn't worry about that, just type in php artisan to see the full list of them, they are under the make section

使用教學(英文) https://youtu.be/f2QH_wtURtk
Laravel 5 之後的安裝方式跟之前的不一樣。文末參考文章的內容有些不適用。
應該以這個為主:https://github.com/laracasts/Laravel-5-Generators-Extended
1. 執行 composer require laracasts/generators --dev
2. 編輯 app/Providers/AppServiceProvider.php
新增:
public function register()
{
    if ($this->app->environment() == 'local') {
        $this->app->register('Laracasts\Generators\GeneratorsServiceProvider');
    }
}
3. 執行 php artisan


參考
Sublime Text 3 新手上路:必要的安裝、設定與基本使用教學
Laravel 學習筆記(24) - Sublime Text 3 的 Laravel 外掛
Sublime Text 2 - 好用的前端程式編輯器 Part.2 安裝與簡單使用說明 (有好用的用法)





沒有留言:

張貼留言