#reactjs #npm #webpack #react-router
#reactjs #npm #webpack #react-маршрутизатор
Вопрос:
Я пытался войти в react, следуя руководствам по react, и у меня получилось, но когда я начал переходить к следующему шагу и использовать react-router с помощью этого руководства, я каждый раз терпел неудачу!
Когда я следую инструкциям, кажется, что все работает нормально, ошибок на терминале нет, но я их не вижуbundle.js файлы, созданные в папке моего проекта, ни на локальном хосте: 8080, не показывают ничего, кроме следующей ошибки в консоли:
ПОЛУЧИТЬ http://localhost:8080 / net::ОШИБКА_EMPTY_RESPONSE
Я пытался установить npm локально и глобально, но ничего не сработало, так же, как webpack. Также я попытался запустить серверы с использованием webpack с кодом webpack ./index.js bundle.js , который также не работает и выдает следующую ошибку в терминале:
ОШИБКА в нескольких основных модулях не найдена: Ошибка: не удается разрешить модуль ‘bundle.js ‘ в / Users / jafari /Desktop /React-Toturial / руководство по реагированию на маршрутизатор/ уроки /01-настройка @ multi main
В то время как этот код создает bundle.js файл, и если я запущу эту папку через MAMP на локальном хостинге, я смогу увидеть желаемое содержимое руководства, когда я что-либо изменю в App.js это не вступит в силу, пока я не удалю bundle.js и повторите процесс, о котором я упоминал ранее, в терминале, все еще видя следующую ошибку в консоли:
ошибка bundle.js: 49 не обнаружена: не удается найти модуль «bundle.js «
И если я не удалю bundle.js Я получаю эту ошибку в консоли:
Предупреждение: React попытался повторно использовать разметку в контейнере, но контрольная сумма была недопустимой. Обычно это означает, что вы используете серверный рендеринг и разметка, сгенерированная на сервере, была не такой, какую ожидал клиент. В React введена новая разметка для компенсации, которая работает, но вы потеряли многие преимущества серверного рендеринга. Вместо этого выясните, почему генерируемая разметка отличается на клиенте или сервере: (client)
<div data-reactid="(server)<div data-reactid="
Есть идеи? или, в качестве альтернативы, любое предложение или руководство по использованию react-router?
Комментарии:
1. Я не могу повторить вашу ошибку, но вы пробовали сменить порт 8080 на что-нибудь другое? Кроме того, вы не видите bundle.js поскольку при запуске npm используется webpack-dev-server
2. да, я это сделал, хотя после выполнения
npm startпредлагается перейти кlocalhost:80803. это странно… как вы изменили порт? Выполнили ли вы команду webpack-dev-server —port 3000 —inline —content-base ? (вы можете заменить скрипт запуска npm в вашем пакете json этой командой)
4. о, это заставило его работать! изменение порта и запуск проекта с помощью webpack-dev-server вместо запуска npm, если вы опубликуете свой комментарий в качестве ответа, я с радостью приму его, еще раз спасибо
Ответ №1:
Попробуйте изменить порт на что-то другое с помощью команды webpack-dev-server --port 3000 --inline --content-base
Вы также можете заменить npm start скрипт в package.json на эту строку.