React+Webpack+ES6环境搭建(自定义框架)

引言

　　目前React前端框架是今年最火的。而基于React的React Native也迅速发展。React有其独特的组件化功能与JSX的新语法，帮助前端设计有了更好的设计与便捷，而React Native更是扩大了前端的边界。

　　说道React，那就不得不说一下Webpack凭借它异步加载和可分离打包等优秀的特性，走在取代Grunt和Gulp的路上。而面向未来的ES6，更是支持模块化处理。

　　下面我就分享一下关于Webpack+React+ES6的环境搭建（通用）【附加发布版】

准备工作

　　首先需要准备的就是WebStorm以及安装node.js，这里我给出自己云盘上的下载地址，亲测可用。对应的地址如下：

　　WebStorm：链接：http://pan.baidu.com/s/1o787Av4 密码：z176

　　node.js：链接：https://nodejs.org/en/ 官网

让我们跑起来

　　1、新建项目EChartDemo（我这里后续会使用一些相关的百度绘画组件，故以此命名，但这里只做框架构建，暂不引入百度绘画组件），更改文件-->设置 ES6环境，如图所示：

'use strict';
import Index from './';
export default {
component: Index,
path: '/'
}

View Code

后记

　　至此，所有配置全部都已经完成了，如果想运行查看则只要输入”npm start“就可以调试查看啦~如果想发布则输入”npm prod“就行了。

　　附上Demo源代码地址：如果感觉可以的话，请给个Star哦~

　　地址：https://github.com/JaminHuang/EChartDemo