我的 npm start for react 不起作用

Question

我正在尝试学习 react，但我无法启动 npm。这是我的代码：

错误：

user:~/reactApp$ sudo npm start

> reactapp@1.0.0 start /home/user/reactApp
> webpack-dev-server --port 3000 --inline --content-base .

events.js:136
      throw er; // Unhandled 'error' event
      ^

Error: listen EADDRNOTAVAIL 172.27.27.227:3000
    at Object._errnoException (util.js:1031:13)
    at _exceptionWithHostPort (util.js:1052:20)
    at Server.setupListenHandle [as _listen2] (net.js:1350:19)
    at listenInCluster (net.js:1408:12)
    at GetAddrInfoReqWrap.doListen [as callback] (net.js:1523:7)
    at GetAddrInfoReqWrap.onlookup [as oncomplete] (dns.js:102:10)
npm ERR! code ELIFECYCLE
npm ERR! errno 1
npm ERR! reactapp@1.0.0 start: `webpack-dev-server --port 3000 --inline --content-base .`
npm ERR! Exit status 1
npm ERR! 
npm ERR! Failed at the reactapp@1.0.0 start script.
npm ERR! This is probably not a problem with npm. There is likely additional logging output above.

npm ERR! A complete log of this run can be found in:
npm ERR!     /home/user/.npm/_logs/2018-02-19T10_56_13_668Z-debug.log

日志：

    0 info it worked if it ends with ok
1 verbose cli [ '/usr/local/bin/node', '/usr/local/bin/npm', 'start' ]
2 info using npm@5.6.0
3 info using node@v9.2.0
4 verbose run-script [ 'prestart', 'start', 'poststart' ]
5 info lifecycle reactapp@1.0.0~prestart: reactapp@1.0.0
6 info lifecycle reactapp@1.0.0~start: reactapp@1.0.0
7 verbose lifecycle reactapp@1.0.0~start: unsafe-perm in lifecycle true
8 verbose lifecycle reactapp@1.0.0~start: PATH: /usr/local/lib/node_modules/npm/node_modules/npm-lifecycle/node-gyp-bin:/home/user/reactApp/node_modules/.bin:/usr/local/sbin:/usr/local/bin:/usr/sbin:/usr/bin:/sbin:/bin:/snap/bin
9 verbose lifecycle reactapp@1.0.0~start: CWD: /home/user/reactApp
10 silly lifecycle reactapp@1.0.0~start: Args: [ '-c',
10 silly lifecycle   'webpack-dev-server --port 3000 --inline --content-base .' ]
11 silly lifecycle reactapp@1.0.0~start: Returned: code: 1  signal: null
12 info lifecycle reactapp@1.0.0~start: Failed to exec start script
13 verbose stack Error: reactapp@1.0.0 start: `webpack-dev-server --port 3000 --inline --content-base .`
13 verbose stack Exit status 1
13 verbose stack     at EventEmitter.<anonymous> (/usr/local/lib/node_modules/npm/node_modules/npm-lifecycle/index.js:285:16)
13 verbose stack     at EventEmitter.emit (events.js:159:13)
13 verbose stack     at ChildProcess.<anonymous> (/usr/local/lib/node_modules/npm/node_modules/npm-lifecycle/lib/spawn.js:55:14)
13 verbose stack     at ChildProcess.emit (events.js:159:13)
13 verbose stack     at maybeClose (internal/child_process.js:943:16)
13 verbose stack     at Process.ChildProcess._handle.onexit (internal/child_process.js:220:5)
14 verbose pkgid reactapp@1.0.0
15 verbose cwd /home/user/reactApp
16 verbose Linux 4.4.0-104-generic
17 verbose argv "/usr/local/bin/node" "/usr/local/bin/npm" "start"
18 verbose node v9.2.0
19 verbose npm  v5.6.0
20 error code ELIFECYCLE
21 error errno 1
22 error reactapp@1.0.0 start: `webpack-dev-server --port 3000 --inline --content-base .`
22 error Exit status 1
23 error Failed at the reactapp@1.0.0 start script.
23 error This is probably not a problem with npm. There is likely additional logging output above.
24 verbose exit [ 1, true ]

~

package.json

  {
  "name": "reactapp",
  "version": "1.0.0",
  "description": "",
  "main": "index.js",
  "scripts": {
    "start": "webpack-dev-server --port 3000 --inline --content-base ."
  },
  "author": "",
  "license": "ISC",
  "dependencies": {
    "babel-core": "^6.26.0",
    "babel-loader": "^7.1.2",
    "react": "^16.2.0",
    "react-dom": "^16.2.0",
    "webpack": "^3.11.0"
  },
  "devDependencies": {
    "webpack-dev-server": "^2.11.1"
  }
}

webpack.config.js

var config = {
   entry: './main.js',
   output: {
      path:'/',
      filename: 'index.js',
   },
   devServer: {
      inline: true,
      port: 3000
   },
   module: {
      loaders: [
         {
            test: /\.jsx?$/,
            exclude: /node_modules/,
            loader: 'babel-loader',
            query: {
               presets: ['es2015', 'react']
            }
         }
      ]
   }
}
module.exports = config;

试过了，但找不到任何解决方案，谁能帮我理解发生了什么，错误在哪里？如果你们都需要更多信息来调试这个问题，请告诉我。谢谢

编辑：已检查，通过更改端口

Answer 1

从错误中，您似乎正在尝试使用已在使用的端口。您必须要么更改端口，要么必须终止正在使用该端口的进程。

您可以像这样更改端口：

  "scripts": {
    "start": "webpack-dev-server --port 4000 --inline --content-base ."
  },

或者像lsof -i :3000那样找到谁在监听3000端口，然后杀死进程kill <Process ID>。我希望这会有所帮助。