it-swarm.com.ru

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

Я новичок во всем мире nodejs/Reactionjs, поэтому извиняюсь, если мой вопрос звучит глупо. Поэтому я играю с этим приложением реагировать здесь: https://github.com/bebraw/reactabular

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

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

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

Благодарю.

158
90abyss

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

Запустите 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()]
185
Bhargav Ponnapalli

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

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

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

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

114
bkane56

Сконфигурируйте webpack (в webpack.config.js) с помощью:

devServer: {
  // ...
  Host: '0.0.0.0',
  port: 80,
  // ...
}
51
Beder Acosta Borges

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

Host='0.0.0.0' PORT=8080 npm start

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

18
Anonymous

Следующее сработало для меня - 

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

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

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

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

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

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

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

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

9
Sumeet

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

"start": "react-scripts start",

к ... ( unix )

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

или ... ( победа )

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

4
R01010010

Следующее работает для меня в файле конфигурации JSON:

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

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

PORT=80 npm run dev
0
kyrre

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

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

},

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

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

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

0
Sparky1

Я боролся с некоторыми другими ответами. (Моя настройка: я запускаю npm run dev с webpack 3.12.0, после создания моего проекта с использованием 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.jsbuild/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 Host и порт в config/index.js.

0
krubo

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

.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

0
Ankush