我的npm start for react教程项目无效

时间:2015-12-24 18:43:57

标签: reactjs npm webpack webpack-dev-server

我正在尝试学习反应并跟踪来自https://egghead.io/lessons/react-react-fundamentals-development-environment-setup?series=react-fundamentals的egghead视频,以设置我的开发环境。但是,在安装第一个视频中提到的相关模块之后,当我尝试npm start时,它会抛出以下错误:

Shaileshs-MacBook-Pro:react-project shailesh$ npm start

> shaileshgupta@1.0.0 start /Users/shaileshgupta/react-project
> webpack-dev-server

/Users/shaileshgupta/react-project/webpack.config.js:3
  output: {
  ^^^^^^

SyntaxError: Unexpected identifier
    at exports.runInThisContext (vm.js:53:16)
    at Module._compile (module.js:374:25)
    at Object.Module._extensions..js (module.js:405:10)
    at Module.load (module.js:344:32)
    at Function.Module._load (module.js:301:12)
    at Module.require (module.js:354:17)
    at require (internal/module.js:12:17)
    at module.exports (/Users/shaileshgupta/react-project/node_modules/webpack/bin/convert-argv.js:80:13)
    at Object.<anonymous> (/Users/shaileshgupta/react-project/node_modules/webpack-dev-server/bin/webpack-dev-server.js:55:48)
    at Module._compile (module.js:398:26)

npm ERR! Darwin 15.0.0
npm ERR! argv "/usr/local/Cellar/node/5.3.0/bin/node" "/usr/local/bin/npm" "start"
npm ERR! node v5.3.0
npm ERR! npm  v3.3.12
npm ERR! code ELIFECYCLE
npm ERR! shaileshgupta@1.0.0 start: `webpack-dev-server`
npm ERR! Exit status 1
npm ERR!
npm ERR! Failed at the shaileshgupta@1.0.0 start script 'webpack-dev-server'.
npm ERR! Make sure you have the latest version of node.js and npm installed.
npm ERR! If you do, this is most likely a problem with the shaileshgupta package,
npm ERR! not with npm itself.
npm ERR! Tell the author that this fails on your system:
npm ERR!     webpack-dev-server
npm ERR! You can get their info via:
npm ERR!     npm owner ls shaileshgupta
npm ERR! There is likely additional logging output above.

npm ERR! Please include the following file with any support request:
npm ERR!     /Users/shaileshgupta/react-project/npm-debug.log

我撞了我的头,试图调试它,但找不到任何可能的解决方案。谁能帮我理解这里发生了什么?如果您需要更多信息,请与我们联系。

4 个答案:

答案 0 :(得分:3)

您可能需要安装webpack dev服务器

npm install webpack-dev-server --save-dev

答案 1 :(得分:1)

发布整个代码,您可能在module.exports对象的第一个属性

之后错过了逗号

答案 2 :(得分:0)

如果您的文件扩展名为.jsx,请尝试将其更改为.js。当我遇到同样的问题时,这对我有用。

答案 3 :(得分:0)

我们大多数时候会复制粘贴教程中的webpack.config.js文件。代码的某些部分在webpack.config.js

中将如下所示
devServer: {
  inline: true,
  port: 8080   }

从命令提示符运行npm start时,您可能尚未安装webpack-dev-server。如果是这样的话,请运行以下行

npm install webpack-dev-server -g

在少数情况下会安装webpack-dev-server,但在8080端口中会运行其他内容。
在这种情况下,只需更改webpack.config.js文件中的端口号即可。下面是更新的代码。

 devServer: {
  inline: true,
  port: 4000   }

那可以解决你的问题。

Click here for more about this issue