如何使用反应需要语法?

我看到很多使用var React = require('react')语法结构化的例子。 当我尝试和使用这个我得到“要求没有定义”。 我如何使用和设置我的静态项目来使用require语法?

更新

实际上,我正在寻找一个webpack / browserifyconfiguration文件,所以我可以很快开始使用React和CommonJS。 我只写了反应的应用程序没有说的构build工具

require不是一个React api,也不是一个原生的浏览器api(现在)。

需求来自commonjs,在node.js中最为着名,如果你已经使用了node.js,你会看到需求无处不在。

由于节点中require的普及,人们已经构build了一些工具,它们将用nodejs风格编写的代码转换为可在浏览器上使用的工具。

使用require有一些好处,它可以帮助您保持代码模块化,并且对于某些项目,它允许您编写同构代码(在客户端和服务器上运行的代码只需要很less的更改)

为了使用require,你将需要使用一个工具,比如webpack或者browserify,我将以browserify为例。

首先创build一个'index.js'

 require('./app.js'); alert('index works'); 

然后创build一个app.js

 alert('app works'); 

接下来安装browserify cli

 npm install -g browserify 

并在你的shell中调用这个命令

 browserify index.js > bundle.js 

现在你将有一个bundle.js,在你的html页面中创build一个

 <script src="bundle.js"></script> 

你应该看到这两个警报运行

现在你可以继续编写代码了,你可以通过做一个代码来在你的代码中添加反应

 npm install react --save 

然后在app.js中需要它

 var React = require('react'); React.createClass({ render: function(){/*Blah Blah Blah*/} }) 

顺便说一句,如果你正在使用webpack,你可以添加到你的webpack.config.jsconfiguration文件以下几行,不需要在你的文件中使用require语句:

  plugins: [ new webpack.ProvidePlugin({ 'React': 'react', '$': 'jquery', '_': 'lodash', 'ReactDOM': 'react-dom', 'cssModule': 'react-css-modules', 'Promise': 'bluebird' }) ], 

这当然不是那么冗长,并不是所有的开发者都喜欢它,但是很高兴知道:)