javascript - AWS Amplify 入门教程中使用 JavaScript 的 Webpack 服务器无法工作

Question

我按照此处描述的具体步骤进行操作:

https://aws-amplify.github.io/docs/js/start?platform=purejs

最多

Open a browser and navigate to http://localhost:8080. The ‘Add data’ button does not work yet. We’ll work on that next.

但是，在Chrome中访问localhost并不会显示任何内容。重新加载时，我可以在 Chrome 中看到以下 3 个不同的错误:

ERR_CONNECTION_RESET

ERR_EMPTY_RESPONSE

ERR_SOCKET_NOT_CONNECTED

我尝试了不同的配置，包括公共(public)路径等，但到目前为止没有任何效果。

npm start 后的输出看起来正常:

➜  amplify-js-app npm start

> amplify-js-app@1.0.0 start /Users/richardsteinmetz/code/src/untracked/amplify-js-app
> webpack && webpack-dev-server --mode development

Hash: 69b3a23591f47068a3cc
Version: webpack 4.41.2
Time: 49ms
Built at: 26/11/2019 11:12:39
         Asset      Size  Chunks             Chunk Names
    index.html  1.62 KiB          [emitted]
main.bundle.js  28.8 KiB    main  [emitted]  main
Entrypoint main = main.bundle.js
[./src/app.js] 0 bytes {main} [built]
ℹ ｢wds｣: Project is running at http://localhost:8080/
ℹ ｢wds｣: webpack output is served from /
ℹ ｢wds｣: Content not from webpack is served from ./dist
ℹ ｢wdm｣: Hash: 64e4b1c18737d7ef1928
Version: webpack 4.41.2
Time: 298ms
Built at: 26/11/2019 11:12:40
         Asset      Size  Chunks             Chunk Names
    index.html  1.62 KiB          [emitted]
main.bundle.js   390 KiB    main  [emitted]  main
Entrypoint main = main.bundle.js
[0] multi (webpack)-dev-server/client?http://localhost:8080 (webpack)/hot/dev-server.js ./src/app.js 52 bytes {main} [built]
[./node_modules/webpack-dev-server/client/index.js?http://localhost:8080] (webpack)-dev-server/client?http://localhost:8080 4.29 KiB {main} [built]
[./node_modules/webpack-dev-server/client/overlay.js] (webpack)-dev-server/client/overlay.js 3.51 KiB {main} [built]
[./node_modules/webpack-dev-server/client/socket.js] (webpack)-dev-server/client/socket.js 1.53 KiB {main} [built]
[./node_modules/webpack-dev-server/client/utils/createSocketUrl.js] (webpack)-dev-server/client/utils/createSocketUrl.js 2.89 KiB {main} [built]
[./node_modules/webpack-dev-server/client/utils/log.js] (webpack)-dev-server/client/utils/log.js 964 bytes {main} [built]
[./node_modules/webpack-dev-server/client/utils/reloadApp.js] (webpack)-dev-server/client/utils/reloadApp.js 1.59 KiB {main} [built]
[./node_modules/webpack-dev-server/client/utils/sendMessage.js] (webpack)-dev-server/client/utils/sendMessage.js 402 bytes {main} [built]
[./node_modules/webpack-dev-server/node_modules/strip-ansi/index.js] (webpack)-dev-server/node_modules/strip-ansi/index.js 161 bytes {main} [built]
[./node_modules/webpack/hot sync ^\.\/log$] (webpack)/hot sync nonrecursive ^\.\/log$ 170 bytes {main} [built]
[./node_modules/webpack/hot/dev-server.js] (webpack)/hot/dev-server.js 1.59 KiB {main} [built]
[./node_modules/webpack/hot/emitter.js] (webpack)/hot/emitter.js 75 bytes {main} [built]
[./node_modules/webpack/hot/log-apply-result.js] (webpack)/hot/log-apply-result.js 1.27 KiB {main} [built]
[./node_modules/webpack/hot/log.js] (webpack)/hot/log.js 1.34 KiB {main} [built]
[./src/app.js] 0 bytes {main} [built]
    + 20 hidden modules
ℹ ｢wdm｣: Compiled successfully.

桌面(请填写以下信息): - 操作系统:MaOS - 浏览器 Chrome、Safari

Answer 1

尝试在 webpack devServer 配置中专门设置端口:

 devServer: {
    contentBase: "./dist",
    overlay: true,
    hot: true,
    port: 9000
    }