Как сделать сервер webpack dev запущенным на порту 80 и 0.0.0.0, чтобы сделать его общедоступным?

Я новичок во всем мире nodejs/реагий, поэтому извиняюсь, если мой вопрос звучит глупо. Так что я играю с реактивом.

Всякий раз, когда я npm start он всегда запускается на localhost:8080.

Как я могу изменить его для запуска на 0.0.0.0:8080 чтобы сделать его общедоступным? Я пытался прочитать исходный код в репозитории выше, но не смог найти файл, который выполняет эту настройку.

Кроме того, чтобы добавить к этому - как я могу заставить его работать на порту 80 если это вообще возможно?

ОТВЕТЫ

Ответ 1

Что-то вроде этого сработало для меня. Я предполагаю, что это должно сработать для вас.

Запустите webpack-dev, используя этот

webpack-dev-server --host 0.0.0.0 --port 80

И установите это в файле webpack.config.js

entry: [
    'webpack-dev-server/client?http://0.0.0.0:80',
     config.paths.demo
 ]

Примечание Если вы используете горячую загрузку, вам придется это сделать.

Запустите webpack-dev, используя этот

webpack-dev-server --host 0.0.0.0 --port 80

И установите это в файле webpack.config.js

entry: [
    'webpack-dev-server/client?http://0.0.0.0:80',
    'webpack/hot/only-dev-server',
     config.paths.demo
 ],

....
plugins:[new webpack.HotModuleReplacementPlugin()]

Ответ 2

Вот как я это сделал, и, похоже, он работает очень хорошо.

В файле webpack.config.js добавьте следующее:

devServer: {
    inline:true,
    port: 8008
  },

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

Ответ 3

Настройте webpack (в webpack.config.js) с помощью

devServer: {
  // ...
  host: '0.0.0.0',
  port: 80,
  // ...
}

Ответ 4

Я новичок в разработке JavaScript и ReactJS. Мне не удалось найти ответ, который работает для меня, пока не выясните его, просмотрев код сценариев реакции. Используя ReactJS 15.4.1+, используя сценарии реагирования, вы можете начать с пользовательского хоста и/или порта с помощью переменных среды:

HOST='0.0.0.0' PORT=8080 npm start

Надеюсь, это поможет новичкам, как я.

Ответ 5

После меня работали -

1) В Package.json добавьте это:

"scripts": {
    "dev": "webpack-dev-server --progress --colors"
}

2) В webpack.config.js добавьте это в объект конфигурации, который вы экспортируете:

devServer: {
    host: "GACDTL001SS369k", // Your Computer Name
    port: 8080
}

3) Теперь введите тип терминала: npm run dev

4) После того, как №3 будет компилироваться и готово, просто перейдите к своему браузеру и введите адрес как http://GACDTL001SS369k:8080/

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

PS: GACDTL001SS369k было моим именем компьютера, поэтому замените его на свой компьютер.

Ответ 6

Если вы находитесь в приложении React, созданном с помощью приложения create-react-app, перейдите в свой package.json и измените

"start": "react-scripts start",

to... (unix)

"start": "PORT=80 react-scripts start",

или... (выиграть)

"start": "set PORT=3005 && react-scripts start"

Ответ 7

После работы для меня в конфигурационном файле JSON:

"scripts": {
  "start": "webpack-dev-server --host 127.0.0.1 --port 80 ./js/index.js"
},

Ответ 8

Я попробовал решения выше, но не повезло. Я заметил эту строку в своем проекте package.json:

 "bin": {
"webpack-dev-server": "bin/webpack-dev-server.js"

},

Я посмотрел на bin/webpack-dev-server.js и нашел эту строку:

.describe("port", "The port").default("port", 8080)

Я изменил порт на 3000. Немного грубой силы, но это сработало для меня.

Ответ 9

в package.json Я нашел

"scripts": {"start": "node./node_modules/webpack-dev-server/bin/webpack-dev-server.js",

проверяя содержимое файла конфигурации, на который ссылается.

vim./node_modules/webpack-dev-server/bin/webpack-dev-server.js

("port", "The port"). default ("port", 8080).describe("public", "Public hostname/ip address of server").describe("host", "Hostname"/ip-адрес, на который сервер будет привязываться к "). default (" host "," localhost ");

измените последнюю строку выше с localhost на 0.0.0.0

.describe("host", "Имя хоста /ip-адрес, на который сервер будет привязываться"). default ("host", "0.0.0.0");

Я попытался изменить порт по умолчанию от 8080 до 80, но дал мне это сообщение об ошибке.

r $ npm начало

[email protected] start/home/ubuntu/ReduxSimpleStarter node./node_modules/webpack-dev-server/bin/webpack-dev-server.js

events.js: 183 throw er; // Необработанное событие 'error'

У меня раньше не было серверов, работающих на номера портов <8000.

пока я запускаю сервер npm и подключаюсь к нему на экземпляре AWS EC2 ubuntu по этому адресу.

Http://xx.xx.xx.xx: 8080/WebPack-DEV-сервер/

но вместо загрузки моей страницы я получаю эту ошибку :(

Недопустимый заголовок узла

Ответ 10

Я боролся с некоторыми другими ответами. (Моя настройка: я запускаю npm run dev с webpack 3.12.0 после создания моего проекта с помощью vue init webpack на vue init webpack Ubuntu 18.04 под Windows. У меня есть vagrant, настроенный для перенаправления порта 3000 на хост.)

  • К сожалению, установка npm run dev --host 0.0.0.0 --port 3000 не работала - она все еще работала на localhost: 8080.
  • Кроме того, файл webpack.config.js не существует, и его создание тоже не помогло.
  • Затем я обнаружил, что файлы конфигурации теперь находятся в build/webpack.dev.conf.js (и build/webpack.base.conf.js и build/webpack.prod.conf.js). Тем не менее, изменение этих файлов не было хорошей идеей, потому что они фактически читают HOST и PORT из process.env.

Поэтому я искал, как установить переменные process.env и добился успеха, выполнив команду:

HOST=0.0.0.0 PORT=3000 npm run dev

После этого я, наконец, получаю "Ваше приложение запущено здесь: http://0.0.0.0:3000 ", и, наконец, я могу увидеть его, перейдя к localhost:3000 с хост-машины.

РЕДАКТИРОВАТЬ: нашел другой способ сделать это, отредактировав хост и порт dev в config/index.js.

Ответ 11

Для меня: изменение прослушивания хоста сработало:

.listen(3000, 'localhost', function (err, result) {
        if (err) {
            console.log(err);
        }
        console.log('Listening at localhost:3000');
    });

был изменен на:

.listen(3000, '0.0.0.0', function (err, result) {
        if (err) {
            console.log(err);
        }
        console.log('Listening at localhost:3000');
    });

и сервер начал слушать на 0.0.0.0

Ответ 12

Я попытался это легко использовать другой порт:

PORT=80 npm run dev