马上开始写 react & ES6 --- 基于gulp 和 Babel 的脚手架

我对 react 很有兴趣,但是我发现想写 react 不容易。

我需要在开始写代码之前做很多准备工作,我需要编译jsx文件,引入react等等,而最新的react示例,有鼓励ES6来书写代码,可以用上ES6的一些闪亮的新特性,所以与其每次写代码配置工具花很多时间,不如写成一个github repo,每次只需要 clone下来,会方便很多。

于是我马上动手,有了这个react-babel-gulp-boilerplate,本意是自己用,现在也推荐给大家,也希望大家积极指出不足,提出建议,当然如果有更好的方案,也可以推荐给我。

特点

  • 使用了Babel,这样可以用ES6来书写react代码

  • 使用了Gulp和browserify,可以使用Commonjs规范来写代码,当然更推荐使用ES6 module。

  • 使用了watchify,在gulp watch之后浏览器会自动打开网页,同时在修改代码之后会自动刷新代码,方便开发和调试。

如何使用

首先,你需要安装node和npm(我相信你一定已经安装了),然后你可以按照下面的命令来clone这个repo,同时安装依赖:

$ git clone git@github.com:mrdream24/react-babel-gulp-boilerplate.git <yourAppName>
$ cd <yourAppName>
$ npm install

然后你可以“启动”它,来进行开发和调试:

$ gulp watch

这时候会自动打开浏览器新窗口http://localhost:3000,然后你会看到Hello World

最后如果你想打包代码,可以:

$ gulp build

最后

希望大家多多支持,多多指出不足,提出建议。

相关文章

一、前言 在组件方面react和Vue一样的,核心思想玩的就是组件...
前言: 前段时间学习完react后,刚好就接到公司一个react项目...
前言: 最近收到组长通知我们项目组后面新开的项目准备统一技...
react 中的高阶组件主要是对于 hooks 之前的类组件来说的,如...
我们上一节了解了组件的更新机制,但是只是停留在表层上,例...
我们上一节了解了 react 的虚拟 dom 的格式,如何把虚拟 dom...