javascript - 设置 React.js 和 Babel

Question

我正在尝试在 Ubuntu 上使用 React.js 进行 Web 开发项目，但我不知道如何设置它。请注意，我是初学者，之前只使用过 Javascript 和 JQuery。我试着按照说明 here ，我想我已经达到了应该配置 Babel 的地步。在这里，在我运行的终端中

npm install --save-dev babel-cli babel-preset-react babel-preset-es2015

echo '{ "presets": ["react", "es2015"] }' > .babelrc

echo 'console.log([1, 2, 3].map(n => n + 1))' > index.js

./node_modules/.bin/babel index.js

我得到的输出是:

"use strict";

console.log([1, 2, 3].map(function (n) {
  return n + 1;
}));

这很好，但我希望能够像往常一样运行带有相应 .js 文件的 html 文件。实际上，当我写类似的东西时

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

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

使用相应的 html 文件，我只会收到控制台错误(意外的 token 插入或其他)。显然，我还没有设法安装 Ecmascript/JSX 或其他任何东西，而且我真的不知道自己在做什么。

所以，我想我的问题是，任何人都可以帮助我详细解释如何开始吗？我只想能够用 React 编写 Javascript，并创建一个简单的网页。谢谢!

Answer 1

开始使用 React 不需要很多东西。

要使用 React，您只需包含 react 和 reactdom。 就是这样。

ReactDOM.render(
  React.createElement('h1', {}, "Hi! This is the simplest way to get started with ReactJS"),
  document.getElementById('only-react')
);

<script src="https://cdn.jsdelivr.net/react/0.14.0-rc1/react.js"></script>
<script src="https://cdn.jsdelivr.net/react/0.14.0-rc1/react-dom.js"></script>

<div id="only-react"></div>

这些行应该让您开始使用 React，而没有您在大多数教程中会发现的所有过时软件。