//entry.js

require("!style!css!./style.css");
require("./hello.jsx"); // document.write("It works.");
document.write(require("./content.js"));
//hello.jsx
var React = require('react'); var e = document.createElement('div');
e.id='example';
document.body.appendChild(e); React.render(
<h1>Hello, world!</h1>,
document.getElementById('example')
);
module.exports = {
entry: "./entry.js",
output: {
path: __dirname,
filename: "bundle.js"
},
module: {
loaders: [
{ test: /\.css$/, loader: "style!css" },
{ test: /\.jsx$/, loader: "jsx-loader" }
]
}
};

http://jslog.com/2014/10/02/react-with-webpack-part-1/

http://gaearon.github.io/react-hot-loader/getstarted/

React with webpack的更多相关文章

  1. react+react-router+webpack+express+nodejs

    react+react-router+webpack+express+nodejs   做SinglePageApplication 支持热加载+ES6 有开发模式和发布模式 https://gith ...

  2. 入门React和Webpack

    最近在学习React.js,之前都是直接用最原生的方式去写React代码,发现组织起来特别麻烦,之前听人说用Webpack组织React组件得心应手,就花了点时间学习了一下,收获颇丰 说说React ...

  3. reactjs学习一(环境搭配react+es6+webpack热部署)

    reactjs学习一(环境搭配react+es6+webpack热部署) 本文的源码在这里下载 https://github.com/tianxiangbing/webpack-study   或者使 ...

  4. spring + spring mvc + mybatis + react + reflux + webpack Web工程例子

    前言 最近写了个Java Web工程demo,使用maven构建: 后端使用spring + spring mvc + mybatis: 前端使用react + react-router+ webpa ...

  5. 轻松入门React和Webpack

    最近在学习React.js,之前都是直接用最原生的方式去写React代码,发现组织起来特别麻烦,之前听人说用Webpack组织React组件得心应手,就花了点时间学习了一下,收获颇丰 <!-- ...

  6. 在React+Babel+Webpack环境中使用ESLint

    ESLint是js中目前比较流行的插件化的静态代码检测工具.通过使用它可以保证高质量的代码,尽量减少和提早发现一些错误.使用eslint可以在工程中保证一致的代码风格,特别是当工程变得越来越大.越来越 ...

  7. React+ES6+Webpack环境配置

    转自http://www.cnblogs.com/chenziyu-blog/p/5675086.html 参考http://www.tuicool.com/articles/BrAVv2y Reac ...

  8. React配合Webpack实现代码分割与异步加载

    这是Webpack+React系列配置过程记录的第四篇.其他内容请参考: 第一篇:使用webpack.babel.react.antdesign配置单页面应用开发环境 第二篇:使用react-rout ...

  9. React+ES6+Webpack深入浅出

    React已成为前端当下最热门的前端框架之一 , 其虚拟DOM和组件化开发让前端开发更富灵活性,而Webpack凭借它异步加载和可分离打包等优秀的特性,更为React的开发提供了便利.其优秀的特性不再 ...

  10. react+babel+webpack初试

    在上一篇,我们简单学习了webpack学习,现在这里我们简单学习一下react+babel+webpack,进行编译react语法jsx以及结合es6写法. 这里我就简单的直接上demo: packa ...

随机推荐

  1. 【2017.10.13 ROS机器人操作系统】ROS系统常用术语及资源

    ROS机器人操作系统是一种后操作系统,提供了类似于软件开发中使用到的中间件的功能. ROS: Robot Operating System 机器人操作系统 Package: 功能包 Stack: 功能 ...

  2. December 11th 2016 Week 51st Sunday

    If a thing is worth doing it is worth doing well. 如果事情值得做,那就做好. If it is worth doing, then it is wor ...

  3. python使用SQLAlchemy对mysql操作

    安装SQLAlchemy pip install sqlalchemy 在MySQL的test数据库中创建的user表,用SQLAlchemy来试试 数据库连接 第一步,导入SQLAlchemy,并初 ...

  4. Java虚拟机6:垃圾收集(GC)-1(内存溢出和内存泄漏的区别)

    1.前言 在进行垃圾收集之前需要普及几个比较重要的概念. 2.内存溢出和内存泄露的概念和区别: (1):内存溢出(out of memory):是指程序在申请内存时,没有足够的内存空间可以分配,系统不 ...

  5. UVa 10288 - Coupons(数学期望 + 递推)

    链接: https://uva.onlinejudge.org/index.php?option=com_onlinejudge&Itemid=8&page=show_problem& ...

  6. 【[AHOI2009]同类分布】

    这是一篇有些赖皮的题解 (如果不赖皮的话,bzoj上也是能卡过去的) 首先由于我这个非常\(sb\)的方法复杂度高达\(O(171^4)\),所以面对极限的\(1e18\)的数据实在是卡死了 但是这个 ...

  7. ionic和angularjs的区别?

    a.ionic是一个用来开发混合手机应用的,开源的,免费的代码库.可以优化HTML.css和js的性能,构建高效的应用程序,而且还可以用于构建sass和angularJS的优化 b.AngularJS ...

  8. Java50道经典习题-程序33 杨辉三角

    题目:打印出杨辉三角形(要求打印出10行如下图)分析:          1         1 1        1 2 1      1 3 3 1    1 4 6 4 11 5 10 10 5 ...

  9. C#简单实现LRU缓存

    最近跟同学吃饭扯淡的时候,由技术扯到薪资,又由薪资扯到他找工作时跟面试官是怎么扯淡拿高工资的,各种技术一顿侃,总之只要啥都了解就没问题了.谈到缓存的时候,我试探性的问了问- -你还记得LRU怎么写吗, ...

  10. Stacktrace: org.apache.jasper.servlet.JspServletWrapper.handleJspException(JspServletWrapper.java:5

    jsp页面出现如下异常: Stacktrace: at org.apache.jasper.servlet.JspServletWrapper.handleJspException(JspServle ...