为什么 webpack dev 服务器在从 gitpod 终端启动时不会自动重新加载更改页面?
Why does webpack dev server not auto reload page on changes when started from gitpod terminal?
项目是https://github.com/easychessanimations/htmltest。
我研究了所有与 webpack dev server auto page reload 相关的答案。
当我在本地执行 npm run start
时,它会在源更改时自动构建/重新加载页面,因此开发服务器配置必须正确:
devServer: {
contentBase: path.join(__dirname, "dist"),
port: 8080,
hot: true,
watchContentBase: true,
watchOptions: {
poll: true
},
},
当我从 gitpod 终端在线执行相同操作时,页面会自动重建,但不会自动重新加载(无论我是在 gitpod window 还是在完整的浏览器选项卡中打开它) .如果我手动重新加载,更改会反映出来。
我需要什么额外的配置才能让它在 gitpod 下工作?
你可以使用这个 link 来玩弄它(当然首先你需要用你的 github 帐户授权 gitpod):
https://gitpod.io/#https://github.com/easychessanimations/htmltest
在 gitpod 终端输入:
npm install
npm run build
npm run start
Webpack HMR 需要相应配置。
将以下三个属性添加到 webpack.conf 就可以了:
devServer: {
// make HMR work - start
host: '0.0.0.0',
disableHostCheck: true,
public: require('child_process').execSync('gp url 8080').toString().trim(),
// make HMR work - end
contentBase: path.join(__dirname, "dist"),
port: 8080,
hot: true,
watchContentBase: true,
watchOptions: {
poll: true
},
},
这是工作快照:
https://gitpod.io/#snapshot/daa14130-2f44-430d-93ab-2d4ed980fc2c
项目是https://github.com/easychessanimations/htmltest。
我研究了所有与 webpack dev server auto page reload 相关的答案。
当我在本地执行 npm run start
时,它会在源更改时自动构建/重新加载页面,因此开发服务器配置必须正确:
devServer: {
contentBase: path.join(__dirname, "dist"),
port: 8080,
hot: true,
watchContentBase: true,
watchOptions: {
poll: true
},
},
当我从 gitpod 终端在线执行相同操作时,页面会自动重建,但不会自动重新加载(无论我是在 gitpod window 还是在完整的浏览器选项卡中打开它) .如果我手动重新加载,更改会反映出来。
我需要什么额外的配置才能让它在 gitpod 下工作?
你可以使用这个 link 来玩弄它(当然首先你需要用你的 github 帐户授权 gitpod):
https://gitpod.io/#https://github.com/easychessanimations/htmltest
在 gitpod 终端输入:
npm install
npm run build
npm run start
Webpack HMR 需要相应配置。 将以下三个属性添加到 webpack.conf 就可以了:
devServer: {
// make HMR work - start
host: '0.0.0.0',
disableHostCheck: true,
public: require('child_process').execSync('gp url 8080').toString().trim(),
// make HMR work - end
contentBase: path.join(__dirname, "dist"),
port: 8080,
hot: true,
watchContentBase: true,
watchOptions: {
poll: true
},
},
这是工作快照:
https://gitpod.io/#snapshot/daa14130-2f44-430d-93ab-2d4ed980fc2c