Ответ 1
- Новый ответ -
С тех пор как я впервые ответил на этот вопрос, я начал использовать другое решение.
С новым решением вы отправляете запросы непосредственно на веб-сервер nginx/apache. Веб-сервер работает как прокси-сервер и перенаправляет запросы либо на webpack-dev-server, либо на приложение php. Приложение php раскрывает все свои конечные точки в /api/<actual/endpoint> (см. непроверенные примеры конфигураций ниже, где localhost:8080 относится к webpack-dev-server).
Конфигурация Apache (http://php-application относится к отдельному VirtualHost, здесь не показан)
<VirtualHost *:80>
ServerName my-website.dev
ProxyPass / http://localhost:8080/
ProxyPassReverse / http://localhost:8080/
ProxyPassMatch ^\/api\/.+$ http://php-application/
ProxyPassReverse / http://php-application/
</VirtualHost>
Конфигурация Nginx (PHP7.1)
server {
listen 80;
server_name my-website.dev;
root /path/to/backend/public;
index index.php index.html;
location / {
proxy_http_version 1.1;
proxy_set_header Upgrade $http_upgrade;
proxy_set_header Connection "upgrade";
proxy_pass http://localhost:8080;
}
location ~ ^/api/.+$ {
try_files /index.php =404;
fastcgi_split_path_info ^(.+\.php)(/.+)$;
fastcgi_pass unix:/run/php/php7.1-fpm.sock;
fastcgi_index index.php;
fastcgi_param SCRIPT_FILENAME $document_root$fastcgi_script_name;
include fastcgi_params;
}
}
- Старый ответ -
Я знаю, что вы заставили это работать, но я наткнулся на этот пост, когда сам столкнулся с этой проблемой и после ее решения хотел поделиться своим решением.
Я не использую Laravel, но у меня есть серверная часть PHP на сервере Apache. Мне только нужно было внести два изменения в webpack.config.js, чтобы заставить работать сервер разработки webpack:
Изменить это
publicPath: __dirname + '<path_to_bundle>'
Для этого (примечание: http://localhost:8080 - это URL-адрес webpack-dev-server)
publicPath: "http://localhost:8080/<path_to_bundle>/"
И добавьте некоторые настройки прокси для пересылки запросов в бэкэнд php
devServer: {
proxy: [
{
path: /./,
target: "http://<php_backend_url>"
}
]
}
Обратите внимание, что свойство path является регулярным выражением, которое соответствует всему. Это приведет к тому, что все запросы будут перенаправлены на сервер php. Возможно, вам придется изменить регулярное выражение, если вы хотите, чтобы интерфейс обрабатывал некоторые запросы.
В документации сервера webpack также говорится, что вы должны изменить атрибут src тегов скрипта на http://localhost:8080/<path_to_bundle>/<bundleFilename.js>, но это необходимо только для меня, если я хочу получить доступ к приложению из его старого (apache) URL вместо localhost: 8080 когда используя флаг --inline.
Чтобы заставить горячую замену модуля работать с реагировать:
Установите реагирующий горячий загрузчик:
npm install --save-dev react-hot-loaderДобавьте загрузчик в ваш webpack.config.js вместе с другими вашими загрузчиками как
react-hot
Теперь все, что вам нужно сделать, это запустить webpack-dev-server --inline --hot и, надеюсь, вы золотые.