안녕하세요 - 세계 reactjs 설치 가이드가 작동하지 않습니다

나는 React.js에 완전히 새롭기 때문에 tutorial page에서 배우기 시작했습니다. 터미널에서안녕하세요 - 세계 reactjs 설치 가이드가 작동하지 않습니다

에서라도 시에라 v10.12가, 내가 한 :

npm install -g create-react-app 
create-react-app hello-world 
cd hello-world 
npm start

을 다음, 나는 App.js이되고 수정 :

import React from 'react'; 
import ReactDOM from 'react-dom'; 

ReactDOM.render(
    <h1>Hello, world!</h1>, 
    document.getElementById('root') 
);

을 App.js을 저장 한 후, 아무 것도 페이지에 나타나지 않습니다. Screenshot

index.html을

<!doctype html> 
<html lang="en"> 
    <head> 
    <meta charset="utf-8"> 
    <meta name="viewport" content="width=device-width, initial-scale=1"> 
    <link rel="shortcut icon" href="/favicon.ico"> 
    <!-- 
     Notice the use of in the tag above. 
     It will be replaced with the URL of the `public` folder during the build. 
     Only files inside the `public` folder can be referenced from the HTML. 

     Unlike "/favicon.ico" or "favicon.ico", "/favicon.ico" will 
     work correctly both with client-side routing and a non-root public URL. 
     Learn how to configure a non-root public URL by running `npm run build`. 
    --> 
    <title>React App</title> 
    </head> 
    <body> 
    <div id="root"></div> 
    <!-- 
     This HTML file is a template. 
     If you open it directly in the browser, you will see an empty page. 

     You can add webfonts, meta tags, or analytics to this file. 
     The build step will place the bundled scripts into the <body> tag. 

     To begin the development, run `npm start`. 
     To create a production bundle, use `npm run build`. 
    --> 
    <script type="text/javascript" src="/static/js/bundle.js"></script></body> 
</html>

무엇이 잘못되었는지 확실하지. 도와주세요. 감사!

출처

2016-10-27 L Zh

'index.html'의 내용을 보여줄 수 있습니까? – nem035

메인 포스트에 추가되었습니다. 감사! –

npm 설치를 수행 했습니까? –

여기서 잘못된 부분이 있습니다. App.js는 React 구성 요소이고 index.js는 실제로 DOM 렌더링을 처리하는 파일입니다. 다음은 원래하는 index.js

import React from 'react'; 
import ReactDOM from 'react-dom'; 
import App from './App'; 
import './index.css'; 

ReactDOM.render(
    <App />, 
    document.getElementById('root') 
);

이 구성 요소로 응용 프로그램을 수입하고 렌더링을 시도하고있다. index.js는 기본적으로 초기 DOM 렌더링을 처리하는 것이므로 App.js의 index.js 사본을 기본적으로 만들었습니다. 이것에

변화 App.js :

import React, { Component } from 'react'; 
import logo from './logo.svg'; 
import './App.css'; 

class App extends Component { 
    render() { 
    return <h1>Hello, world!</h1> 
    } 
} 

export default App;

하거나하는 index.js에서

복사하여 이전에 작성한 코드를 붙여 넣습니다

ou는 두 가지 옵션이 있습니다.

출처

2016-10-27 16:47:08 finalfreq

작동했습니다! 설명 주셔서 대단히 감사합니다! –

안녕하세요 - 세계 reactjs 설치 가이드가 작동하지 않습니다

답변

관련 문제