#node.js #gatsby #netlify
Вопрос:
Я начинающий актер в «Гэтсби». Согласно Гэтсби Татсу, я разработал и создал свое первое приложение в Гэтсби. Также успешно сгенерирована общая папка. Весь предварительный просмотр хорошо отображается в «http://localhost:8000/» как и ожидалось. Но, когда я непосредственно запускаю index.html файл из общей папки, в браузере(с использованием/без локального хоста) это не предварительный просмотр изображений. Кто-нибудь может сказать мне, почему? Любая помощь была бы очень признательна.
Комментарии:
1. Предоставьте свой
gatsby-config
, чтобы узнать, как вы настроили свою файловую систему
Ответ №1:
В «localhost:8000» предварительный просмотр хорошо отображается с изображениями. Но просто я попытался бежать прямо index.html файл из общей папки. Но это макет без изображений, только визуализация HTML/CSS.
Когда вы получаете доступ localhost:8000
, вы получаете доступ к index.html
своему скомпилированному проекту, но вы не можете изолировать этот файл, потому что у вас есть куча связанных ресурсов (JavaScript, изображения, CSS и т. Д.).
При запуске gatsby build
вы компилируете и объединяете все свои ресурсы (компоненты React, зависимости сторонних разработчиков, основные зависимости Гэтсби, изображения и их обработка и т. Д.) С помощью webpack. Весь этот пакет, окруженный кодом React, выводится в /public
папку.
Из документации:
gatsby build
создает версию вашего сайта с готовыми к производству оптимизациями, такими как упаковка конфигурации, данных и кода вашего сайта, а также создание всех статических HTML-страниц, которые в конечном итоге преобразуются в приложение React.Что вы получаете от успешной сборки?
Когда сборка Gatsby успешно завершена, все, что вам нужно для развертывания сайта, оказывается в
public
папке в корневой папке сайта. Сборка включает в себя уменьшенные файлы, преобразованные изображения, файлы JSON с информацией и данными для каждой страницы, статический HTML для каждой страницы и многое другое.Окончательная сборка-это просто статические файлы, поэтому теперь ее можно развернуть.
Вы можете запустить
gatsby serve
, чтобы проверить вывод из компиляции. Если вы внесете какие-либо новые изменения в исходный код, который хотите просмотреть, вам придется перестроить сайт и запуститьgatsby serve
его снова.
Таким образом, вы можете запустить index.html
файл напрямую, потому что вам будет не хватать некоторых ресурсов, ключей к хорошей работе проекта.
У вас также есть раздел в документах, связанный с развертыванием и размещением, а также некоторые связанные записи в блоге (Развертывание и Размещение соответственно).
gatsby serve
, с другой стороны, просто откройте порт в вашем локальном браузере.
Каким файлом мне нужно поделиться/загрузить на сервер, чтобы предоставить другим просмотр/демонстрацию?
Вся /public
папка.
Комментарии:
1. Спасибо за разъяснение. Это отлично работает при развертывании файлов сайта (общей папки) в корневой папке сайта.
2. Я рад, что ты это понял. Если проблема была решена, пожалуйста, подумайте о принятии/одобрении ответа, чтобы закрыть проблему
Ответ №2:
выполнить: gatsby build
или gatsby serve
, а затем попробуйте открыть свой веб-сайт после выполнения этой команды. Не волнуйтесь, вы все еще можете работать над ним, как обычно, после выполнения команд сборки или обслуживания.
Комментарии:
1. Спасибо за быстрый ответ. На самом деле я так и сделал
gatsby build
, а потомgatsby develop
в cmd. Он успешно сгенерировал общую папку. В «localhost:8000» предварительный просмотр хорошо отображается с изображениями. Но просто я попытался бежать прямо index.html файл из общей папки. Но это макет без изображений, только визуализация HTML/CSS. Каким файлом мне нужно поделиться/загрузить на сервер, чтобы предоставить другим просмотр/демонстрацию?