Question

Screensnot of my project folder 可以请任何帮助我在Sublime开始一个新的简单项目.. 这是我的index.js

import React, {Component} from 'react';
import ReactDOM from 'react-dom';

class Blog extends Component {
  render(){

  const sidebar = (
    <ul>
      {this.props.posts.map((post) =>
        <li key={post.id}>
          {post.title}
        </li>
      )}
    </ul>
  );

  const content = this.props.posts.map((post) =>
    <div key={post.id}>
      <h3>{post.title}</h3>
      <p>{post.content}</p>
    </div>
  );
   return (
     <div>
      {sidebar}
      <hr />

       {content}
     </div>
   );
 }
}

const posts = [
  {id: 1, title: 'Hello World', content: 'Welcome to learning React!'},
  {id: 2, title: 'Installation', content: 'You can install React from npm.'}
];
ReactDOM.render(
  <Blog posts={posts}
     />,
  document.getElementById('root')
);

这是我的package.json

 {
  "name": "mypro",
  "version": "1.0.0",
  "description": "",
  "main": "index.js",
  "scripts": {
    "test": "echo \"Error: no test specified\" && exit 1",
    "start": "react-scripts start",
    "build": "react-scripts build"
  },
  "author": "",
  "license": "ISC",
  "dependencies": {
    "babel": "^6.23.0",
    "babel-cli": "^6.26.0",
    "eslint": "^4.18.2",
    "react": "^16.2.0",
    "react-dom": "^16.2.0"
  },
  "devDependencies": {
    "react-scripts": "^1.1.1"
  }
}

运行此项目是否需要任何东西.. 我试图通过安装react，reactdom等来运行这个项目cmd然后我安装npm by npm i。然后我正在尝试运行项目我的npm run start

in cmd

   > mypro@1.0.0 start E:\Projects\MyPro
> react-scripts start

Could not find a required file.
  Name: index.html
  Searched in: E:\Projects\MyPro\public

npm ERR! Windows_NT 6.3.9600
npm ERR! argv "C:\\Program Files\\nodejs\\node.exe" "C:\\Program Files\\nodejs\\
node_modules\\npm\\bin\\npm-cli.js" "run" "start"
npm ERR! node v7.10.1
npm ERR! npm  v4.2.0
npm ERR! code ELIFECYCLE
npm ERR! errno 1
npm ERR! mypro@1.0.0 start: `react-scripts start`
npm ERR! Exit status 1
npm ERR!
npm ERR! Failed at the mypro@1.0.0 start script 'react-scripts start'.
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 mypro package,
npm ERR! not with npm itself.
npm ERR! Tell the author that this fails on your system:
npm ERR!     react-scripts start
npm ERR! You can get information on how to open an issue for this project with:
npm ERR!     npm bugs mypro
npm ERR! Or if that isn't available, you can get their info via:
npm ERR!     npm owner ls mypro
npm ERR! There is likely additional logging output above.

npm ERR! Please include the following file with any support request:
npm ERR!     C:\Users\keystrokeslnc08\AppData\Roaming\npm-cache\_logs\2018-03-15
T08_39_46_854Z-debug.log

这是我的索引。 HTML页面

<!DOCTYPE html>
<html lang="en">
  <head>
    <title>MyProject</title>
  </head>
  <body>
    <h1>hlo everyone</h1>
    <div id="app"></div>
    <script src="/bundle.js"></script>
  </body>
</html>

这个错误显示..接下来我会做什么？

Answer 1

您应该在您的package.json

中将react-scripts作为devDependencies

npm install --save-dev react-scripts

应该更好

Answer 2

启动reactjs简单项目的最佳方式

首先安装nodejs（您需要一台服务器在本地运行您的应用程序）

打开命令提示符

1：npm install -g create-react-app

2：create-react-app your-app-name

转到目录路径（例如：cd your-app-name）

最后：npm start

它是

React JS初学者程序错误

2 个答案: