Заставить Sublime Text Editor использовать 4 пробела для отступа
Я искал причину, по которой мой код продолжал показывать 2 пробела вместо 4.
Внизу также отображается как Spaces : 4.
Код
<!DOCTYPE html>
<html lang = "en">
<head>
@include('layouts.fe.meta')
@include('layouts.fe.links')
<link rel = "stylesheet" type = "text/css" href = "{{ elixir('assets/fe/css/all.css') }}"/>
<link href = "https://fonts.googleapis.com/css?family=Roboto:400,500" rel = "stylesheet">
<link rel = "stylesheet" href = "/css/hover-min.css">
<link rel = "stylesheet" href = "/css/magnific-popup.css">
<script src = "//ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
<style type = "text/css">
body{
font-family: 'Roboto', sans-serif !important;
}
#back_home {
position: absolute;
left: 10px;
top: 5px;
}
</style>
</head>
<body>
<a href = "/#portfolio" style = "color:white;" class = "btn btn-sm btn-success" id = "back_home">Back Home</a>
<section id = "page-portfolio" class = "page-portfolio">
<div class = "container">
<div class = "row text-center" style = "padding: 0px !important; margin: 0px !important;">
<header class = "section-header">
<h2 class = "section-title"><span>Portfolio</span></h2>
<div class = "spacer"></div>
<p class = "section-subtitle">While designing, I always balance usability and standard elements with other design criteria. </p>
</header>
<div class = "clearfix">
<div class = "cbp-l-filters-button cbp-l-filters-left">
<div data-filter = "*" class = "cbp-filter-item-active cbp-filter-item">All</div>
<div data-filter = ".personal" class = "cbp-filter-item">Personal</div>
<div data-filter = ".professional" class = "cbp-filter-item">Professional</div>
<div data-filter = ".freelance" class = "cbp-filter-item">Freelance</div>
</div>
</div>
<div class = "gallery">
@if (count($portfolios)>0)
@foreach($portfolios as $portfolio)
<?php $images = $portfolio->portfolioimages()->get()->toArray(); ?>
<div class = "col-xs-6 col-sm-2 img-pop cbp-item {{ $portfolio->type }} " style = "padding: 0px !important; margin: 0px !important;">
<a href = "{!! $images[0]['image_path'] !!}">
<img class = "hvr-shrink" src = "{!! $images[0]['image_path'] !!}">
</a>
</div>
@endforeach
@endif
</div>
<a style = "color:#555" href = "/" class = "btn btn-default hire-me">Go Back</a>
</div>
</div>
</section>
<script src = "//ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
<script src = "/js/jquery.cubeportfolio.js"></script>
<script src = "/js/jquery.magnific-popup.min.js"></script>
<script type = "text/javascript">
/* Magnific Popup */
$('.img-pop').magnificPopup({
delegate: 'a',
type: 'image',
gallery: {
enabled: true
}
});
// init cubeportfolio
$('.gallery').cubeportfolio({
filters: '.cbp-l-filters-button',
loadMore: '#js-loadMore-lightbox-gallery',
loadMoreAction: 'click',
layoutMode: 'grid',
mediaQueries: [{
width: 1500,
cols: 5
}, {
width: 1100,
cols: 4
}, {
width: 800,
cols: 3
}, {
width: 480,
cols: 2
}, {
width: 320,
cols: 1
}],
defaultFilter: '*',
animationType: 'rotateSides',
gapHorizontal: 10,
gapVertical: 10,
gridAdjustment: 'responsive',
caption: 'zoom',
displayType: 'sequentially',
displayTypeSpeed: 100,
// lightbox
lightboxDelegate: '.cbp-lightbox',
lightboxGallery: true,
lightboxTitleSrc: 'data-title',
});
</script>
</body>
</html>
Это трудно увидеть.
Настройки
Я добавил эти 3 строки
"tab_size": 4,
"translate_tabs_to_spaces": true,
"detect_indentation": false
Все настройки
{
"caret_extra_width": 2,
"caret_style": "phase",
"close_windows_when_empty": false,
"color_scheme": "Packages/User/SublimeLinter/Monokai (SL).tmTheme",
"copy_with_empty_selection": false,
"drag_text": false,
"draw_minimap_border": true,
"enable_tab_scrolling": false,
"findreplace_small": true,
"font_face": "Source Code Pro",
"font_options":
[
"no_round"
],
"font_size": 12,
"highlight_line": true,
"highlight_modified_tabs": true,
"ignored_packages":
[
"SublimeLinter",
"Vintage"
],
"match_brackets_content": false,
"match_selection": false,
"match_tags": false,
"open_files_in_new_window": false,
"overlay_scroll_bars": "enabled",
"predawn_findreplace_small": true,
"predawn_quick_panel_small": true,
"predawn_sidebar_arrows": false,
"predawn_sidebar_large": true,
"predawn_sidebar_medium": false,
"predawn_sidebar_small": false,
"predawn_sidebar_xlarge": false,
"predawn_sidebar_xsmall": false,
"predawn_tabs_active_underline": true,
"predawn_tabs_large": true,
"predawn_tabs_medium": false,
"preview_on_click": true,
"scroll_past_end": false,
"scroll_speed": 5.0,
"show_full_path": true,
"sidebar_default": true,
"theme": "predawn-DEV.sublime-theme",
"translate_tabs_to_spaces": true,
"trim_trailing_white_space_on_save": true,
"word_wrap": true,
"tab_size": 4,
"translate_tabs_to_spaces": true,
"detect_indentation": false
}
Как этого добиться?
вы хотите использовать размер табуляции 4 и пробелы 4, это то, что вы имеете в виду?
@ChristianGallarmin: да. Это то, что я хочу.
вы используете возвышенный текст 3?
@ChristianGallarmin: Да, я использовал Sublime Text 3. Я добавил этот тег в свой пост.
@Latheesan: Я попробовал то, что вы предложили (cmd + a, cmd + x, cmd + v), и изменил отступ после. В моем коде отступы по-прежнему испорчены с двумя пробелами.
Есть настройка: Sublime Text -> Preferences -> Key Bindings. Вы можете вручную установить привязки там. Например, я использую { "keys": ["f12"], "command": "reindent"}, поэтому выделение кода и нажатие F12 приведет к повторному отступу. В остальном ваши настройки выглядят нормально. Вы ушли и снова открылись?
@TimLewis Я уже упоминал, что уже пробовал использовать отступ. ??
@kyo а можно и use_tab_stops": true, поставить?
@ChristianGallarmin: позвольте мне попробовать это сейчас, и расскажу вам, ребята.
Если ваш параметр отступа не соответствует вашему файлу и вы хотите его изменить, используйте параметры в меню отступа (щелкните строку состояния, где написано Spaces: 4); установите размер табуляции так, как он выглядит визуально (2), выберите convert indentation to tabs, измените отступ обратно на желаемый (4), выберите convert indentation to spaces.
Также обратите внимание, что если вы работаете с файлами, которые явно не имеют правильного отступа, чтобы гарантировать, что Sublime соблюдает ваши предпочтения отступа, вам может потребоваться отключить настройку detect_indentation; По умолчанию это true, и он (потенциально) сделает настройки в файле отличными от тех, которые вы ожидаете при его открытии.
@OdatNurd Я попробовал ваш совет, но, похоже, это не сработало. Я не уверен, правильно ли я слежу за тобой. Можете ли вы использовать файл, который я опубликовал, и посмотреть, сможете ли вы правильно сделать отступ и вставить его обратно в свой ответ ниже. Я повторю ваши шаги еще раз, когда вы покажете, что это работает. Спасибо за вашу помощь.
Чего еще вы ждете от ответов? Ответы выглядят достаточно подробными.
![Безумие обратных вызовов в javascript [JS]](https://i.imgur.com/WsjO6zJb.png)
Ответы 4
Проблема, с которой вы здесь столкнулись, заключается в том, что вы установили желаемый размер отступа в Sublime, но файл, с которым вы работаете, уже имеет отступ, который не соответствует вашим настройкам.
Таким образом, вы должны заметить, что когда вы нажимаете Tab, он пропускает четыре пробела, как и должно, и вновь добавленный код имеет такой отступ, как вы хотите, но существующий код остается в покое, если вы не исправите его вручную.
Три параметра, которые управляют этим, - это те, которые вы упомянули в своем вопросе:
tab_sizeуправляет предполагаемой шириной символаtabв символах, который используется в визуальной настройке не только для определения того, сколько места должна занимать вкладка, но и для таких вещей, как расположение направляющих отступа.translate_tabs_to_spacesсообщает Sublime, что каждый раз, когда он вставляет буквальный символtab, он должен вместо этого преобразовывать эту вкладку в пробелыtab_sizeна лету. Это отображается в меню как элемент с именемIndent Using Spaces, который либо отмечен, либо не отмечен соответствующим образом.detect_indentationконтролирует, соблюдает ли Sublime две вышеуказанные настройки в точности или нет. Когда он установлен наtrue(по умолчанию, но не то, что вы используете) при загрузке файла Sublime пытается угадать соответствующие настройки отступа, анализируя файл.
Глядя на изображение в вашем вопросе, вы можете увидеть, что в строке состояния указано Spaces: 4, чтобы указать, что настройки tab_size или 4 и translate_tabs_to_spaces являются true, а направляющие отступов расположены так, как вы хотите, но код имеет неправильный отступ.
Поскольку мы знаем, что отступ определенно установлен на 4, но код выглядит так, как будто он имеет отступ только для 2, мы знаем, что ваш код не содержит никаких символов табуляции, или он будет выглядеть так, как вы хотите. Если бы у вас был включен detect_indentation, файл визуально выглядел бы так же, но Sublime изменил бы tab_size на 2 для этого файла, чтобы он соответствовал тому, что он видит в буфере.
В любом случае вы должны предпринять шаги, чтобы вручную исправить файл, чтобы он соответствовал вашим предпочтительным настройкам отступа.
Возможно, самый простой способ сделать это - выбрать весь файл с помощью Selection > Select All (или соответствующий ключ), а затем выбрать Edit > Line > Reindent из меню или Indentation: Reindent Lines из палитры команд.
Результаты этого могут быть, а могут и не быть смешанными; он использует ту же внутреннюю логику, что и Sublime для отступов во время набора текста. Таким образом, в зависимости от типа файла, который вы редактируете, и содержимого этого файла, возможно, что содержимое может быть изменено другими способами, кроме простого изменения отступа.
Если это нежелательно, вы можете выполнить изменение вручную, выполнив несколько шагов, используя команды, которые уже встроены в Sublime. Эти команды проще всего найти в меню, которое появляется, когда вы щелкаете строку состояния, где отображается ваш отступ. settings (Spaces: 4), но убедитесь, что вы сначала активно редактируете соответствующий файл, потому что каждому открытому файлу разрешено иметь разные настройки:
Используйте
Guess Settings From BufferилиTab Width: 2, чтобы изменить размер вкладки на тот, который используется в файле. Строка состояния изменится наSpaces: 2, и вы увидите, что количество направляющих отступа удвоится, когда новый параметр вступит в силу.Используйте
Convert Indentation to Tabsдля преобразования всего начального отступа из пробелов в табуляции. Строка состояния изменится наTab Size: 2, чтобы показать вам, что он использует табуляции, и если вы выделите текст в буфере, вы увидите, что ведущий пробел теперь является символом табуляции.Используйте
Tab Width: 4, чтобы изменить размер вкладок. Строка состояния изменится наTab Size: 4, и вы увидите, что отступ в файле заметно перескакивает на новую настройку.Используйте
Convert Indentation to Spaces. Строка состояния снова изменится наSpaces: 4, что вернет все к исходному состоянию, но с измененным файлом.
Если вам нужно исправить много таких файлов, эти шаги могут быть немного утомительными. В таком случае вы можете сократить все шаги, открыв файл, который необходимо изменить, открыть консоль Sublime с помощью View > Show Console (или привязку клавиш), а затем ввести следующую команду в ввод консоли и нажать Enter:
view.run_command("detect_indentation"); view.run_command("unexpand_tabs", {"set_translate_tabs": True}); view.settings().set("tab_size", 4); view.run_command("expand_tabs", {"set_translate_tabs": True})
Я отформатировал его здесь как обернутую строку для наглядности, но когда вы вставляете ее, она должна быть одной длинной строкой. При этом каждая из команд, упомянутых выше, выполняется одна за другой, что должно исправить файл за один шаг.
В Sublime Text Editor
Перейдите на вкладку
View.Выберите
IndentationЗатем выберите
Tab Width:4
Вы получите свой код с 4 пробелами, а внизу вы увидите Tab Size:2.
У вас есть
"tab_size": 4,
"translate_tabs_to_spaces": true,
"detect_indentation": false
На мой взгляд, строка 3 отрицает строку 1. Попробуйте:
"tab_size": 4,
"translate_tabs_to_spaces": true,
"detect_indentation": true
Выберите все и нажмите:
Вид → Отступ → Вкладка 4
Выделите весь код (ctrl + a) и вырежьте его (ctrl + x), а затем вставьте обратно (ctrl + v) - это должно вызвать переформатирование кода и соблюдение размера табуляции.