Решение, которое нельзя найти в Интернете

Node.js

GitbookэтоДокументация по продуктуИнструмент сборки также можно использовать для создания личного блога.По умолчанию левое меню раскрывается при доступе с компьютера, но некоторые люди хотят этого добиться.свернуто по умолчаниюэффект, поэтому эта статья родилась!

Добрый Я выбираю помогать другим

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

Итак, в прошлом месяце друг спросил меня, могу ли я его настроить.Gitbook свернуто по умолчаниювлияниеgitbookбольшой фанат, я даже не знаюgitbookИ эта конфигурация?!

Но добрый я всегда отзывчив,Не терпится отказатьсяПользователь Xiaobai, поэтому я начал изучать, как сбрасывать по умолчанию с мыслью попробовать?

gitbook-issue-modify-default-fold-preview.png

Конечно,Перед решением проблемы необходимо сначала воспроизвести проблему, а затем умело набрал его в командной строкеgitbook serveкоманда для запуска локального сервера, чтобыИсключить кешВ ожидании влияния, специально открытогоChromeбраузерРежим инкогнито,как и ожидалосьЛевое меню расширено по умолчанию!

gitbook-issue-modify-default-fold-review.png

«Технологическая станция Snow Dream»: Проблемы, которые невозможно воспроизвести, — это не мои проблемы,отказаться от решения таких вопросов, может быть, это ваша собственная проблема построения среды!

Внезапно оглядываясь назад, официальный документ ушел

После того, как проблема повторится, мы должны начать искать решение.Хотя в оттиске нет соответствующей конфигурации, трудно гарантировать, что некоторые элементы конфигурации отсутствуют из-за путаницы в памяти, поэтому давайте сначала посмотрим.официальная документацияЧто ты говоришь!

Однако, когда вы вводите в браузереgitbook 官方文档, я не могу найти официальную документацию, которую я себе представлял, ноНовый официальный сайт, если не веришь, иди сам поищи, должно бытьНовый официальный сайт.

gitbook-issue-modify-default-fold-document-search-result-preview.png

Если вы думаете, что нашли официальный сайт, нажмите, чтобы просмотреть раздел документации, к сожалению, это новая версия документации, а неУстаревшая документация, вы продолжите поиск в Baidu доступных ссылок и с нетерпением ждете появления официальных документов.

gitbook-issue-modify-default-fold-document-search-result-click.png

В целях экономии драгоценного времени рекомендуется посетить личное техническое обслуживаниеgitbookДокумент, нажмите Доступ:снежные мечты1006.GitHub.IO/git book-off…

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

gitbook-issue-modify-default-fold-gitbook-official-preview.png

Фактически,Официальная документация тоже не помогает, потому что нет упоминания о том, как изменить соответствующую конфигурацию, чтобыСвернутое по умолчанию вместо расширенного состояния.

gitbook-issue-modify-default-fold-gitbook-official-useless.png

«Технологическая станция Snow Dream»: официалы больше не поддерживают старую версию документа, и искать старую версию документа бесполезно, потому что нет упоминания о соответствующей конфигурации, поэтому вполне вероятно, что соответствующая конфигурация предметы не предоставляются!

Baidu, как только вы узнаете

Как говорится: «Подавляющее большинство проблем в Интернете возникло и было создано другими, и нам остается только найти их!»

Это тожеПоиск-ориентированное программированиеосновная идеяПроблема сгиба по умолчаниюИсключений быть не должно, так что ищите!

gitbook-issue-modify-default-fold-search-baidu-no-result.png

Хотя есть несколько связанных статей о поиске Baidu, они не дают желаемого эффекта.Большинство из них основаны наgitbookреализовано плагиномсвертывание каталогаэффект, неСвернуть левое меню по умолчаниюЭффект.

не важно какПовторный поиск ключевых словили поиск в гугле,Ни один не нашел решения для свернутого левого меню по умолчанию, неужели поисково-ориентированный поиск не удался, и надо быть первым, кто решит проблему?!

gitbook-issue-modify-default-fold-search-google-no-result.png

«Технологическая станция Snow Dream»: многократные повторные поисковые операции находят решения, видно, чтоДействительно несколько человек хотят разрушить левое меню по умолчаниюЯ также восхищаюсь небольшими партнерами, которые делают этот вопрос.Скелет Сюрпризкакие!

Уверенность в себе ищет подсказки

Поскольку вы не можете решить проблемы, полагаясь на других, вы можете толькоУверенность в себе, чтобы решать проблемы самостоятельно, пришло время проверить настоящую технологию!

В целях устранения неуместных помех вы больше не можете использовать собственныеgitbookВедь файлов слишком много и для последующей отладки это не удобно, так что можно и пересоздать тестовый проект.

  • Создать тестовый проект
$ mkdir test && cd test
  • Инициализировать тестовый проект
$ gitbook init
  • Начать тестовый проект
$ gitbook serve

Хотя она пуста и не имеет содержательного содержания, дорога проста, нам достаточно воспроизвести и проверить задачу!

gitbook-issue-modify-default-fold-test-serve.png

ОткрытьChromeбраузер и нажмитеF12Включите режим отладки и выберите левыйElementsВкладка «Элементы» и подсветите маленькую мышь слева, затем найдите на странице левую кнопку со значком, чтобы выбранный элемент был выделен.

gitbook-issue-modify-default-fold-test-serve-selected-elements.png

отдельный отрывокHtmlКод ключа следующий:

<a class="btn pull-left js-toolbar-action" aria-label="" href="#"><i class="fa fa-align-justify"></i></a>

Друзья, которые немного знакомы с интерфейсом, могут легко понятьaпомеченclassЗначение представления атрибута, см. название и значение, можно объяснить следующим образом:

  • btnЭто должен быть стиль, который управляет внешним видом и ведет себя как эффект кнопки.
  • pull-leftЭто должно быть положение элемента управления, оттянутого вниз влево.
  • js-toolbar-actionдолжно быть поведение элемента управления,jsДействие поведения панели инструментов.

Видно, что щелчок по этому значку для достижения эффекта свертывания/развертывания левого меню должен быть.js-toolbar-actionработающий, то есть некийjsопределенно дляclassПн слушает!

В этот момент нажмите справаEvent Listenersвкладка, чтобы увидеть, что прослушал элементclickсобытие, какое конкретное событие расположеноjsфайл работает.

gitbook-issue-modify-default-fold-test-serve-inspection-listeners.png

Конечно, элемент существуетclickНажмите на прослушиватель событий и обнаружите, что логический код для выполнения прослушивателя появляется вtheme.jsфайл, нажмите, чтобы войти в файл для просмотра определенного содержимого.

gitbook-issue-modify-default-fold-test-serve-themejs-ugly.png

сжатыйjsКод не читается, нажмите слева внизу{}значок может бытьформатирование кода, но это может быть и не простое сжатие, а такая логика, как утрировка или обфускация кода,Отформатированный код по-прежнему не читается!

gitbook-issue-modify-default-fold-test-serve-themejs-format.png

«Технологическая станция Snow Dream»: наконец-то найдены подсказки, а измененная логика кода спрятана вtheme.jsфайл, если вы найдете соответствующий исходный код для перекомпиляции выводаtheme.jsfile и replace должны добиться эффекта складывания по умолчанию!

Не беспокойтесь о темноте перед рассветом

Судя по имеющимся в настоящее время подсказкам, можно с уверенностью сказать, что в основном есть две полезные подсказки:

  • элемент прослушивания.js-toolbar-action
  • выходной файлtheme.js

Один является исходным файлом, а другой - выходным файлом.gitbookБыстро найти соответствующую логику кода в проекте,У меня ограниченные личные возможности, и я не знаком с процессом разработки и отладки интерфейса, поэтому я использую самый простой и грубый метод поиска дурака для устранения неполадок.!

«Технологическая станция Snow Dream»: если читатели более ориентированы на атрибуты современного процесса разработки интерфейса, они должны быть в состоянии отладить проблему позиционирования после изучения структуры проекта, и такой дурак, как я, не должен это делать. искать и устранять неполадки!

  • Посмотреть текущийgitbookВерсия
$ gitbook current
GitBook version is 3.2.3
  • оказатьсяgitbookМесто установки

gitbookОбычно устанавливается в~/.gitbook/versions/3.2.3каталог, который~Указывает домашний каталог пользователя.

$ open ~/.gitbook/versions/3.2.3

Выберите знакомый редактор и откройтеGitbookкаталог установки, здесьsublimeВозьмем для примера редактор, после выбора пунктащелкните правой кнопкой мышиКлючевые слова глобального поискаjs-toolbar-actionОжидайте найти соответствующие исходные файлы.

gitbook-issue-modify-default-fold-source-sublime-search.png

После глобального поиска есть в основном два файла, содержащиеjs-toolbar-actionключевое слово, один из них - выходной файлtheme.js, другой - исходный файлtoolbar.js .

Searching 19744 files for "js-toolbar-action"

/Users/snowdreams1006/.gitbook/versions/3.2.3/node_modules/gitbook-plugin-theme-default/_assets/website/theme.js:

...

/Users/snowdreams1006/.gitbook/versions/3.2.3/node_modules/gitbook-plugin-theme-default/src/js/theme/toolbar.js:

...

4 matches across 2 files

Вполне возможно, что файл исходного кода должен бытьКомпиляция обработкиПосле вывода единого пакета, поэтомуНе только для того, чтобы найти исходные файлы, но и для того, чтобы уметь компилировать.

«Технологическая станция Snow Dream»: найдите текущуюgitbookПосле каталога используется глобальная функция поиска, чтобы найти конкретный путь к файлу, который работает.gitbook-plugin-theme-defaultпроект, по сути, этоGitbookТема по умолчанию.

Где исходный код?

/Users/snowdreams1006/.gitbook/versions/3.2.3/node_modules/gitbook-plugin-theme-default/src/js/theme/toolbar.js :

// Update a button
function updateButton(opts) {
    var $result;
    var $toolbar = $('.book-header');
    var $title = $toolbar.find('h1');

    // Build class name
    var positionClass = 'pull-'+opts.position;

    // Create button
    var $btn = $('<a>', {
        'class': 'btn',
        'text': opts.text? ' ' + opts.text : '',
        'aria-label': opts.label,
        'href': '#'
    });

    // Bind click
    $btn.click(opts.onClick);

    // Prepend icon
    if (opts.icon) {
        $('<i>', {
            'class': opts.icon
        }).prependTo($btn);
    }

    // Prepare dropdown
    if (opts.dropdown) {
        var $container = $('<div>', {
            'class': 'dropdown '+positionClass+' '+opts.className
        });

        // Add button to container
        $btn.addClass('toggle-dropdown');
        $container.append($btn);

        // Create inner menu
        var $menu = createDropdownMenu(opts.dropdown);

        // Menu position
        $menu.addClass('dropdown-'+(opts.position == 'right'? 'left' : 'right'));

        $container.append($menu);
        $result = $container;
    } else {
        $btn.addClass(positionClass);
        $btn.addClass(opts.className);
        $result = $btn;
    }

    $result.addClass('js-toolbar-action');

    if ($.isNumeric(opts.index) && opts.index >= 0) {
        insertAt($toolbar, '.btn, .dropdown, h1', opts.index, $result);
    } else {
        $result.insertBefore($title);
    }
}

// Update all buttons
function updateAllButtons() {
    $('.js-toolbar-action').remove();
    buttons.forEach(updateButton);
}

На первый взгляд, приведенный выше код представляет собой логическую реализацию для запуска меню свертывания/развертывания значка слева.Это просто конкретная реализация, и я не знаю, кто пользователь, то есть где это логика называется?

Вы можете только продолжать следовать лозе и искать.Согласно базовому здравому смыслу разработки, следующие файлы существуют в том же каталоге уровня этого файла, среди которыхindex.jsЭто должен быть входной файл:

snowdreams1006s-MacBook-Pro:theme snowdreams1006$ tree .
.
├── dropdown.js
├── index.js
├── keyboard.js
├── loading.js
├── navigation.js
├── platform.js
├── sidebar.js
└── toolbar.js

0 directories, 8 files
snowdreams1006s-MacBook-Pro:theme snowdreams1006$

Открытьindex.jsфайл, в соответствии с комментариями, которые мы можем увидетьinit()Функция — это входная функция, котораяsidebar.init()а такжеsidebar.toggle()Все функции описаныsidebar.jsа такжеtoolbar.jsтесно связаны, есть все основания подозреватьsidebar.jsдаtoolbar.jsпользователь !

function init() {
    // Init sidebar
    sidebar.init();

    // Init keyboard
    keyboard.init();

    // Bind dropdown
    dropdown.init();

    // Init navigation
    navigation.init();

    // Add action to toggle sidebar
    toolbar.createButton({
        index: 0,
        icon: 'fa fa-align-justify',
        onClick: function(e) {
            e.preventDefault();
            sidebar.toggle();
        }
    });
}

Открытьsidebar.jsфайл и просмотрinit()функция инициализации иtoggle()Запустите функцию, чтобы проверить нашу догадку, вот и центр управления!

// Prepare sidebar: state and toggle button
function init() {
    // Init last state if not mobile
    if (!platform.isMobile()) {
        toggleSidebar(gitbook.storage.get('sidebar', true), false);
    }

    // Close sidebar after clicking a link on mobile
    $(document).on('click', '.book-summary li.chapter a', function(e) {
        if (platform.isMobile()) toggleSidebar(false, false);
    });
}

«Технологическая станция «Снежная мечта»»:немобильный терминалинициализировать последнее состояние,По умолчаниюбоковая панель, если она естьМобильный телефон сложенБоковая панель Среди них toggleSidebar() получает два параметра, первый параметр указывает, разворачиваться или сворачиваться, а второй параметр пока неизвестен.

// Toggle sidebar with or withour animation
function toggleSidebar(_state, animation) {
    if (gitbook.state != null && isOpen() == _state) return;
    if (animation == null) animation = true;

    gitbook.state.$book.toggleClass('without-animation', !animation);
    gitbook.state.$book.toggleClass('with-summary', _state);

    gitbook.storage.set('sidebar', isOpen());
}

"Технологическая станция Snow Dream": Первый параметр действительно указывает на статус, а второй параметр указывает на наличие эффекта анимации.Общую логику можно догадаться, не глядя на конкретную логику кода, а глядя на комментарии.

Из вышеприведенного анализа мы можем знать, чтоinit()Функция инициализации определяет, будет ли поведение по умолчанию сворачиваться или расширяться, иgitbook.storage.set('sidebar', isOpen())а такжеgitbook.storage.get('sidebar', true)Должен быть флаг, чтобы установить и получить ли расширить меню!

Из этого, если вы хотите свернуть левое меню по умолчанию, вам нужно только установить его наgitbook.storage.set('sidebar', false)Он должен работать!

Как скомпилировать

Просто делай, что говоришь, так что тебе не все равноinit()вставка функцииgitbook.storage.set('sidebar', false)Складная логика по умолчанию, затем посмотрим, нужно ли его перекомпилировать, чтобы вступить в силу?

// Prepare sidebar: state and toggle button
function init() {
    // Close sidebar as default state 
    gitbook.storage.set('sidebar', false);

    // Init last state if not mobile
    if (!platform.isMobile()) {
        toggleSidebar(gitbook.storage.get('sidebar', true), false);
    }

    // Close sidebar after clicking a link on mobile
    $(document).on('click', '.book-summary li.chapter a', function(e) {
        if (platform.isMobile()) toggleSidebar(false, false);
    });
}

Затем переключитесь на тестовый проект и снова запустите его.gitbook serveзапустить локальный сервер,не нашел изменений, Очень вероятно, что измененный файл исходного кода необходимо перекомпилировать, чтобы он вступил в силу, или измененный проект исходного кода не вступает в силу?

gitbook-issue-modify-default-fold-test-serve-again-fail.png

«Snow Dream Technology Station»: проект, в котором находится файл исходного кода,gitbook-plugin-theme-default,согласно сgitbookМы знаем соглашение об именах плагинов,gitbook-plugin-*Как правило, это функциональный плагин.gitbook-plugin-readmoreЧитайте больше плагинов иgitbook-plugin-copyrightПлагины защиты авторских прав и многое другое.

Но если имя плагина начинается сgitbook-plugin-themeВначале этот тип плагина представляет собой плагин темы, такой какgitbook-plugin-theme-defaultявляется темой по умолчанию.

Кроме того, пока вводятся плагины, соответствующие правилам именования, их не нужно добавлять.gitbook-plugin-префикс, который может быть непосредственноgitbook.jsonОстальные аббревиатуры вводятся в файл как названия плагинов.

Выдержки изGitbookКонфигурационный файл проекта может подтвердить правильность вышеизложенных правил.

"plugins": [
    "toc",
    "pageview-count",
    "mermaid-gb3",
    "-lunr",
    "-search",
    "search-plus",
    "splitter",
    "-sharing",
    "sharing-plus",
    "expandable-chapters-small",
    "anchor-navigation-ex",
    "edit-link",
    "copy-code-button",
    "chart",
    "favicon-custom",
    "github-buttons",
    "advanced-emoji",
    "rss",
    "readmore",
    "copyright",
    "tbfed-pagefooter",
    "mygitalk",
    "donate"
]

как обычныйnodejsпакет, спецификация разработки указываетpackage.jsonпредоставляет информацию о конфигурации для плагина, в то время какGitbookплагины в дополнение к стандартнымnodejsПакет имеет свои ограничения, которые в основном отражаются в предоставленииgitbookСвойства узла:

"gitbook": {
    "properties": {
      "styles": {
        "type": "object",
        "title": "Custom Stylesheets",
        "properties": {
          "website": {
            "title": "Stylesheet for website output",
            "default": "styles/website.css"
          },
          "pdf": {
            "title": "Stylesheet for PDF output",
            "default": "styles/pdf.css"
          },
          "epub": {
            "title": "Stylesheet for ePub output",
            "default": "styles/epub.css"
          },
          "mobi": {
            "title": "Stylesheet for Mobi output",
            "default": "styles/mobi.css"
          },
          "ebook": {
            "title": "Stylesheet for ebook outputs (PDF, ePub, Mobi)",
            "default": "styles/ebook.css"
          },
          "print": {
            "title": "Stylesheet to replace default ebook css",
            "default": "styles/print.css"
          }
        }
      },
      "showLevel": {
        "type": "boolean",
        "title": "Show level indicator in TOC",
        "default": false
      }
    }
}

Тема по умолчанию предоставляет только два элемента конфигурации, а именноstylesместоположение файла стиля иshowLevelПоказывать ли конфигурацию иерархии.

В очередной раз подтверждается правильность догадки.Действительно необходимо модифицировать исходный код, чтобы добиться эффекта сворачивания левого меню по умолчанию.package.jsonНайдите адрес хостинга исходного кода проекта в , и посмотрите, есть ли какие-либо вторичные документы по разработке.

"repository": {
    "type": "git",
    "url": "git+https://github.com/GitbookIO/theme-default.git"
}

К сожалению, вступление к проекту пустое, ничего, кроме превью темы?!

gitbook-issue-modify-default-fold-theme-default-github-preview.png

Поскольку вторичного документа по разработке нет, давайте посмотрим, есть ли в исходном коде проекта какие-либо другие подсказки, которые научат нас компилировать?

"Snow Dream Technology Station": Объездив так много, это на самом деле не из-за сравнения. Люди предоставляют исходный код без компиляции, оставляя слезы без технологий!

Перспектива снова переключается в исходный каталог, за исключениемjsа такжеlessКроме справочника есть еще одинbuild.shСоздайте сценарий!

snowdreams1006s-MacBook-Pro:src snowdreams1006$ tree 
.
├── build.sh
├── js
│   ├── core
│   └── theme
│       ├── dropdown.js
│       ├── index.js
│       ├── keyboard.js
│       ├── loading.js
│       ├── navigation.js
│       ├── platform.js
│       ├── sidebar.js
│       └── toolbar.js
└── less

7 directories, 37 files
snowdreams1006s-MacBook-Pro:src snowdreams1006$

В этот момент, как будто видя восход солнца в девять часов, будущее за вами и за нами!

snowdreams1006s-MacBook-Pro:gitbook-plugin-theme-default snowdreams1006$ cat src/build.sh 
#! /bin/bash

# Cleanup folder
rm -rf _assets

# Recreate folder
mkdir -p _assets/website/
mkdir -p _assets/ebook/

# Compile JS
browserify src/js/core/index.js | uglifyjs -mc > _assets/website/gitbook.js
browserify src/js/theme/index.js | uglifyjs -mc > _assets/website/theme.js

# Compile Website CSS
lessc -clean-css src/less/website.less _assets/website/style.css

# Compile eBook CSS
lessc -clean-css src/less/ebook.less _assets/ebook/ebook.css
lessc -clean-css src/less/pdf.less _assets/ebook/pdf.css
lessc -clean-css src/less/mobi.less _assets/ebook/mobi.css
lessc -clean-css src/less/epub.less _assets/ebook/epub.css

# Copy fonts
mkdir -p _assets/website/fonts
cp -R node_modules/font-awesome/fonts/ _assets/website/fonts/fontawesome/

# Copy icons
mkdir -p _assets/website/images
cp node_modules/gitbook-logos/output/favicon.ico _assets/website/images/
cp node_modules/gitbook-logos/output/apple-touch-icon-152.png _assets/website/images/apple-touch-icon-precomposed-152.png

snowdreams1006s-MacBook-Pro:gitbook-plugin-theme-default snowdreams1006$

В этом скрипте кроме не понятногоbrowserify,uglifyjs,lessc -clean-cssЗа исключением команды, все остальное очень просто, грубо компилируем исходный файл и выводим его в_assetsсодержание.

компилироватьjsВ основном есть следующие две команды, и нас интересуетtheme.jsОн включает только один элемент, и нет никаких других зависимостей, что очень хорошо!

# Compile JS
browserify src/js/core/index.js | uglifyjs -mc > _assets/website/gitbook.js
browserify src/js/theme/index.js | uglifyjs -mc > _assets/website/theme.js

Следующий момент — как запуститьbrowserify src/js/theme/index.js | uglifyjs -mc > _assets/website/theme.jsЗаказал!

Внесите изменения и перекомпилируйте исходный код

browserify src/js/theme/index.js | uglifyjs -mc > _assets/website/theme.js

Baidu смотреть в браузере

Снова откройте привычный браузер и введите ключевое словоbrowserifyПосле появления серии статей по теме, мне стало любопытно, почему первый рейтинг не официальный сайт?browserifyизgithubАдрес проекта тоже хорош!

gitbook-issue-modify-default-fold-search-browserify.png

не волнует здесьbrowserifyЧто это, забота только о том, как установить базовую среду!

$ npm install -g browserify

«Технологическая станция Snow Dream»: если даmacкомпьютер, глобальная установка требует прав администратора и должна работатьsudo npm install -g browserify,еслиНенавижу медленную установкутакже может работатьcnpm install -g browserify, при условии, что он установленcnpmЗаказ.

гугл углифайс

Не взорвите его, не стройте из себя дурака, сделайте несколько обходных путей и найдите его прямоgithubВеб-сайт проекта также не заботится о представлении проекта, просто посмотрите раздел «Как установить».

$ npm install -g uglify-js

gitbook-issue-modify-default-fold-search-uglifyjs.png

Перекомпилируйте других

относится кbrowserify src/js/theme/index.js | uglifyjs -mc > _assets/website/theme.jsДва плагина команды были установлены, и она должна начать перекомпилировать исходный код, но сообщается об ошибке?

Когда возникает ошибка, я начинаю сомневаться в жизни.Вывод неверный?Не удалось установить среду?Почему подсказка не найдена?mousetrapмодуль?

$ browserify src/js/theme/index.js | uglifyjs -mc > _assets/website/theme.js
Error: Cannot find module 'mousetrap' from '/Users/snowdreams1006/.gitbook/versions/3.2.3/node_modules/gitbook-plugin-theme-default/src/js/theme'
    at /usr/local/lib/node_modules/browserify/node_modules/_resolve@1.1.7@resolve/lib/async.js:46:17
    at process (/usr/local/lib/node_modules/browserify/node_modules/_resolve@1.1.7@resolve/lib/async.js:173:43)
    at ondir (/usr/local/lib/node_modules/browserify/node_modules/_resolve@1.1.7@resolve/lib/async.js:188:17)
    at load (/usr/local/lib/node_modules/browserify/node_modules/_resolve@1.1.7@resolve/lib/async.js:69:43)
    at onex (/usr/local/lib/node_modules/browserify/node_modules/_resolve@1.1.7@resolve/lib/async.js:92:31)
    at /usr/local/lib/node_modules/browserify/node_modules/_resolve@1.1.7@resolve/lib/async.js:22:47
    at FSReqCallback.oncomplete (fs.js:158:21)

Забудьте об этом, вместо того, чтобы пытаться угадать, почему он не загружаетсяmousetrapМодули, лучше продолжить установку остальных зависимостей, чтобы максимально устранить проблемы с окружением.

тогда поставьsrc/build.shУстановите все остальные команды, участвующие в сценарии сборки, и повторите попытку!

помимо компиляцииJsПомимо команды, есть еще компиляцияCssкоманда, о скрипте сборкиbuild.shДругой контент — это основные операции копирования и вставки.

# Compile Website CSS
lessc -clean-css src/less/website.less _assets/website/style.css

Промежуточный процесс поисково-ориентированного программирования здесь опущен, а команда установки выглядит следующим образом:

$ npm install -g less less-plugin-clean-css

Когда я снова запускаю скрипт сборки, ожидаю, что он успешно скомпилируется, я не ожидал, что снова столкнусь с реальностью еще раз, на этот раз он ошибся, действительно не ожидал!

snowdreams1006s-MacBook-Pro:gitbook-plugin-theme-default snowdreams1006$ src/build.sh 
Error: Cannot find module 'jquery' from '/Users/snowdreams1006/.gitbook/versions/3.2.3/node_modules/gitbook-plugin-theme-default/src/js/core'
    at /usr/local/lib/node_modules/browserify/node_modules/_resolve@1.1.7@resolve/lib/async.js:46:17
    at process (/usr/local/lib/node_modules/browserify/node_modules/_resolve@1.1.7@resolve/lib/async.js:173:43)
    at ondir (/usr/local/lib/node_modules/browserify/node_modules/_resolve@1.1.7@resolve/lib/async.js:188:17)
    at load (/usr/local/lib/node_modules/browserify/node_modules/_resolve@1.1.7@resolve/lib/async.js:69:43)
    at onex (/usr/local/lib/node_modules/browserify/node_modules/_resolve@1.1.7@resolve/lib/async.js:92:31)
    at /usr/local/lib/node_modules/browserify/node_modules/_resolve@1.1.7@resolve/lib/async.js:22:47
    at FSReqCallback.oncomplete (fs.js:158:21)
Error: Cannot find module 'mousetrap' from '/Users/snowdreams1006/.gitbook/versions/3.2.3/node_modules/gitbook-plugin-theme-default/src/js/theme'
    at /usr/local/lib/node_modules/browserify/node_modules/_resolve@1.1.7@resolve/lib/async.js:46:17
    at process (/usr/local/lib/node_modules/browserify/node_modules/_resolve@1.1.7@resolve/lib/async.js:173:43)
    at ondir (/usr/local/lib/node_modules/browserify/node_modules/_resolve@1.1.7@resolve/lib/async.js:188:17)
    at load (/usr/local/lib/node_modules/browserify/node_modules/_resolve@1.1.7@resolve/lib/async.js:69:43)
    at onex (/usr/local/lib/node_modules/browserify/node_modules/_resolve@1.1.7@resolve/lib/async.js:92:31)
    at /usr/local/lib/node_modules/browserify/node_modules/_resolve@1.1.7@resolve/lib/async.js:22:47
    at FSReqCallback.oncomplete (fs.js:158:21)
FileError: '../../node_modules/font-awesome/less/font-awesome.less' wasn't found. Tried - /Users/snowdreams1006/.gitbook/versions/3.2.3/node_modules/gitbook-plugin-theme-default/node_modules/font-awesome/less/font-awesome.less,/Users/snowdreams1006/.gitbook/versions/3.2.3/node_modules/gitbook-plugin-theme-default/node_modules/font-awesome/less/font-awesome.less,../../node_modules/font-awesome/less/font-awesome.less in /Users/snowdreams1006/.gitbook/versions/3.2.3/node_modules/gitbook-plugin-theme-default/src/less/website.less on line 2, column 1:
1 @import "base/all.less";
2 @import "../../node_modules/font-awesome/less/font-awesome.less";
3 @import "../../node_modules/preboot/less/preboot.less";

FileError: '../../../node_modules/gitbook-markdown-css/less/mixin.less' wasn't found. Tried - /Users/snowdreams1006/.gitbook/versions/3.2.3/node_modules/gitbook-plugin-theme-default/node_modules/gitbook-markdown-css/less/mixin.less,/Users/snowdreams1006/.gitbook/versions/3.2.3/node_modules/node_modules/gitbook-markdown-css/less/mixin.less,../../../node_modules/gitbook-markdown-css/less/mixin.less in /Users/snowdreams1006/.gitbook/versions/3.2.3/node_modules/gitbook-plugin-theme-default/src/less/base/mixins.less on line 1, column 1:
1 @import "../../../node_modules/gitbook-markdown-css/less/mixin.less";
2 

FileError: '../../../node_modules/gitbook-markdown-css/less/mixin.less' wasn't found. Tried - /Users/snowdreams1006/.gitbook/versions/3.2.3/node_modules/gitbook-plugin-theme-default/node_modules/gitbook-markdown-css/less/mixin.less,/Users/snowdreams1006/.gitbook/versions/3.2.3/node_modules/node_modules/gitbook-markdown-css/less/mixin.less,../../../node_modules/gitbook-markdown-css/less/mixin.less in /Users/snowdreams1006/.gitbook/versions/3.2.3/node_modules/gitbook-plugin-theme-default/src/less/base/mixins.less on line 1, column 1:
1 @import "../../../node_modules/gitbook-markdown-css/less/mixin.less";
2 

FileError: '../../../node_modules/gitbook-markdown-css/less/mixin.less' wasn't found. Tried - /Users/snowdreams1006/.gitbook/versions/3.2.3/node_modules/gitbook-plugin-theme-default/node_modules/gitbook-markdown-css/less/mixin.less,/Users/snowdreams1006/.gitbook/versions/3.2.3/node_modules/node_modules/gitbook-markdown-css/less/mixin.less,../../../node_modules/gitbook-markdown-css/less/mixin.less in /Users/snowdreams1006/.gitbook/versions/3.2.3/node_modules/gitbook-plugin-theme-default/src/less/base/mixins.less on line 1, column 1:
1 @import "../../../node_modules/gitbook-markdown-css/less/mixin.less";
2 

FileError: '../../../node_modules/gitbook-markdown-css/less/mixin.less' wasn't found. Tried - /Users/snowdreams1006/.gitbook/versions/3.2.3/node_modules/gitbook-plugin-theme-default/node_modules/gitbook-markdown-css/less/mixin.less,/Users/snowdreams1006/.gitbook/versions/3.2.3/node_modules/node_modules/gitbook-markdown-css/less/mixin.less,../../../node_modules/gitbook-markdown-css/less/mixin.less in /Users/snowdreams1006/.gitbook/versions/3.2.3/node_modules/gitbook-plugin-theme-default/src/less/base/mixins.less on line 1, column 1:
1 @import "../../../node_modules/gitbook-markdown-css/less/mixin.less";
2 

cp: directory _assets/website/fonts/fontawesome does not exist
cp: node_modules/gitbook-logos/output/favicon.ico: No such file or directory
cp: node_modules/gitbook-logos/output/apple-touch-icon-152.png: No such file or directory

Затем продолжайте расширять область установки, на этот раз на всюgitbook-plugin-theme-defaultпровестиnpm installУстановите связанные зависимости, что произойдет на этот раз?

$ npm install

давайте подождем и увидим!

snowdreams1006s-MacBook-Pro:gitbook-plugin-theme-default snowdreams1006$ src/build.sh 
snowdreams1006s-MacBook-Pro:gitbook-plugin-theme-default snowdreams1006$

Командная строка не имеет грязного вывода, и мир стал тихим!

linuxФилософия командной строки говорит нам,Отсутствие новостей - хорошая новость, запустите его снова после установки всех сред проектаsrc/build.shКомандная строка скрипта мгновенно молчит!

С трепетом переходим к тестовому запуску проектаgitbook serveПосле приказа, в тот момент, я почувствовал, что мир замер, и произошло такое чудо?

gitbook-issue-modify-default-fold-test-serve-again-success.png

Наконец удалось, был ли достигнут эффект складывания по умолчанию?

Чтобы проверить, успешно ли реализована ошибка сворачивания по умолчанию, выполните обратный тест, поскольку в меню слева от сворачивания по умолчанию установлено значениеfalse, если установленоtrueЕсли это так, он должен быть расширен по умолчанию.

// Prepare sidebar: state and toggle button
function init() {
    // Close sidebar as default state 
    // gitbook.storage.set('sidebar', false);

    // Open sidebar as default state 
    gitbook.storage.set('sidebar', true);

    // Init last state if not mobile
    if (!platform.isMobile()) {
        toggleSidebar(gitbook.storage.get('sidebar', true), false);
    }

    // Close sidebar after clicking a link on mobile
    $(document).on('click', '.book-summary li.chapter a', function(e) {
        if (platform.isMobile()) toggleSidebar(false, false);
    });
}

После перекомпиляции снова запустите локальный тестовый проект, если он в развернутом состоянии, значитУспех приходит не случайно, а благодаря умению и усилиям!

  • Перекомпилируйте исходный код
$ src/build.sh

/Users/snowdreams1006/.gitbook/versions/3.2.3/node_modules/gitbook-plugin-theme-default

  • Начать локальный проект
$ gitbook serve

/Users/snowdreams1006/Documents/workspace/test

gitbook-issue-modify-default-fold-test-serve-again-verify.png

«Технологическая станция Snow Dream»: тяжелая работа окупается, не мимолетное совпадение, а реальная реальность, поэтому реализована функция складывания левого меню по умолчанию!

Ленивое прямое и ретроспективное резюме

Что, если выGitbookОбычные пользователи или лень выкидывать, то рекомендуется сразу заменитьtheme.jsдокумент:

  • Посмотреть в использованииgitbookИнформация о версии
$ gitbook current
GitBook version is 3.2.3
  • открытый в использованииgitbookМесто установки
$ open ~/.gitbook/versions/3.2.3/node_modules/gitbook-plugin-theme-default/
  • Новый файл заменяет исходный_assets/website/theme.jsдокумент

Вы можете подписаться на общедоступную учетную запись WeChat и ответить на «gitbook», чтобы получить новый перекомпилированный файл.theme.js.

  • Переключитесь на тестовый проект, чтобы убедиться, что складки по умолчанию действуют.
$ gitbook serve

Если вы не боитесь неприятностей и любите метать, то вы можете попробовать перекомпилировать исходные файлы.

  • Посмотреть в использованииgitbookИнформация о версии
$ gitbook current
GitBook version is 3.2.3
  • открытый в использованииgitbookМесто установки
$ open ~/.gitbook/versions/3.2.3/node_modules/gitbook-plugin-theme-default/
  • Установитьtheme-defaultЗависимости, необходимые для проекта темы по умолчанию
$ npm install
  • Установитьbuild.shЗависимости, требуемые сценарием сборки
$ sudo npm install -g browserify uglify-js less less-plugin-clean-css
  • бегатьbuild.shскрипт сборки перекомпилировать
$ src/build.sh
  • Переключитесь на тестовый проект, чтобы убедиться, что складки по умолчанию действуют.
$ gitbook serve

Стоит отметить, что для реализации функции свернутого левого меню по умолчанию требуется только добавить строку кода, но также велика вероятность конфликта с плагином, который был представлен в проекте.sidebarСостояние также может быть изменено неизвестным кодом!

// Prepare sidebar: state and toggle button
function init() {
    // Close sidebar as default state 
    gitbook.storage.set('sidebar', false);

    // Open sidebar as default state 
    // gitbook.storage.set('sidebar', true);

    // Init last state if not mobile
    if (!platform.isMobile()) {
        toggleSidebar(gitbook.storage.get('sidebar', true), false);
    }

    // Close sidebar after clicking a link on mobile
    $(document).on('click', '.book-summary li.chapter a', function(e) {
        if (platform.isMobile()) toggleSidebar(false, false);
    });
}

Наконец, я надеюсь, что эта статья окажется для вас полезной. Когда поисковое программирование становится недоступным, неплохо было бы полагаться на собственные силы.GitbookЕсли у вас возникнут какие-либо проблемы, пожалуйста, оставьте комментарий и сообщите мне, конечно, я не могу гарантировать решение, если однажды я случайно посмотрю исходный код, и он будет решен!

Если вы считаете, что эта статья полезна для вас, добро пожаловатьСтавь лайк и оставляй сообщениеСкажи мне, что твоя поддержка является движущей силой для меня продолжать творить, кстати, возможно, ты захочешь обратить внимание на мой личный публичный аккаунт"Технологическая станция «Снежная мечта»», регулярно обновляйте качественные статьи!

雪之梦技术驿站.png

Категории