问题描述
我正在尝试在 Ubuntu 上将 React.js 用于 Web 开发项目,但我不知道如何设置它.请注意,我是初学者,之前只在 JQuery 中使用过 Javascript.我尝试按照此处的说明进行操作,我想我已经做到了我应该配置 Babel 的地方.在这里,我在终端中运行
I'm trying to use React.js on Ubuntu for a web dev project, but I can't figure out how to set it up. Please note that I am a beginner, and have only used Javascript with JQuery before. I tried to follow the instructions here, and I think I made it up to the point where I'm supposed to configure Babel. Here, in the terminal I ran
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 文件.事实上,当我写一些像
This is great and all, but I want to be able to run an html file with a corresponding .js file, as I would normally. As it is, when I write something like
import React from 'react';
import ReactDOM from 'react-dom';
ReactDOM.render(
<h1>Hello, world!</h1>,
document.getElementById('root')
);
使用相应的 html 文件,我只会收到控制台错误(意外的令牌插入或其他内容).显然,我还没有设法安装 Ecmascript/JSX 或其他任何东西,我真的不知道我在做什么.
with a corresponding html file, I just get console errors (Unexpected Token insert or something). Obviously, I haven't managed to install Ecmascript/JSX or whatever, and I don't really know what I'm doing.
所以,我想我的问题是,谁能帮我详细解释一下如何开始?我只想能够用 React 编写 Javascript,并创建一个简单的网页.谢谢!
So, I guess my question is, can anyone help me with a detailed explanation of how to get started? I just want to be able to write Javascript with React, and create a simple webpage. Thank you!
推荐答案
开始使用 React
不需要很多东西.
You dont need lots of stuff to start with React
.
你需要使用 react 的只是包括 react
和 reactdom
.就是这样.
All you need to use react is include react
and reactdom
. Thats' it.
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,而不需要你会在大多数教程中找到的所有英国媒体报道.
These lines should get you started with just React without all the bloatware you will find in most of the tutorials.
这篇关于设置 React.js 和 Babel的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持!