Настройка sublime text 3 для веб-разработки и html верстки: ставим эффективные плагины

Generating Your Own Access Token

If you feel uncomfortable giving your GitHub username and password to the plugin, you can generate a GitHub API access token yourself. Just open up a Terminal window/shell (on OS X, Linux or Cygwin), and run:

curl -u username -d '{"scopes":, "note": "sublime-github"}' https://api.github.com/authorizations

where is your GitHub username. You’ll be prompt for your password first. Then you’ll get back a response that includes a 40-digit “token” value (e.g. ). Go to Sublime Text 2 -> Preferences -> Package Settings -> GitHub -> Settings — User, and insert the token there. It should look like:

{
    "github_token": "6423ba8429a152ff4a7279d1e8f4674029d3ef87"
}

Restart Sublime.

That’s it!

Troubleshooting

If you are having problems or SublimeCodeIntel seems
slow/unresponsive/non-working, there are some things you should try:

1. Make sure the SublimeCodeIntel is not being treated as an ignored
   package.
2. Regenerate indexing database.
3. Open a new issue.

Ignored package?

To make sure Sublime Text didn’t add SublimeCodeIntel to the list of
ignored packages (this happens some times when packages are being
installed/upgraded):

• Select the menu item
• Find the setting and remove SublimeCodeIntel from
  the list.

Regenerate index

To force re-indexation of the code intelligence database you need to
follow these steps:

• Close Sublime Text
• Open a terminal or navigate through your directories to find the
  directory that contains ,
  and the directory . In Windows, this should be at
  .
• Delete the whole directory and all of its content.
  Particularly, if you want to delete only the indexes, the code intelligence database indexes are located inside .
• Start Sublime Text
• Try doing some code intelligence with the files in your project and
  enjoy a clean re-indexing! (Remember that the database is being
  regenerated with this procedure, so you’ll see it takes some time to
  autocomplete the first few times, you’ll have to wait a bit for
  things to be fast again)

Opening an issue

If the problems persist after trying the above solutions, open a new
issue in https://github.com/SublimeCodeIntel/SublimeCodeIntel/issues/

When opening new issues, please check no other issues exist which report
the same problem and provide all the messages from the Sublime Text
console (the console is accessed via the shortcut or the
menu) and the file
( in Windows) as well as
mentioning the Sublime Text version, the platform you are using and the
languages you are using the code intelligence on.

Installation

Download or clone the contents of this repository to a folder named exactly as the package name into the Packages/ folder of ST.

Troubleshooting Installation:

• First please note this package only adds a context menu to the “Folders” section and not to the “Open Files” section.
• Open the package folder. Main menu -> Preferences -> Browse Packages.
• Close Sublime Text.
• Remove the folder “Packages/SideBarEnhancements”
• Remove the folder “User/SideBarEnhancements”
• Navigate one folder up, to “Installed Packages/”, check for any instance of SideBarEnhancements and remove it.
• Open ST, with Package Control go to : Remove Package, check for any instance of SideBarEnhancements and remove it.
• Restart ST
• Open ST, check if there is any entry about SideBarEnhancements in Package Control(in sections: “Remove Package” and just in case in “Enable Package”)
• Repeat until you find there no entry about SideBarEnhancements
• Restart ST
• Install it.
• It works

3.0 Beta

by wbond
at 5:00pm
on Thursday, December 11th, 2014

After a couple of months of bug fixes and feature development, I‘m excited
to announce the first Package Control 3.0 beta! Over the next few days
I would like to get it in the hands of a bunch of users to work out any
final kinks. Hopefully 3.0 will be a little less eventful than the 2.0
rollout.

A set of full release notes will be displayed via Package Control messages,
however here are some highlights:

• depedency support
• an SSL module for Linux
• error-free theme, color scheme and syntax upgrades
• improved HTTP support on Windows
• functionality to sync package removals via the User/ folder

If you are willing to help, perform the following instructions to
upgrade to version 3.0.0-beta. Once upgraded, keep an eye
on the Sublime Text console for Python exceptions. If you experience any
issues, please
open an issue.

1. Open Preferences> Package Settings
   > Package Control > Settings – User
   and set the install_prereleases setting to true
2. Run the Add Repository command and enter
   https://sublime.wbond.net/prerelease/packages.json.
3. Run the Upgrade Package command and choose
   Package Control

Активация Sublime Text 3

Чтобы активировать Сублайн текст 3 откройте текстовый документ License Key, скопируйте из него один из ключей, далее запустите Сублайн и перейдите во вкладку «Справка» («Help«) — «Ввести лицензию» («Enter license«) вставляем ключ и жмем «Use License»

Установка Emmet на sublime text 3 и добавление в него Package Control.

Запускаем редактор и нажимаем Ctrl+ или «Вид» — «Показать/скрыть консоль» («View» — «Show console«), после чего снизу откроется панелька для ввода, вставьте в нее нижеприведенный код, нажмите «Enter«, немного подождите и перезапустите редактор.

import urllib.request,os,hashlib; h = 'df21e130d211cfc94d9b0905775a7c0f' + '1e3d39e33b79698005270310898eea76'; pf = 'Package Control.sublime-package'; ipp = sublime.installed_packages_path(); urllib.request.install_opener( urllib.request.build_opener( urllib.request.ProxyHandler()) ); by = urllib.request.urlopen( 'http://packagecontrol.io/' + pf.replace(' ', '%20')).read(); dh = hashlib.sha256(by).hexdigest(); print('Error validating download (got %s instead of %s), please try manual install' % (dh, h)) if dh != h else open(os.path.join( ipp, pf), 'wb' ).write(by)

Теперь заходим во вкладку «Опции» — «Package Control» или нажимаем сочетание клавиш «Ctrl» + «Shift» + «P«, после чего всплывет окошко в котором выбираем «Install Package» (если не ошибаюсь 6 строка).

После чего всплывет еще окошко, в котором необходимо ввести «Emmet«, появится масса предложений, нажимаем на первое (где просто Emmet).

Ждем немного, пока не откроется вкладка с содержимым, что Эммет успешно установлен, закрываем все вкладки и перезапускаем редактор. Все можно пользоваться!

В трех словах, о том, как работает Эммет

Приведу несколько примеров для Emmet. Допустим нам нужно базовый каркас веб-страницы на html5, для этого достаточно ввести «!» и нажать «Tab».

Чтобы быстро построить к примеру блок с классом col-sm-6, необходимо ввести «.col-sm-6» и нажать «Tab», получим «<div class=»col-sm-6″></div>»

Для того чтобы построить вот такую конструкцию:

<div class="row">
	<div class="col-md-3">Lorem ipsum dolor sit amet, consectetur adipisicing elit. Nesciunt natus quidem qui, obcaecati dolorem optio nulla voluptates suscipit eligendi laboriosam quisquam odio provident facilis laudantium. Non, tempora mollitia consequuntur laborum!</div>
	<div class="col-md-3">Incidunt fugiat beatae non voluptatum at iste inventore obcaecati rem tenetur officiis reprehenderit soluta, magnam est consequatur accusantium, fuga aperiam nesciunt exercitationem dignissimos aut, ut. Voluptatibus id explicabo, suscipit porro.</div>
	<div class="col-md-3">Iste magni, nam id a, maxime incidunt aperiam hic, aliquid suscipit aspernatur maiores quaerat sequi asperiores perferendis eum delectus consectetur sint excepturi laboriosam, error. Ratione voluptatum similique sunt sequi maiores!</div>
	<div class="col-md-3">Officiis doloremque cumque ab quae similique totam voluptates? Molestias rerum eos dolor nulla quidem nam pariatur, quisquam reiciendis tenetur. Dolorum, at, illum! Corporis, itaque, impedit repellendus natus accusantium sit sunt.</div>
</div>

достаточно ввести вот такую небольшую строчку «.row>.col-md-3*4>lorem» и нажать «Tab«.

Как вы видите Emmet очень крутое дополнение, которое очень ускоряет процесс верстки, главное уметь правильно им пользоваться) Советую почитать документацию.

На сегодня все!

Что такое копирайтинг?
Сборка на основе Bootstrap 3 >

Settings

Sublack will always look for settings in the following order:

• First in a pyproject.toml file
• Second in the project file: first with sublack prefix then in a subsetting (see Project settings).
• Then in Users global settings
• Finally in Sublack’s default settings

Global settings

Preferences -> Package Settings -> sublack -> settings :

Black specifics options

• black_line_length:

  Set custom line length option used by Black. Default = null which lets black default.

• black_fast:

  Black fast mode. default is false.

• black_skip_string_normalization:

  Don’t normalize string quotes or prefixes. Default = false.

• black_py36:

  Force use of python 3.6 only syntax. The default is Black-s default.

• black_target_version:

  Python versions that should be supported by Black’s output. You should enter it as a list ex :

Sublack specifics options

• black_command:

  Set custom location. Default = «black».

• black_on_save:

  Black is always run before saving the file. Default = false.

• black_log:

  Show non error messages in console. Default = info.

• black_default_encoding:

  Should not be changed. Only needed on some OSX platforms.

• black_use_blackd:

  Use blackd instead of black. Default = false.

• black_blackd_server_host:

  default = «localhost»,

• black_blackd_port:

  default = «45484»

• black_blackd_autostart:

  Automatically run blackd in the background wen sublime starts. default is false.

• black_use_precommit:

  run black via pre-commit hook.

• black_confirm_formatall:

  Popup confirmation dialog before format_all command. default = true.

Project settings

Just add sublack as prefix (recommended):

{
    "settings" {
        "sublack.black_on_save" true
    }
}

A sublack subsettings is still possible:

{
    "settings" {
        "sublack" {
            "black_on_save" true
        }
    }
}

Sublack supports the use of black configuration in pyproject.toml. Be aware that global/project settings will BE OVERRIDDEN by pyproject.toml’s settings.
Sublack will look for this file in your project directory then in your root folder(s).
See .

Windows Errors 12029 and 12057

On Windows, Package Control utilizes the WinINet C++ API for web requests.
This allows Package Control to rely on your OS for auto-configuration of
proxies and secure certificate validation.

Unfortunately there are a couple of common WinINet errors that users run
into, including:

• Connection refused (errno 12029) during HTTP write phase of
  downloading
• Error checking for server certificate revocation (errno 12057)
  during HTTP write phase of downloading

Since WinINet is a system API, it is configured through Internet Explorer.

Errno 12029

A number of users have reported success in resolving this issue by resetting
the Internet Explorer advanced settings to their default values.

1. Open Internet Explorer
2. Click the gear icon
3. Select Internet Options
4. Change to the Advanced tab
5. Click the Reset Advanced Settings button
6. Scroll down to the Security section of the options
7. Verify that TLS 1.0, TLS 1.1 and TLS 1.2 are checked

Errno 12057

Some users run into issues trying to check for SSL certificate revocation.
This may have to do with a proxy server not properly proxying the requests
for the certificate revocation list.

1. Open Internet Explorer
2. Click the gear icon
3. Select Internet Options
4. Change to the Advanced tab
5. Scroll down to the Security section of the options
6. Uncheck the option Check for server certificate revocation*
7. Restart your machine

This error indicates something on your machine is blocking the connection
to the server. It could be any number of different things.

Settings

A list of regular expressions patterns to ignore. Note that these regular expressions are compared against the file or directory name.

Boolean to keep selection panel open after selecting a resource to open.

Boolean setting specifying if a single command should be listed in the command palette for viewing and editing files or if multiple commands should be used.

True if, when moving up a directory, you would like the previous selection to be automatically chosen. False otherwise.

License

The MIT License (MIT)

Copyright 2013 Scott Kuroda

Permission is hereby granted, free of charge, to any person obtaining a copy of this software and
associated documentation files (the “Software”), to deal in the Software without restriction,
including without limitation the rights to use, copy, modify, merge, publish, distribute,
sublicense, and/or sell copies of the Software, and to permit persons to whom the Software
is furnished to do so, subject to the following conditions:

The above copyright notice and this permission notice shall be included in all copies or
substantial portions of the Software.

THE SOFTWARE IS PROVIDED “AS IS”, WITHOUT WARRANTY OF ANY KIND, EXPRESS OR IMPLIED, INCLUDING
BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND
NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM,
DAMAGES OR OTHER LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
sOUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE.

Скачивание и установка

Рассмотрим самую последнюю версию Sublime Text 3, поэтому наша инструкция может отличаться от того что вы видели ранее в интернете.

Чтобы скачать Sublime Text 3 откройте сайт sublimetext.com/3. Откроется страница — Download Sublime Text 3. Здесь вы можете выбрать необходимую версию под вашу операционную систему. Выбираю для windows Sublime Text 3 64 bit. Если у вас тоже windows 64 bit, можете выбрать соответствующий файл Sublime Text или его портативную версию. Скачайте загрузчик. После того как загрузчик будет скачан можно приступить к установке.

Рассмотрим как установить Sublime Text 3.

Запускаем скачанный файл от имени администратора.

Подтверждаем установку Sublime Text.

Выбираем путь для установки или оставляем тот, что выбрала программа по умолчанию.

На следующем шаге Sublime Text предложит добавить себя в контекстное меню. Отметьте галочку, чтобы разрешить это.

Далее устанавливаем и финишируем установку.

Установленный Sublime Text вы можете найти через меню “Пуск” — “Все программы”.

Installing

With the Package Control plugin: The easiest way to install CodeFormatter is through Package Control, which can be found at this site: http://wbond.net/sublime_packages/package_control

Once you install Package Control, restart Sublime Text and bring up the Command Palette ( on OS X, on Linux/Windows). Select “Package Control: Install Package”, wait while Package Control fetches the latest package list, then select CodeFormatter when the list appears. The advantage of using this method is that Package Control will automatically keep CodeFormatter up to date with the latest version.

Without Git: Download the latest source from GitHub and copy the CodeFormatter folder to your Sublime Text “Packages” directory.

With Git: Clone the repository in your Sublime Text “Packages” directory:

git clone https://github.com/akalongman/sublimetext-codeformatter.git CodeFormatter

The “Packages” directory is located at:

• OS X:

  ST2: ~/Library/Application Support/Sublime Text 2/Packages/
  ST3: ~/Library/Application Support/Sublime Text 3/Packages/
  

• Linux:

  ST2: ~/.config/sublime-text-2/Packages/
  ST3: ~/.config/sublime-text-3/Packages/
  

• Windows:

  ST2: %APPDATA%/Sublime Text 2/Packages/
  ST3: %APPDATA%/Sublime Text 3/Packages/
  

Basic Functionality

Package Control is driven by the Command Palette. To open the palette,
press ctrl+shift+p (Win, Linux) or
cmd+shift+p
(Mac). All Package Control commands begin with Package
Control:, so start by typing Package.

The command palette will now show a number of commands. Most users
will be interested in the following:

Install Package

Show a list of all available packages that are available for install.
This will include all of the packages from the default channel, plus
any from repositories you have added.

Add Repository

Add a repository that is not included in the default channel.
This allows users to install and automatically update
packages from GitHub and BitBucket. To add a package
hosted on GitHub, enter the URL in the form
https://github.com/username/repo. Don’t include
.git at the end! BitBucket repositories should use the
format https://bitbucket.org/username/repository.

Remove Package

This removes the package folder, and the package name from the
installed_packages list in
Packages/User/Package Control.sublime-settings. The
installed_packages list allow Package Control to automatically
install packages for you if you copy your Packages/User/
folder to another machine.

Description

Provides enhancements to the operations on Sidebar of Files and Folders for Sublime Text. http://www.sublimetext.com/

Notably provides delete as “move to trash”, open with.. and a clipboard.

Close, move, open and restore buffers affected by a rename/move command. (even on folders)

New file/folder, edit, open/run, reveal, find in selected/parent/project, cut, copy, paste, paste in parent, rename, move, delete, refresh….

Copy paths as URIs, URLs, content as UTF8, content as data:uri base64 ( nice for embedding into CSS! ), copy as tags img/a/script/style, duplicate

Preference to control if a buffer should be closed when affected by a deletion operation.

Allows to display “file modified date” and “file size” on statusbar (may be a bit buggy).

Installation

Note with either method, you may need to restart Sublime Text for the plugin to load properly.

Package Control

Installation through package control is recommended. It will handle updating your packages as they become available. To install, do the following.

• In the Command Palette, enter
• Search for

Manual

Clone or copy this repository into the packages directory. Ensure it is placed in a folder named . By default, the Packages directories for Sublime Text 2 are located at:

• OS X: ~/Library/Application Support/Sublime Text 2/Packages/
• Windows: %APPDATA%/Roaming/Sublime Text 2/Packages/
• Linux: ~/.config/sublime-text-2/Packages/

By default, the Packages directories for Sublime Text 3 are located at:

• OS X: ~/Library/Application Support/Sublime Text 3/Packages/
• Windows: %APPDATA%/Roaming/Sublime Text 3/Packages/
• Linux: ~/.config/sublime-text-3/Packages/

Resetting Statistics

by wbond
at 9:30pm
on Wednesday, July 31st, 2013

Some users may have noticed a brief outage on the default channel server.
Just now I took the channel offline to corrent a long-running glitch in
package install statistics.

Due to a bug in the script that handled usage submissions from Package
Control, all operations including upgrades and removals were being counted
as installs. This manifested itself more severly for packages that have
had lots of versions. Each time a new version of the package was released
and users upgraded, installs and unique installs were incorrectly being
increased.

From early in the project I decided to maintain a full history of every
usage submission in case information needed to be reconstructed. The brief
outage that users experienced was a full wipe of all install statistics
and a regeneration of them from the master usage table. Over 35 million
submissions were processed and tallied up into new, much more accurate
statistics.

The unfortunately downside of this is that many package developers will see
a dip in their install numbers. With the upcoming release of Package
Control 2.0 and the new website, the source code for recording and
displaying all of this information will be open source. Hopefully this will
present the opportunity for other developers to both help improve, but also
review the codebase to help catch such mistakes sooner.

Configuring

For adding additional library paths (Django and extra libs paths for
Python or extra paths to look for .js files for JavaScript for example),
either add those paths as folders to your Sublime Text project or
modify SublimeCodeIntel User settings. User settings can be configured
in the User File Settings:

Do NOT edit the default SublimeCodeIntel settings. Your changes will be
lost when SublimeCodeIntel is updated. ALWAYS edit the user
SublimeCodeIntel settings by selecting “Preferences->Package
Settings->SublimeCodeIntel->Settings — User”. Note that individual
settings you include in your user settings will completely replace
the corresponding default setting, so you must provide that setting in
its entirety.

Available settings:

• A list of disabled languages can be set using
  “disabled_languages”. Ex.

• Live autocomplete can be disabled by setting “live” to
  false.
• Information for more settings is available in the
  file in the package.

Dropped features

conditionals

The standard syntax highlights recognizes part after conditional as a comment. This is a really nice feature, however it is rather fragile and has many issues, e.g. with unterminated blocks (opening/closing brace inside a preprocessor conditional).
So for sake of simplicity it was decided to remove it at all, leaving only a plain handling, which is more or less stable and has pretty straightforward implementation.

You may however checkout a preprocessor-cond-scopes branch which doesn’t have this limitation.

Local variable declaration/initialization

C can be quite complicated to parse in some parts, for example related to pointer declarations (what is ? Is it a simple multiplication, or a declaration of a pointer to type called ?). Needless to say, it is just impossible to parse C using regular expressions. Therefore, C Improved doesn’t try to recognize variable declarations, so there is no distinct scope/highlighting for them.

Some discussion on this can be found in a related issue.

Install

Using Package Installer:

Ctrl+Shift+P - Install Package - Transparency

You may also install via git with the below commands:

Windows only

For Sublime Installed:

git clone https://github.com/vhanla/SublimeTextTrans.git "%APPDATA%\Sublime Text 2\Packages\Transparency"

Notice that this location might change on each SublimeText version, you can find the correct path by going to menu Preferences — Browse Packages

For Sublime as Portable:

git clone https://github.com/vhanla/SublimeTextTrans.git "C:\Sublime\Data\Packages\Transparency"

Where C:\Sublime is the portable’s path. So change accordingly.

You can also get it zipped from the Releases section.

Remember, this plugin must be inside its own directory within packages directory where you will unzip it.

Features

Backup/Restore

This allows you to backup the installed packages list & the user settings for each package. This backup can then be restored to any other device using PackageSync.

• Backup/Restore via a Zip file (Recommended) — Backs up the installed packages list & their settings into a zip file. The zip file is the best portable format for offline syncing.
• Backup/Restore via folder — Works the same way as the zip file, with the only difference that the contents are placed in a folder instead of an archived zip file.
• Backup/Restore only Package List — Backs up only the installed packages list to a file. User settings for packages are ignored in this option.

Do note that this Backup/Restore operation only syncs your packages list and your user settings offline. But the actual installation of missing/new packages requires a working Internet connection.

Also, while restoring from PackageSync backup, please ensure that all files are closed. Files in open state would interrupt the restore operation, resulting in unforeseen errors.

Sync Online

This allows you to sync the packages & user settings in real time across different devices. For this, the installed packages list & user settings are be saved to & synced via a folder monitored by Dropbox, Google Drive or SkyDrive etc.

• First Machine
  Turn on PackageSync’s online syncing module by setting the sync folder via “PackageSync: Sync Online — Define Online Sync Folder” from the command palette or Tools menu. In the ensuing input panel, give the complete path to any directory on your computer inside your Dropbox or Google Drive sync folder.

• Second Machine (or after a fresh installation of Sublime Text)
  On your second machine please wait until all the backup files are available and then simply set the sync folder and PackageSync will automatically pull all available files from that folder. The following message dialog should appear which you just have to confirm.

Restart Sublime Text & Package Control will check for missing packages and install them automatically. From now on everything should work very smoothly.

Plugin Installation

With the Package Control plugin: The easiest way to install
is through Package Control, which can be found at
this site: http://wbond.net/sublime_packages/package_control

Once you install Package Control, restart Sublime Text and bring up the
Command Palette ( on OS X, on
Linux/Windows). Select “Package Control: Install Package”, wait while
Package Control fetches the latest package list, then select
SublimeCodeIntel when the list appears. The advantage of using this
method is that Package Control will automatically keep SublimeCodeIntel
up to date with the latest version.

**Without Git:** Download the latest source from
GitHub and copy
the whole directory into the Packages directory.

**With Git:** Clone the repository in your Sublime Text Packages
directory, located somewhere in user’s “Home” directory:

git clone git://github.com/SublimeCodeIntel/SublimeCodeIntel.git

The “Packages” packages directory is located differently on different
platforms. To access the directory use:

• OS X:

  Sublime Text -> Preferences -> Browse Packages...
  

• Linux:

  Preferences -> Browse Packages...
  

• Windows:

  Preferences -> Browse Packages...